Les titres H1-H6 et référencement : tout ce dont vous devez savoir !
Les balises titres en bref
Les titres (nommée Hn) donnent à vos visiteurs et aux moteurs de recherche des indices importants sur la hiérarchie et la pertinence de votre contenu.
Il existe six « niveaux d’importance », du titre H1 le plus important au titre H6 le moins important.
Que sont les titres Hn?
Les titres sont des phrases situées au début d’une section qui en expliquent le contenu. L’utilisation correcte des titres sur une page permet d’établir une hiérarchie et une vue d’ensemble, et contribue à communiquer rapidement le contenu d’une page Web.
Ils aident les visiteurs à parcourir rapidement une page et les moteurs de recherche à comprendre rapidement la structure et le contenu d’une page.
Il existe six niveaux de balises titres : H1 à H6, dont les titres H1, H2 et H3 sont les plus fréquemment utilisés. Les titres sont définis dans le code HTML d’une page.
La balise titre H1 est souvent appelée « titre principal », tandis que les titres H2-H6 sont appelés « sous-titres » car ils indiquent les sous-niveaux.
Qu’en est-il des titres Hn?
Les gens font souvent référence aux « balises d’en-tête » lorsqu’ils parlent de titres.
Pour éviter toute confusion, prenons un exemple et regardons l’élément de titre H1 tel qu’il apparaît dans la source HTML :
<h1>C'est le titre H1</h1> :
<h1> :balise d’ouverture de titre H1Voici le titre H1: le texte qui apparaîtra sur l’écran d’un visiteur comme titre H1.</h1>: balise de fermeture de titre H1
Et qu’en est-il des balises d’en-tête ?
Tout d’abord, ne confondez pas les balises titres avec la section <head>. Deuxièmement, les balises d’en-tête sont souvent utilisées à tort pour désigner les titres.
En réalité, elles peuvent être utilisées pour définir l’en-tête d’un document ou d’une section. Cela signifie qu’elles peuvent être enroulées autour d’aides à la navigation ou autour de titres. Leur utilisation est facultative, voici un exemple :
<html> <head> <title>En-têtes H1-H6 et SEO</title> </head> <body> <article> <header> #en-tête <h1>Les balises d'en-tête expliquées</h1> <h2>Une brève introduction aux balises d'en-tête</h2>. # balise titre </header> </article> </body></html>
Ressources utiles
Les balises <header> expliquées (s’ouvre dans un nouvel onglet en anglais) par Mozilla.
Pourquoi utiliser des Titres Hn?
Les titres sont utiles tant pour les visiteurs que pour les moteurs de recherche :
- Les visiteurs utilisent les titres pour parcourir rapidement une page et déterminer si elle est pertinente pour eux. De plus, les visiteurs malvoyants utilisent des lecteurs d’écran pour naviguer sur le Web. Et les lecteurs d’écran s’appuient sur les titres pour « comprendre » les pages Web et aider leurs utilisateurs à naviguer.
- Les moteurs de recherche utilisent les titres pour comprendre la structure d’une page et les sujets dont elle traite. Bien qu’il ne s’agisse que d’un facteur mineur dans les algorithmes de classement des moteurs de recherche, l’inclusion de mots clés dans les titres contribue à améliorer les performances de référencement. Même si vous n’êtes pas d’accord avec l’idée que les titres constituent un petit facteur de classement, gardez à l’esprit que tout ce que vous faites pour améliorer l’expérience utilisateur se traduit généralement par de meilleures performances de référencement.
Rubriques et extraits de texte
Les moteurs de recherche peuvent afficher des « featured snippets », c’est-à-dire des extraits spéciaux d’une page, dans leurs SERP. Ils doivent comprendre le contenu suffisamment bien pour choisir ces extraits en toute confiance, et ils s’appuient sur les titres pour y parvenir.
En résumé, une utilisation intelligente et correcte des titres vous aide à apparaître dans les extraits vedettes, ce qui accroît votre visibilité dans les SERP et génère davantage de trafic organique vers votre site.
Voici un exemple de « featured snippet » pour notre site :
Cet extrait est tiré de cette section de notre guide robots.txt :
Pourquoi s’intéresser à robots.txt ?
Le fichier robots.txt joue un rôle essentiel du point de vue du référencement. Il indique aux moteurs de recherche la meilleure façon d’explorer votre site Web.
À l’aide du fichier robots.txt, vous pouvez empêcher les moteurs de recherche d’accéder à certaines parties de votre site Web, empêcher le contenu dupliqué et donner aux moteurs de recherche des conseils utiles sur la façon dont ils peuvent explorer votre site Web plus efficacement.
Hiérarchie des titres Hn
Les titres doivent être structurés logiquement sur une page. Une page commence par un titre H1, suivi d’un titre H2 et – si vous avez besoin d’une autre sous-section – il peut être suivi d’un titre H3. Si vous avez besoin de plus de sous-sections, vous pouvez même ajouter des sous-titres H4-H6.
Dans l’illustration ci-dessous, nous utilisons trois niveaux de titres :
Ne sautez pas de niveau dans la hiérarchie. Par exemple, ne passez pas d’un titre H1 à un titre H3. Il doit y avoir un titre H2 entre les deux.
Voici un bon exemple d’utilisation correcte d’un titre :
<h1>Ceci doit décrire le sujet de la page</h1>.
<h2>C’est un sous-titre H2</h2>
<h3>Ceci est un sous-titre H3</h3>
<h2>C’est un autre sous-titre H2</h2>
<h3>C’est un autre sous-titre H3</h3>
Si vous écrivez du contenu long, vous pouvez aller jusqu’au bout avec les titres. Vous pourriez avoir une structure de titre comme :
<h1>Ceci devrait décrire le sujet de la page</h1>.
<h2>C’est un sous-titre H2</h2>
<h2>C’est un autre sous-titre H2</h2>
<h3>Ceci est un sous-titre H3</h3>
<h4>C’est un sous-titre H4</h4>
<h5>Ceci est un sous-titre H5</h5>
<h6>Ceci est un sous-titre H6</h6>
<h2>C’est encore un autre sous-titre H2</h2>
<h3>Ceci est un sous-titre H3</h3>
<h4>Ceci est un sous-titre H4</h4>
<h5>Ceci est un sous-titre H5</h5>
<h6>Ceci est un sous-titre H6</h6>
Et voici un exemple de hiérarchie de titres que vous devriez éviter :
<h2>Pourquoi ce H2 est-il en haut ? </h2>
<h4>Et pourquoi un titre H4 ici ? </h4>
<h1>Ce titre H1 aurait en fait dû être en haut</h1>.
<h3>Un titre H3 aléatoire ici</h3>
Quelle taille pour les titres Hn?
Plus vous descendez dans les rubriques, plus celles-ci doivent être petites. Le titre H1 doit être le plus grand titre de la page. Le titre H2 est un peu plus petit que le titre H1, et à son tour le titre H3 est plus petit que le titre H2, et ainsi de suite.
Parce qu’une image vaut mieux que mille mots, regardons notre guide sur la structure d’une URL sans les paragraphes :
Ordre des titres Hn dans la source HTML
L’ordre dans lequel les titres apparaissent dans votre source HTML n’a pas d’importance. L’ordre dans lequel les titres sont présentés sur l’écran d’un visiteur (ou lorsqu’une page est rendue par les moteurs de recherche) est déterminant.
Titre H1
Le titre H1 décrit le sujet principal d’une page. Il doit avoir un lien étroit avec le contenu de la page, être unique sur votre site Web et une page ne doit contenir qu’un seul titre H1.
Ne placez pas le titre H1 autour d’une image, car les moteurs de recherche ne comprennent pas les images aussi bien que les textes. Vous perdriez une occasion de signaler aux moteurs de recherche le sujet d’une page.
<h1><img src="logo.png"></h1>
Votre titre H1 peut correspondre à la balise title de votre page, mais ce n’est pas nécessaire. Les visiteurs sont beaucoup plus susceptibles de remarquer votre titre H1 que la balise title de votre page, donc il faut toujours s’assurer en priorité que votre titre H1 a du sens pour vos visiteurs.
<title>Qu'est-ce qu'un titre H1-H6 ?</title>
<h1>Les titres H1-H6 expliqués</h1>
Questions fréquemment posées
Le titre H1 expliqué en détail (article à venir)
Longueur du titre H1
Vous devez éviter de rendre le titre H1 trop long. Si vous le faites, il y a de fortes chances que le titre H1 ne soit pas lisible pour vos visiteurs, ce qui nuit à leur expérience utilisateur.
Nous vous recommandons de vous en tenir à une longueur maximale de 60 caractères, comme pour la balise title. Quant à la longueur minimale, elle doit être suffisamment longue pour avoir un sens.
D’après notre expérience, il est préférable de s’en tenir à minimum 4 caractères. Mais avant tout, assurez-vous que le titre H1 a du sens pour vos visiteurs.
Plusieurs titres H1 ? Pas même en HTML5.
Lorsque la spécification HTML5 a été introduite pour la première fois, la prise en charge de plusieurs titres H1 par page (chacun dans son propre élément de section) était incluse.
Cependant, comme les navigateurs n’ont pas adopté cette recommandation, cette prise en charge a été abandonnée lors de la publication de la norme HTML5.1.
Pour plus d’informations, consultez ce fil de discussion du W3C (s’ouvre dans un nouvel onglet et en anglais).
Autres utilisations du Titre H1
Si vous n’avez pas défini de titre de page, ou si les moteurs de recherche n’ont pas trouvé votre titre suffisamment pertinent, ils peuvent afficher le titre H1 de la page comme titre dans le résultat du moteur de recherche de la page – son extrait.
Titres H2-H6
Les Titres H2-H6 sont utilisés pour structurer davantage le contenu.
La plupart des pages gagnent à avoir au moins un sous-titre H2, mais si cela n’a pas de sens pour les visiteurs, vous pouvez le laisser de côté.
Utilisez les sous-titres H2-H6 lorsque cela a un sens, et gardez à l’esprit de ne pas sauter de niveaux de titre.
Questions fréquemment posées sur les titres
Les titres améliorent-ils vraiment mon classement ?
Oui, c’est le cas ! Aujourd’hui encore, les titres jouent un rôle dans la communication de la pertinence des mots clés aux moteurs de recherche.
Bien que le rôle des titres dans les algorithmes des moteurs de recherche ait diminué au fil des ans, ils envoient un signal clair aux moteurs de recherche concernant le sujet d’une page.
Le titre de ma page et le Titre H1 peuvent-ils être identiques ?
Oui, c’est possible. Mais gardez à l’esprit de toujours choisir un titre H1 qui a le plus de sens pour vos visiteurs.
Puis-je avoir plusieurs titres H1 sur une même page ?
Il est recommandé d’utiliser un seul titre H1 par page. Les titres H1 multiples par page ont été introduits avec HTML5, mais les navigateurs n’ont pas adopté cette pratique. Depuis HTML5.1, il n’y a plus de prise en charge de plusieurs Titre H1.