Un client m'envoie un mail paniqué l'an dernier : « Mon article ne remonte plus, on m'a dit que j'avais un problème de H1. » Je regarde la page. Il y avait quatre H1. Quatre. Dont un dans le logo du header, un autre en bas de page dans le formulaire newsletter, et deux dans le corps de l'article parce qu'il trouvait ça « plus joli » en gros dans l'éditeur WordPress. Le contenu n'avait rien d'autre de cassé. Juste cette hiérarchie qui ne voulait plus rien dire.
Les erreurs fréquentes dans l'utilisation des balises H1 à H6 ont un point commun : elles sont presque toujours visuelles avant d'être techniques. On les commet parce qu'on regarde sa page avec les yeux, pas avec la structure. Et quand on corrige ça, on ne gagne pas seulement en référencement : on gagne en lisibilité, en accessibilité, et même en vitesse de publication.
Points clés à retenir
- Le H1 est le titre principal de la page : il dit de quoi parle le document, une seule fois, en clair.
- Un H2 utilisé uniquement pour grossir un texte est une erreur de balisage, pas un détail esthétique.
- Sauter un niveau (H2 → H4) casse la lecture pour les moteurs et pour les lecteurs d'écran.
- Les Hn du header et du footer se répètent sur tout le site : à vérifier avant de chercher plus loin.
- Une page peut aussi ne pas être indexée pour des raisons qui n'ont rien à voir avec les titres.
Les erreurs de balises H1 à H6 qu'on voit partout (et comment les reconnaître)
Il y a un test tout bête. Prenez votre page, supprimez mentalement toute la mise en forme. Il ne reste que les titres. Est-ce que la structure tient encore debout ? Si vous ne pouvez pas répondre « oui » en trois secondes, il y a un problème.
Erreur n°1 : plusieurs H1 sur la même page
La convention la plus solide du métier : un seul H1 par page. Ce n'est pas une loi divine, mais c'est ce que la majorité des thèmes, des CMS et des outils d'audit supposent. Et surtout, c'est ce qui permet à un correcteur de structure de vous signaler une incohérence au lieu de vous laisser deviner.
Le coupable n'est presque jamais l'auteur. C'est le template. Un logo encapsulé dans un H1 dans le header, un titre de widget dans la sidebar, un « Nos dernières actualités » en H1 dans le footer : voilà trois H1 qui s'ajoutent sans que personne ne les ait écrits. Sur un site que j'ai repris en 2024, le compteur affichait sept H1 sur la page d'accueil. Sept. Le client était persuadé que son contenu était le problème.
Comment repérer l'erreur ? Ouvrez la page, puis affichez le code source ou passez par l'inspecteur. Cherchez toutes les occurrences de <h1. Si vous en trouvez plus d'une, vous avez votre réponse.
Erreur n°2 : sauter des niveaux
Passer directement d'un H2 à un H4, c'est comme numéroter des chapitres 1, puis 3, puis 7. Le lecteur comprend qu'il manque quelque chose, même inconsciemment. Les technologies d'assistance, elles, s'appuient sur cette hiérarchie pour naviguer : un saut de niveau casse cette navigation.
Le cas typique ? Vous avez un H2 « Nos services », puis trois offres. Vous voulez que chaque offre ressorte, vous mettez des H4 parce que le style vous plaît mieux. Le bon réflexe : ce sont des H3. Si le style ne vous convient pas, on change le CSS, pas la balise.
Erreur n°3 : utiliser les Hn pour la taille du texte
Franchement, c'est l'erreur la plus répandue et la plus difficile à faire admettre. Un titre HTML n'est pas un outil de mise en forme. C'est une déclaration sémantique. Le jour où vous mettez un H3 sur un paragraphe parce qu'il « fait plus joli », vous dites au passage à tous les moteurs et à tous les lecteurs d'écran : « ceci est un sous-titre important ». Ce ne l'est pas.
J'ai fait cette erreur pendant des mois sur mon propre blog. Je mettais des H3 dans les encadrés d'appel à l'action, parce que le thème les stylait avec une jolie barre verticale. Un audit m'a montré 14 H3 totalement décoratifs sur une seule page. Résultat : ma structure de contenu était noyée dans du bruit.
La règle est simple : si le texte n'est pas un titre, il n'a pas de balise de titre. Un <p> avec du CSS fait parfaitement le travail.
Quel est le rôle de la balise H1, au fond ?
La balise H1 a un rôle unique : elle annonce le sujet de la page. C'est le titre principal du document HTML, celui que le lecteur voit en premier et qui doit lui dire en une phrase de quoi il s'agit. Une page = un H1.
H1 et balise title : ne pas les confondre
On me pose souvent la question. Les deux sont proches, mais ils ne servent pas au même endroit :
| Balise | Où elle apparaît | Rôle | Longueur conseillée |
|---|---|---|---|
<title> | Onglet du navigateur, résultats de recherche | Identifier la page dans une liste | Concise, autour de 60 caractères |
<h1> | En haut du contenu visible | Annoncer le sujet au lecteur | Descriptive, plus libre |
Elles peuvent être identiques. Elles peuvent aussi différer : la balise title doit tenir dans les résultats de recherche, donc elle est plus courte et souvent plus factuelle. Le H1 peut se permettre d'être plus engageant. Dans les deux cas, on n'y empile pas les mots-clés.
À quoi sert la balise H1 en HTML, concrètement ?
Techniquement, c'est un élément de titre de niveau 1. Il indique le niveau hiérarchique le plus élevé dans la structure du document. Sémantiquement, il sert trois publics en même temps :
- Le lecteur qui scanne la page et veut savoir immédiatement où il est.
- Le moteur de recherche qui cherche à comprendre le thème dominant.
- Le lecteur d'écran, qui utilise souvent les titres comme points de repère.
Ce dernier point est sous-estimé. Une structure de titres propre permet à une personne malvoyante de naviguer dans la page par sauts de titres, exactement comme on sauterait d'un chapitre à l'autre dans un livre. Une page sans structure Hn cohérente, c'est cent paragraphes à parcourir à la suite.
Quelle est la différence entre H1, H2 et H3 ?
La différence est une question de niveau d'imbrication, comme dans un plan de dissertation. Le H2 est une section majeure du document. Le H3 est une sous-section à l'intérieur d'un H2. Voilà tout.
Ce qui compte, ce n'est pas le nombre de niveaux utilisés, c'est la cohérence de l'imbrication. Un H3 ne doit pas exister sans H2 parent. Un H4 sans H3 parent, c'est une anomalie. Le navigateur l'affichera quand même, mais votre structure perd sa logique.
En pratique, la plupart des articles n'ont pas besoin d'aller au-delà du H3 ou du H4. Les niveaux H5 et H6 existent dans la spécification, mais le contenu web courant les utilise très rarement. Si vous vous retrouvez avec un H5, la vraie question est : est-ce que la page ne devrait pas être découpée en plusieurs pages ?
Pourquoi une page peut ne pas être indexée (et ce n'est pas toujours le H1)
Une page qui ne remonte pas, ce n'est pas forcément une page avec un mauvais H1. C'est souvent une page que les moteurs n'ont tout simplement pas indexée. Les raisons les plus courantes :
- Une balise
noindexrestée d'un environnement de test. - Un fichier robots.txt qui bloque le dossier par erreur.
- Aucun lien interne pointant vers la page : elle existe, mais personne ne la connaît.
- Un contenu quasi identique à une autre page du site.
- Une page trop lente ou trop lourde à explorer.
Je l'ai vécu sur un site client en 2025. Une page de catégorie qui ne remontait pas. Le H1 était parfait, la hiérarchie impeccable. Le problème : un noindex injecté dans le template par un plugin que le client avait désactivé six mois plus tôt, sans nettoyer les résidus. Deux heures de recherche pour une balise oubliée.
Ce que je retiens de toutes ces années de correction : le H1 est important, mais il ne fait pas tout. C'est un signal parmi d'autres, à traiter en même temps que le reste.
Auditer ses titres : la méthode en quatre étapes
Voici comment je procède, dans cet ordre précis, sur chaque site que je reprends.
- Compter les H1 de la page d'accueil. Si plus d'un, le problème est dans le template, pas dans le contenu.
- Vérifier la hiérarchie des pages clés : article, catégorie, page produit. Une grille par template évite d'auditer page par page.
- Chercher les Hn décoratifs : ceux qui n'ont pas de sens sémantique, juste un effet visuel.
- Contrôler les Hn vides ou répétés dans le header et le footer, qui contaminent toutes les pages du site.
Le point le plus efficace de cette liste, dans mon expérience, c'est le troisième. Les Hn décoratifs représentent la majorité des anomalies sur les sites que je vois. Ils sont invisibles dans un éditeur visuel. Ils ne le sont pas dans le code.
Bref, si vous ne devez retenir qu'une chose : arrêtez d'utiliser les balises H1 à H6 comme des boutons de taille de police. Ce sont des balises de sens, pas de style.
La prochaine fois que vous ouvrirez un article, faites le test : supprimez mentalement toute la mise en forme et regardez ce qui reste. Si la structure tient, vous avez gagné. Si elle s'effondre, vous savez où chercher.
