Structure des titres : un H1 et un plan lisible

Si vous ne lisez que les intertitres d’une page, vous devriez pouvoir dire ce qu’elle enseigne. Beaucoup de pages échouent à ce test, parce que leurs titres ont été choisis pour leur apparence ou pour les mots clés qu’ils portent, et non pour le chemin qu’un lecteur suit dans le texte.

Ce que les titres apportent aux lecteurs, aux lecteurs d’écran et à Google

Les lecteurs se servent des titres pour décider si la page contient leur réponse, puis pour y sauter. Une page dont les titres disent « Introduction », « Détails » et « Suite » ne leur donne rien pour décider : ils lisent tout, ou ils partent. Les personnes qui utilisent un lecteur d’écran peuvent afficher la liste des titres et passer de l’un à l’autre, ce qui fait du plan leur table des matières. Un niveau sauté, ou un titre employé seulement pour grossir le texte, brouille cette carte.

La documentation de Google vous donne un lien concret. Quand il construit le lien de titre d’un résultat, il puise dans plusieurs sources : la balise title, le titre principal visible, les éléments h1, og:title, d’autres textes en évidence, les ancres d’autres pages et les données structurées WebSite. Quand Google réécrit un lien de titre, un H1 vague comme « Bienvenue » ou « Accueil » est l’un des endroits d’où le remplacement peut venir. Au-delà, nous ne connaissons aucune règle de Google sur le nombre de titres qu’une page doit avoir : les règles ci-dessous sont donc les nôtres.

• Un seul H1 par page, qui énonce le sujet et partage ses mots clés avec la balise title.
• Des H2 pour les sections principales, dans l’ordre où le lecteur en a besoin.
• Des H3 seulement à l’intérieur d’un H2 qui se divise vraiment en deux parties ou plus.
• Aucun niveau sauté : un H3 ne suit jamais directement un H1.

Notre analyse SEO applique exactement ces règles sous forme de 4 contrôles. Elle fait échouer une page sans H1 et alerte quand il y en a plusieurs, alerte quand le H1 et la balise title n’ont aucun mot significatif en commun, alerte quand un niveau est sauté, et attend au moins 1 H2 par tranche de 500 mots complets, en conseillant un intertitre environ tous les 300 à 500 mots. Ce sont nos seuils, pas ceux de Google.

La même page, mal et bien structurée

Prenons une page inventée sur la réparation d’une crevaison de vélo. Voici son plan tel que des modèles de page le produisent souvent, avec le niveau à gauche :

H1  Guide pneu de vélo
H3  Introduction
H2  Pneu
H4  Outils
H1  Nous contacter
H2  Lire aussi
H2  Conclusion

Ce plan cumule 5 défauts. Il y a 2 H1, le second probablement imprimé par le thème ou par un constructeur de pages. Le premier H1 ne dit rien de ce que le lecteur va apprendre. Les niveaux sautent de H1 à H3 et de H2 à H4. « Introduction », « Outils » et « Conclusion » conviendraient à n’importe quelle page jamais écrite, donc ils n’apportent aucune information. Enfin, « Nous contacter » et « Lire aussi » relèvent du mobilier de la page : ce sont des titres de widgets que le thème a codés comme des titres, et qui se retrouvent maintenant dans le plan de l’article.

Voici la même page avec un plan écrit pour le lecteur :

H1  Réparer une crevaison de vélo à la maison
H2  Ce qu'il faut avoir sous la main
H2  Trouver le trou avant de toucher à la chambre à air
H2  Poser une rustine ou changer la chambre à air
  H3  Quand une rustine suffit
  H3  Quand changer la chambre à air
H2  Remonter le pneu sans pincer la chambre à air
H2  Pourquoi le même pneu crève deux fois

Lues seules, ces lignes donnent toute la procédure et l’unique subtilité de la fin. Chaque H2 est une étape que le lecteur traverse, dans l’ordre. La paire de H3 existe parce que ce H2 se divise vraiment en 2 cas. Le H1 énonce la tâche, et la balise title peut le reprendre presque mot pour mot. La version solide n’a pas plus de mots que la faible : elle les dépense en information.

Écrivez les titres d’abord

Un plan faible vient souvent de ce qu’on écrit le texte d’abord, puis qu’on y colle des titres après coup, comme des étiquettes. Inversez l’ordre.

1. Écrivez en une ligne la question à laquelle répond la page. Cette ligne est votre H1.
2. Listez ce que le lecteur doit savoir ou faire, dans l’ordre où il en a besoin. Chaque élément est un candidat H2. Notre fourchette pour un guide de 900 à 1 800 mots est de 2 à 7 H2.
3. Lisez la liste à voix haute comme si c’était toute la page. Si elle répond à la question, la structure tient. Si un élément se dit en une phrase, ce n’est pas une section : fusionnez-le avec son voisin.
4. Rédigez le texte sous chaque titre. N’ajoutez des H3 que là où une section se divise en parties qu’un lecteur voudrait atteindre séparément.
5. Relisez les titres une fois le texte terminé et renommez ceux qui ne correspondent plus à ce que vous avez écrit.
6. Choisissez les niveaux pour la structure et réglez leur taille avec le CSS. Si un H3 paraît trop gros, restylez le H3 : ne passez pas à un H4.

Une dernière règle a sa place ici : ne masquez jamais un titre avec du CSS pour y glisser des mots clés. Les règles anti-spam de Google citent le texte caché, et un titre que les lecteurs ne voient pas n’est de toute façon pas un plan pour les lecteurs.

D’où viennent les mauvais plans

Peu de gens choisissent un plan cassé exprès. Il vient du modèle de page, et la correction se trouve en général à un seul endroit plutôt que sur chaque page.

Après une correction, contrôlez deux ou trois modèles (accueil, un article, une page de catégorie) plutôt que chaque URL. Si le modèle est bon, toutes les pages qui l’utilisent le sont.

Densité, sommaire et contrôle en dix secondes

Un titre au-dessus d’un seul court paragraphe dilue la page. Il promet une section et livre une phrase, et une page pleine de tels titres se lit comme une liste de fragments. Notre règle sur ce site est que chaque section sous un H2 compte au moins 100 mots, et si l’une n’y parvient pas, elle fusionne avec sa voisine ou devient un élément de liste. Le plancher de 1 H2 pour 500 mots de l’analyse et notre plancher de 100 mots par section sont des limites à ne pas franchir vers le bas, pas des objectifs à viser.

Sur une longue page, ajoutez un sommaire en tête. De simples liens d’ancre fonctionnent sans aucun script, et chaque titre a besoin d’un id pour les recevoir.

<nav aria-label="Sommaire">
  <ol>
    <li><a href="#ce-quil-faut">Ce qu'il faut avoir sous la main</a></li>
    <li><a href="#trouver-le-trou">Trouver le trou avant de toucher à la chambre à air</a></li>
  </ol>
</nav>

<h2 id="ce-quil-faut">Ce qu'il faut avoir sous la main</h2>

Pour voir le plan que votre page a réellement, collez ceci dans la console du navigateur sur n’importe quelle page. Il affiche chaque titre, indenté selon son niveau.

console.log([...document.querySelectorAll('h1,h2,h3,h4,h5,h6')]
  .map((h) => '  '.repeat(h.tagName[1] - 1) + h.tagName + '  ' + h.textContent.trim().replace(/\s+/g, ' '))
  .join('\n'));

Tout ce qui figure dans cette liste sans faire partie de votre article, comme « Articles récents » ou « Suivez-nous » entre 2 de vos H2, est un titre de widget codé comme un titre. Changez ces éléments en paragraphe ou en div et mettez-les en forme avec le CSS. Comparez ensuite votre H1 avec la balise title que vous comptez publier, en vous servant de l’aperçu du snippet pour voir l’allure de ce titre, et lisez balises title et meta description pour l’autre moitié de la façon dont votre page est nommée. Quand la page vise une recherche, vérifiez son intention de recherche avant d’arrêter le plan, car les titres sont l’endroit où un lecteur voit si vous avez répondu à la question qu’il posait.