Une page peut sembler bien organisée visuellement tout en restant difficile à comprendre avec un lecteur d’écran. Les titres H1, H2 et H3 jouent un rôle important : ils structurent le contenu et permettent de repérer rapidement les différentes parties d’une page.
Un bon balisage ne consiste pas à choisir un niveau de titre uniquement pour sa taille visuelle. Il faut construire une hiérarchie logique qui reflète réellement l’organisation du contenu.
À quoi servent les titres pour un lecteur d’écran ?
De nombreux lecteurs d’écran permettent de parcourir rapidement la liste des titres présents dans une page. Cette navigation aide l’utilisateur à comprendre la structure générale sans devoir écouter chaque paragraphe depuis le début.
Lorsque les titres sont bien organisés, il devient plus facile de passer directement à une section importante, de revenir en arrière ou de comprendre comment les différentes parties du contenu s’articulent.
Quelle est la différence entre H1, H2 et H3 ?
Les niveaux de titres représentent une hiérarchie :
- H1 correspond généralement au titre principal du contenu ;
- H2 introduit les grandes sections de la page ;
- H3 permet de subdiviser une section H2 lorsque cela est utile ;
- les niveaux suivants peuvent continuer cette organisation lorsque le contenu devient plus complexe.
Le plus important est de préserver une structure logique et compréhensible, plutôt que d’utiliser un niveau de titre uniquement pour obtenir un style visuel particulier.
Faut-il obligatoirement un seul H1 par page ?
Dans la pratique, utiliser un titre principal clair pour la page est une organisation simple et robuste. L’essentiel, du point de vue de l’accessibilité, est que la hiérarchie des titres permette de comprendre la structure du contenu.
Un H1 ne doit donc pas être choisi parce qu’il est plus gros, mais parce qu’il représente le niveau principal du sujet traité.
Peut-on passer directement d’un H2 à un H4 ?
Une hiérarchie cohérente évite normalement de créer des sauts de niveau sans raison. Passer d’un H2 à un H4 peut rendre la structure plus difficile à interpréter si aucun niveau H3 ne justifie cette sous-section.
Il est préférable de construire les niveaux de titres selon la logique du contenu : une sous-partie d’un H2 devient généralement un H3, puis une sous-partie de ce H3 peut devenir un H4.
Pourquoi un texte en gros caractères n’est-il pas forcément un titre ?
Une phrase affichée en grand et en gras peut sembler être un titre pour une personne qui voit la page, tout en restant un simple paragraphe dans le code.
Un lecteur d’écran ne se base pas uniquement sur l’apparence visuelle. Si le texte joue réellement le rôle d’un titre, il doit être balisé comme tel afin que sa fonction soit correctement transmise.
Et inversement : peut-on utiliser un H2 uniquement pour agrandir un texte ?
Non. Un élément H2 doit représenter une section de niveau correspondant. Utiliser des titres uniquement pour obtenir une taille de police particulière crée une structure trompeuse.
La présentation visuelle doit être gérée avec les styles du site, tandis que le balisage HTML doit refléter le sens et la structure du contenu.
Les titres doivent-ils être explicites ?
Oui. Des intitulés comme “Informations”, “Suite” ou “En savoir plus” peuvent manquer de contexte lorsqu’ils sont lus isolément.
Un titre utile décrit clairement la section qu’il introduit. Cela aide les personnes utilisant un lecteur d’écran, mais aussi les autres visiteurs qui parcourent rapidement la page.
Comment vérifier la structure des titres d’une page ?
Un premier contrôle consiste à extraire ou afficher la liste des titres H1 à H6 dans l’ordre où ils apparaissent.
Il faut ensuite vérifier :
- que le sujet principal de la page est identifiable ;
- que les grandes sections utilisent un niveau cohérent ;
- que les sous-sections sont correctement rattachées à leur section principale ;
- que les niveaux ne sont pas utilisés uniquement pour leur apparence ;
- que les intitulés restent compréhensibles lorsqu’ils sont lus séparément.
Le lecteur d’écran ne dépend pas uniquement des titres
Les titres sont importants, mais ils ne suffisent pas à rendre une page accessible. La structure sémantique comprend aussi les liens, boutons, formulaires, listes, zones de navigation, contenus principaux et autres éléments qui doivent être correctement identifiés.
Un lecteur d’écran s’appuie sur ces informations pour restituer le rôle des composants et faciliter la navigation.
Quel lien avec les images et les formulaires ?
Une bonne structure de titres aide à se déplacer dans la page, tandis que les alternatives textuelles rendent les images compréhensibles et que les libellés permettent d’utiliser les formulaires.
L’accessibilité repose donc sur un ensemble cohérent : structure des contenus, navigation clavier, textes alternatifs, messages d’erreur, contrastes, zoom et autres éléments du parcours.
Que prévoient les WCAG 2.2 ?
Les WCAG 2.2 prévoient notamment que les informations, relations et structures pouvant être déterminées visuellement puissent aussi être déterminées de manière programmatique lorsque cela est pertinent. Les titres et libellés doivent également décrire le sujet ou la fonction du contenu qu’ils introduisent.
La présence de balises H1, H2 ou H3 ne suffit donc pas à elle seule : leur organisation et leur pertinence doivent être vérifiées dans le contexte réel de la page.
Que peut vérifier DOMMAT ?
Dans le cadre d’un audit ou d’un contrôle d’accessibilité, DOMMAT peut examiner la hiérarchie des titres, la structure sémantique des contenus et la manière dont les principaux éléments sont restitués dans le périmètre convenu.
Pour aller plus loin, consultez ce que vérifie un audit d’accessibilité web, l’approche Accessibilité DOMMAT, notre article sur le texte alternatif des images ou celui consacré aux formulaires accessibles.
Vous pouvez également présenter votre besoin d’accessibilité.