L'article explore l'importance souvent sous-estimée du titre de page (
) dans l'expérience utilisateur. Au-delà de son rôle SEO, il aide les utilisateurs à identifier et naviguer entre les onglets, surtout dans des flux complexes comme les formulaires multi-étapes ou les résultats de recherche paginés. Des titres contextuels et uniques pour chaque écran améliorent significativement la navigation, comme illustré par l'exemple d'un formulaire d'assurance vélo.</p></div>
</div>
<div class="linklist-item-infos clear">
<div class="linklist-item-tags">
<i class="fa fa-tags" aria-hidden="true"></i>
<span class="label label-tag" title="Ajouter un tag">
<a href="/liens/add-tag/navigation">navigation</a>
</span>
·
<span class="label label-tag" title="Ajouter un tag">
<a href="/liens/add-tag/seo">seo</a>
</span>
·
<span class="label label-tag" title="Ajouter un tag">
<a href="/liens/add-tag/accessibilit%C3%A9">accessibilité</a>
</span>
·
<span class="label label-tag" title="Ajouter un tag">
<a href="/liens/add-tag/ux">ux</a>
</span>
·
<span class="label label-tag" title="Ajouter un tag">
<a href="/liens/add-tag/bonnes-pratiques">bonnes-pratiques</a>
</span>
·
<span class="label label-tag" title="Ajouter un tag">
<a href="/liens/add-tag/title">title</a>
</span>
</div>
<div class="linklist-item-infos-date-url-block pure-g">
<div class="linklist-item-infos-dateblock pure-u-lg-7-12 pure-u-1">
<a href="/liens/shaare/KwL0dQ" title="Permalien">
<span class="linkdate" title="Permalien">
<i class="fa fa-clock-o" aria-hidden="true"></i>
December 20, 2025 at 10:38:37 PM GMT+1
·
</span>
permalien
</a>
<div class="pure-u-0 pure-u-lg-visible">
·
<div class="linkqrcode">
<img data-permalink="https://htmhell.dev/adventcalendar/2025/20/" src="/liens/plugins/qrcode/qrcode.png" class="linklist-plugin-icon qrcode" title="QR-Code" alt="QRCode">
</div>
·
<span>
<a href="https://web.archive.org/web/https://htmhell.dev/adventcalendar/2025/20/">
<img class="linklist-plugin-icon" src="/liens/plugins/archiveorg/internetarchive.png" title="Voir sur archive.org" alt="archive.org" />
</a>
</span>
</div>
</div><div
class="linklist-item-infos-url pure-u-lg-5-12 pure-u-1">
<a href="https://htmhell.dev/adventcalendar/2025/20/" aria-label="The many lives of the page title - HTMHell" title="The many lives of the page title - HTMHell">
<i class="fa fa-link" aria-hidden="true"></i> https://htmhell.dev/adventcalendar/2025/20/
</a>
<div class="linklist-item-buttons pure-u-0 pure-u-lg-visible">
<a href="#" aria-label="Replier" title="Replier" class="fold-button"><i class="fa fa-chevron-up" aria-hidden="true"></i></a>
</div>
</div>
<div class="mobile-buttons pure-u-1 pure-u-lg-0">
<div class="linkqrcode">
<img data-permalink="https://htmhell.dev/adventcalendar/2025/20/" src="/liens/plugins/qrcode/qrcode.png" class="linklist-plugin-icon qrcode" title="QR-Code" alt="QRCode">
</div>
·
<span>
<a href="https://web.archive.org/web/https://htmhell.dev/adventcalendar/2025/20/">
<img class="linklist-plugin-icon" src="/liens/plugins/archiveorg/internetarchive.png" title="Voir sur archive.org" alt="archive.org" />
</a>
</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="plugin_zone_end_linklist" class="plugin_zone">
</div>
<div id="linklist-paging-bottom-block" class="pure-g link-count-block">
<div class="pure-u-lg-2-24 pure-u-1-24"></div>
<div id="linklist-paging-bottom-content" class="pure-u-lg-20-24 pure-u-22-24">
<div class="linklist-paging">
<div class="paging pure-g">
<div class="linklist-filters pure-u-1-3">
<span class="linklist-filters-text pure-u-0 pure-u-lg-visible">
Filtres
</span>
<a href="/liens/untagged-only" aria-label="Filtrer par liens sans tag" title="Filtrer par liens sans tag"
class="filter-off"
><i class="fa fa-tag" aria-hidden="true"></i></a>
<a href="#" class="filter-off fold-all pure-u-lg-0" aria-label="Replier tout" title="Replier tout">
<i class="fa fa-chevron-up" aria-hidden="true"></i>
</a>
</div>
<div class="linklist-pages pure-u-1-3">
</div>
<div class="linksperpage pure-u-1-3">
<div class="pure-u-0 pure-u-lg-visible">Liens par page</div>
<a href="/liens/links-per-page?nb=20"
class="selected">20</a>
<a href="/liens/links-per-page?nb=50"
>50</a>
<a href="/liens/links-per-page?nb=100"
>100</a>
<form method="GET" class="pure-u-0 pure-u-lg-visible" action="/liens/links-per-page">
<input type="text" name="nb" placeholder="133"
>
</form>
<a href="#" class="filter-off fold-all pure-u-0 pure-u-lg-visible" aria-label="Replier tout" title="Replier tout">
<i class="fa fa-chevron-up" aria-hidden="true"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</main>
<div class="pure-g">
<div class="pure-u-2-24"></div>
<footer id="footer" class="pure-u-20-24 footer-container" role="contentinfo">
<i class="fa fa-shaarli" aria-hidden="true"></i>
<strong><a href="https://github.com/shaarli/Shaarli">Shaarli</a></strong>
·
Le gestionnaire de marque-pages personnel, minimaliste, et sans base de données par la communauté Shaarli ·
<a href="/liens/doc/html/index.html" rel="nofollow">Documentation</a>
</footer>
<div class="pure-u-2-24"></div>
</div>
<script src="/liens/plugins/qrcode/shaarli-qrcode.js"></script>
<script src="/liens/plugins/playvideos/youtube_playlist.js"></script>
<div id="js-translations" class="hidden" aria-hidden="true">
<span id="translation-fold">Replier</span>
<span id="translation-fold-all">Replier tout</span>
<span id="translation-expand">Déplier</span>
<span id="translation-expand-all">Déplier tout</span>
<span id="translation-delete-link">Êtes-vous sûr de vouloir supprimer ce lien ?</span>
<span id="translation-delete-tag">Êtes-vous sûr de vouloir supprimer ce tag ?</span>
<span id="translation-shaarli-desc">
Le gestionnaire de marque-pages personnel, minimaliste, et sans base de données par la communauté Shaarli
</span>
</div>
<input type="hidden" name="js_base_path" value="/liens" />
<input type="hidden" name="token" value="1f14ebb251c94a05db412bc61413ca5c9a4a5443" id="token" />
<input type="hidden" name="tags_separator" value=" " id="tags_separator" />
<script src="/liens/tpl/default/js/shaarli.min.js?v=8ba283f85e9a4dc050ce550fb96a14315538546b28852cf4bd5372ee6fdd7f20"></script>
<script src="/liens/tpl/default/js/thumbnails.min.js?v=8ba283f85e9a4dc050ce550fb96a14315538546b28852cf4bd5372ee6fdd7f20"></script>
</body>
</html>