Hiérarchie des titres Hn : structurer vos pages pour l'accessibilité et le SEO

Pourquoi la structure des titres compte

Les personnes qui utilisent un lecteur d'écran naviguent souvent de titre en titre pour parcourir une page, comme on parcourt un sommaire. Si les titres sont mal structurés ou absents, cette navigation devient impossible et le contenu paraît désorganisé. Côté référencement, une structure de titres cohérente aide les moteurs à comprendre la hiérarchie de l'information : c'est donc un point où accessibilité et SEO convergent.

Un seul H1 par page

Le H1 décrit le sujet principal de la page et doit en général être unique : il joue le rôle de titre maître. Sur les sites de PME, c'est souvent le titre de l'article ou de la page de service. Utiliser plusieurs H1 ou n'en mettre aucun brouille la compréhension de la page, aussi bien pour les lecteurs d'écran que pour les moteurs de recherche. Réservez le H1 au titre central et descendez ensuite dans la hiérarchie.

Respecter l'ordre des niveaux, sans saut

Les niveaux de titre doivent s'enchaîner de manière logique : un H2 introduit une grande section, un H3 une sous-partie de ce H2, et ainsi de suite. Il ne faut pas sauter de niveau, par exemple passer d'un H2 directement à un H4, car cela rompt la structure perçue par les lecteurs d'écran. Choisissez le niveau d'un titre selon sa place dans la hiérarchie du contenu, et non selon la taille de police souhaitée, que vous ajusterez ensuite en CSS.

Ce que disent WCAG et le RGAA

Le critère WCAG 1.3.1 (niveau A) impose que la structure de l'information, dont les titres, soit véhiculée correctement dans le code et pas seulement par la mise en forme visuelle. Le critère WCAG 2.4.6 (niveau AA) demande quant à lui que les titres soient pertinents et décrivent bien le sujet de la section qu'ils introduisent. Concrètement, un vrai titre doit utiliser une balise de titre Hn, et non un simple texte mis en gras ou agrandi.

Questions fréquentes

Peut-on avoir plusieurs H1 sur une même page ?

Techniquement le HTML l'autorise, mais pour l'accessibilité et le SEO il est nettement préférable de n'utiliser qu'un seul H1 par page, qui en résume le sujet principal. Un H1 unique offre un point de repère clair aux lecteurs d'écran et aux moteurs de recherche. Les grandes sections suivantes doivent alors commencer en H2, pas en H1.

Est-ce grave de sauter un niveau de titre ?

Oui, car les lecteurs d'écran annoncent le niveau de chaque titre et leurs utilisateurs s'en servent pour comprendre l'imbrication des sections. Passer d'un H2 à un H4 laisse penser qu'un niveau intermédiaire manque et désoriente la lecture. Mieux vaut respecter l'enchaînement H1, H2, H3 et ajuster l'apparence visuelle séparément en CSS.

Faut-il choisir le niveau de titre selon la taille du texte ?

Non. Le niveau d'un titre doit refléter sa place dans la hiérarchie du contenu, pas sa taille à l'écran. Si un H3 vous paraît trop petit ou un H2 trop gros, gardez le niveau correct pour la structure et ajustez la taille avec du CSS. Mélanger les deux logiques casse la structure perçue par les outils d'assistance.

Un texte en gras peut-il remplacer un titre ?

Non. Un texte simplement mis en gras ou agrandi n'est pas identifié comme un titre dans le code, donc ni les lecteurs d'écran ni les moteurs ne le reconnaissent comme tel. C'est précisément ce que vise le critère WCAG 1.3.1 : la structure doit exister dans le code via les balises Hn, pas seulement à l'œil. Utilisez une vraie balise de titre, quitte à l'habiller ensuite en CSS.

Comment vérifier la hiérarchie des titres de mon site ?

Vous pouvez lister les titres d'une page avec une extension de navigateur dédiée ou les outils de développement pour visualiser leur enchaînement. Notre diagnostic gratuit détecte automatiquement les problèmes fréquents comme l'absence de H1, les H1 multiples et les sauts de niveau. Pour aller plus loin et vérifier la pertinence de chaque titre, un audit manuel apporte une analyse complète.