Bien construire sa hiérarchie de titres pour le référencement

Pour intégrer un site internet de la bonne manière, il est important de respecter la sémantique d’une page. C’est ce que j’évoquait dans mon article sur le sens des balises HTML. Et dans cette sémantique, la hiérarchisation des titres est quelque chose de très important.

Depuis un moment, je souhaitais réagir à un article sur la hiérarchie des titres publiés sur alsacreations. En lui-même, l’article est très bon et explique bien comment construire de manière sémantique et dans le respect des normes, une hiérarchie propre. Mais pour le référencement, il ne suffit pas de respecter ces règles. Il faut parfois tricher, je vais reprendre point par point ce très bon article et rajouter si besoin des infos pour le référencement.

Les titres de section

Ce que l’on appelle « hiérarchie des titres » ou plus simplement hiérarchie est l’ensemble des éléments titres de section balisés de H1 à H6 (que l’on appellera “Hn”). Le W3C définit le titre de section comme un élément qui décrit brièvement le sujet de la section qu’il introduit. Ce titre de section ne doit pas être confondu avec le titre de la page, balisé avec title, exclusivement dans le head du document.

Premier point important, c’est vrai qu’il faut bien différencier titre de section (balise Hn) et titre de la page. Mais pour les moteurs de recherche, la balise H1 reste le titre de la page. Il n’a pas à être identique à la balise TITLE mais il est en quelque sorte son équivalent dans la page. Je reviendrais sur le H1 en fin d’article.

La hiérarchie des titres sert principalement à structurer le document  mais elle a bien d’autres utilités, voire même nécessités :

• Pour les utilisateurs de lecteurs d’écran, les titres Hn sont un moyen efficace de naviguer dans la page, mais les logiciels de lecture d’écran ne peuvent générer une liste de titres compréhensible que si la hiérarchie des titres du site est correcte.
• Pour les robots indexeurs des moteurs de recherche, les titres de haut niveau représentent du contenu important et ont donc une pondération plus forte que le reste du contenu. Ces titres doivent donc être présents et bien utilisés.
• Les visiteurs scannent les pages d’un site plus qu’ils n’en lisent le contenu. Les titres de section et de sous-section étant des points de repère, il est important que ces titres soient présents et annoncent le contenu qui les suit.

Sur ces points, je suis tout à fait d’accord. J’en profite pour rappeler que les moteurs s’intéresse surtout aux balises H1 et H2.

Dans la pratique

La hiérarchie des titres d’une page web doit être :

• Logique : elle doit suivre le schéma d’une table des matières comme pour tout document textuel.
• Continue : elle doit commencer par un H1 et ne pas comporter de sauts de niveau (un H1 ne peut être directement suivi d’un H3, il doit y avoir au moins un H2 entre les deux).
• Pensée pour l’utilisateur, et non pour le référencement : les titres doivent être des titres et non des mots clés sans rapport avec ce qui suit, ni des paragraphes complets.
• Sémantique, et non visuelle : un élément Hn doit être utilisé pour sa valeur sémantique (titre de niveau n) et non pour son rendu visuel (qui peut être totalement transformé avec CSS).
• Ergonomique : Les utilisateurs sont habitués aux titres, ils les aident à se retrouver dans la page, tant papier que virtuelle, et à aller à l’essentiel de l’information. La présence de titres de section rend également le texte plus digeste et lisible  et de fait aide à retenir l’attention, très volatile sur Internet, du lecteur.

Tout ceci est tout à fait vrai et bien conforme à la sémantique. Mais il est possible de tricher dans l’organisation de la hiérarchie des titres, afin de mettre les H2 sur les titres porteurs de mots clefs. On peut ainsi perdre la continuité, ce qui n’est pas vraiment “propre”.

Note :

Peut-il y avoir plusieurs H1 dans une même page ?

Oui, c’est tout à fait possible. Bien que certains pensent que H1 ne doit être utilisé qu’une seule et unique fois dans la page  aucune règle, sémantique ou autre, ne tranche sur ce sujet. L’élément H1 doit désigner un titre de niveau 1, si la construction de la page implique la présence de plusieurs titres de niveau 1, il est tout à fait logique d’utiliser l’élément approprié : H1. Par contre, l’élément H1 ne doit en aucun cas être utilisé, à tort, pour « booster le référencement » d’un site en y mettant autre chose que des titres de niveau 1.

On arrive à la partie intéressante. Comme je disais au début de l’article, les moteurs considèrent la balise H1 comme un titre de la page et elle doit être unique. Mais la réponse donnée sur alsacreations.com est tout à fait vrai ! En terme de sémantique ou de norme W3C, rien n’indique que la balise H1 doit être unique.

On voit clairement ici la différence entre les normes sémantiques pures et la vision des pages par les moteurs. Pour moi les deux pratiques se défendent et ont de bons arguments.

1. Le fait de n’utiliser qu’un seul H1 permet d’avoir un titre unique dans BODY. Cette pratique offre à l’utilisateur un titre dans la page ce qui me parait être une bonne chose.
2. Utiliser plusieurs H1 dans une page, c’est tout simplement considérer que le titre de la page est dans la balise TITLE. La balise H1 devient ainsi un titre de section comme les autres.

Dans une optique d’un bon référencement dans les moteurs, c’est bien sur la première pratique que j’utilise et que je conseille.