Balises Hn : un seul H1, zéro saut de niveau et les erreurs qui brouillent votre page

Les balises Hn sont les titres et sous-titres d'une page web, de H1 à H6. Elles dessinent le plan de votre contenu pour le lecteur, pour les moteurs de recherche et pour les outils d'assistance. Bien posées, elles rendent une page lisible en quelques secondes ; mal utilisées, elles la rendent confuse. Voici comment les comprendre, les structurer et les vérifier.
Ce que sont vraiment les balises Hn
Six niveaux, du plus important au plus discret
Le HTML propose six niveaux de titres, écrits <h1>…</h1> jusqu'à <h6>…</h6>. Le H1 est le plus important : il annonce le sujet de la page. Le H2 découpe ce sujet en grandes parties, le H3 détaille chaque partie, et ainsi de suite jusqu'au H6. En pratique, H4 à H6 sont rarement utiles : la plupart des pages se contentent de H1, H2 et H3.

Structure d'un côté, apparence de l'autre
Une balise Hn exprime un rang dans la hiérarchie, pas une taille de police. L'apparence relève du CSS et du thème de votre site. Si vous trouvez un H3 trop petit, modifiez sa feuille de style plutôt que de le remplacer par un H2. C'est l'erreur la plus répandue : choisir un niveau de titre pour son rendu visuel, au détriment de la logique du plan.
Pourquoi elles comptent pour le SEO et l'accessibilité
Aider les moteurs à comprendre la page
Les titres signalent aux moteurs de quoi parle chaque partie du texte. Un mot-clé placé dans le H1 donne du poids au terme, et des H2 bien formulés précisent les sous-thèmes traités. Le H1 peut aussi être repris dans les résultats de recherche, et un sommaire de liens pointant vers vos titres peut faire apparaître des liens supplémentaires sous votre résultat. Cela ne garantit aucun classement, mais une structure claire facilite la compréhension du contenu.
Rendre la lecture possible pour tous
Un long texte sans titres est un pavé que l'on quitte. Les Hn permettent de survoler, de repérer la réponse cherchée et de revenir en arrière. Elles servent aussi aux technologies d'assistance : les lecteurs d'écran permettent de naviguer de titre en titre, comme on feuillette une table des matières. Une hiérarchie cohérente est donc un vrai critère d'accessibilité, pas seulement un détail technique.
Une vague de titres, et l'on se noie
Imaginez la structure d'une page comme une carte marine lue depuis un bateau : chaque niveau de titre est une bouée. Si elles se succèdent à intervalles réguliers, le lecteur sait où il est et où il va. Si l'on multiplie les H2 de même poids, ou si l'on saute un niveau, c'est comme une vague qui recouvre les repères : on continue d'avancer, mais sans savoir dans quelle partie on se trouve. Une bonne règle de relecture consiste à ne lire que les titres, à la suite : ils doivent raconter l'article à eux seuls. Si cette lecture rapide paraît décousue, c'est la structure qu'il faut revoir, pas seulement le texte.
Le H1 et la balise title : deux rôles distincts
Title pour les résultats, H1 pour la page
La balise title s'affiche dans les résultats de recherche et dans l'onglet du navigateur. Elle fait en général entre 40 et 70 caractères, doit être unique et peut contenir la marque et les mots-clés. Le H1, lui, apparaît dans la page et s'adresse au visiteur déjà arrivé. Les deux peuvent être proches, mais ne sont pas obligés d'être identiques : le title doit donner envie de cliquer, le H1 doit confirmer qu'on est au bon endroit.
Les balises <h1> à <h6> : structurer vos pages avec les niveaux de titre HTML : La référence MDN qui détaille les six niveaux de titre de section en HTML, leur usage, leur impact sur l'accessibilité et les bonnes pratiques de hiérarchisation.
| Élément | Où il apparaît | Nombre | Rôle |
|---|---|---|---|
| Title | Résultats de recherche, onglet | 1 par page | Attirer le clic |
| H1 | Haut du contenu | 1 par page | Annoncer le sujet |
| H2 | Corps de l'article | Au moins 2 si le contenu est découpé | Grandes parties |
| H3 et suivants | Sous les H2 | Selon les besoins | Détails et exemples |
Règles pour un bon H1
- Un seul H1 par page, qui décrit le contenu.
- Le mot-clé principal y figure naturellement.
- Il reste court : environ 4 à 5 mots selon certains spécialistes, sans que ce soit une limite stricte.
- Sur une page d'accueil ou de catégorie, il porte le message principal de la page, pas un « Bienvenue sur notre site » sans information.
Si une page n'a aucun titre, commencez par y mettre un H1 : c'est le minimum.
Structurer H2, H3 et les niveaux suivants
Le plan d'abord, la rédaction ensuite
Rédigez votre plan avant le texte. Prévoyez 3 à 4 grands axes en H2, puis détaillez chacun avec des H3 : arguments, étapes, exemples. Réservez H4 à H6 aux sous-points réellement nécessaires. Voici un exemple de plan correctement balisé :
- H1 : Location de vélo électrique à Lyon
- H2 : Choisir son modèle
- H3 : Autonomie
- H3 : Poids et confort
- H2 : Tarifs et durées de location
- H2 : Choisir son modèle
Ne pas sauter de niveau
Un H3 doit dépendre d'un H2, un H2 du H1. Passer d'un H2 directement à un H4 casse la logique du plan et déroute autant les lecteurs d'écran que les analyseurs. Placez aussi vos mots-clés avec naturel : inutile de répéter le mot-clé principal dans chaque titre, des variantes et des formulations précises sont plus lisibles et plus utiles.
Erreurs fréquentes, cas particuliers et vérification
Les erreurs à corriger en priorité
- Plusieurs H1 sur la même page, qui diluent le titre principal.
- Des sauts de niveau (H2 vers H4).
- Des Hn utilisées pour grossir un texte ou une citation.
- Des titres trop longs ou génériques, sans information ni mot-clé.
- Des titres dans le menu, le pied de page ou le fil d'Ariane.
Sur les zones annexes (header, sidebar, footer), les avis divergent : certains tolèrent un H4 en sidebar, d'autres, comme WebRankInfo, déconseillent tout Hn hors de la zone de contenu principale. La position la plus prudente consiste à réserver les Hn au contenu et à styliser le reste avec du CSS. Sur la question des H1 multiples, les recommandations sont plus souples que la règle du H1 unique, mais s'en tenir à un seul reste la pratique la plus claire.
Configurer et contrôler ses Hn
Dans la plupart des CMS, les options « Titre 1, 2, 3 » de l'éditeur génèrent directement les balises Hn. Sur WordPress, le titre de l'article est généralement rendu en H1 par le thème : commencez donc votre contenu par des H2. Pour contrôler le résultat, affichez le code source de la page, utilisez une extension de navigateur qui liste les titres, lancez un crawler sur l'ensemble du site ou passez l'URL dans un analyseur comme celui de WebRankInfo. Refaites ce contrôle après chaque refonte ou changement de thème, car les gabarits modifient parfois la hiérarchie sans prévenir.
En résumé : un H1 unique et descriptif, des H2 et H3 hiérarchisés sans saut, un style géré par le CSS et une vérification régulière suffisent pour avoir des balises Hn propres, utiles au lecteur comme aux moteurs.
Graph