Titre de page

Ce que le critère exige

L’élément <title> dans l’en-tête du document doit décrire le sujet de la page. Les utilisateurs de lecteurs d’écran l’entendent dès le chargement de la page — c’est le premier repère d’orientation qu’ils reçoivent. Les utilisateurs voyants le voient dans l’onglet du navigateur, dans leur historique, lors d’un favori et dans les pages de résultats de recherche. Un titre qui ne satisfait pas ce critère laisse tous ces utilisateurs dans l’incertitude quant à la page sur laquelle ils ont atterri.

Le titre n’a pas besoin d’être poétique. Il doit être précis. « Accueil » ne suffit pas. « Tarifs — Acme CRM » convient.

Comment s’y conformer

• Rédiger un titre qui nomme d’abord la page, puis le site : "Hôtels accessibles en fauteuil roulant à Berlin — Disability World".
• Mettre à jour le titre côté client lors des changements de route dans les applications monopages. Next.js, React Router et Vue Router nécessitent tous des mises à jour explicites de document.title ou des utilitaires propres au framework.
• Refléter les erreurs de formulaire et les résultats de recherche dans le titre : "3 erreurs — Paramètres du compte" ou "Recherche : fatigue chronique — 47 résultats".
• Placer les informations les plus distinctives au début. Dans un onglet de 30 caractères, « Disability World — Comment déposer une demande d’AAH » cache le sujet.
• Pour les formulaires en plusieurs étapes, inclure l’étape : "Étape 2 sur 4 : Adresse — Demande de prestations".

Échecs courants

• Titres génériques à l’échelle du site : chaque page affiche "Acme Inc." parce que le gabarit ne remplace jamais la valeur par défaut.
• <title></title> vide — étonnamment fréquent lorsque les gabarits CMS supposent que le rédacteur le remplit toujours.
• Routes de SPA sans titre : le HTML initial comporte un titre générique et le routeur ne le met jamais à jour lors de la navigation.
• Le titre est uniquement le nom de la marque sans sujet de page ("Acme" sur les pages contact, tarifs et produits).
• « Untitled Document » provenant d’une exportation d’éditeur WYSIWYG.

Pourquoi c’est important

Pour un utilisateur de lecteur d’écran, le titre de la page est l’équivalent du regard porté en haut de la fenêtre du navigateur — il lui indique s’il est là où il voulait aller. Sans lui, chaque page sonne identiquement au chargement. Il est également essentiel pour le référencement et les aperçus de liens, ce qui fait de la correction de ce critère une argumentation facile auprès des équipes produit, marketing et contenu.