La lecture sur écran débute souvent par un balayage rapide des titres d’une page pour décider si le contenu en vaut la peine. Les balises h1 – h6 qui encadrent ces titres dans le langage HTML revêtent donc une importance capitale tant pour l’internaute que pour les moteurs de recherche. En effet, elles l’aident à interpréter un contenu et jouent un rôle clé dans l’indexation d’une page web. Prenons le temps de les analyser.

Que sont les balises ?

Avant d’entrer dans le vif du sujet, rappelons quelques notions élémentaires.

Chaque page d’un site internet correspond à un document HTML, càd un fichier texte qui contient des balises (tag en anglais). Ces balises indiquent au navigateur comment afficher un contenu.

Le navigateur n’affiche pas les balises telles quelles. Lorsqu’un utilisateur visite une page web, son navigateur analyse (ou parse en anglais) le document et l’interprète afin d’afficher la page web correctement. Par exemple, si le document contient une balise <img>, le navigateur chargera l’image associée et affichera l’image à la place de la balise HTML.

balises h1 - h6

Techniquement, les balises respectent une syntaxe simple et stricte : Un chevron ouvrant (<) + le nom de la balise + (en option) des attributs + un chevron fermant (>)

Exemple : <h1>Titre Principal</h1> ou <h2>Premier intertitre</h2> etc.

balises h1 - h6

Les balises H1 à H6 sont des balises de titre (heading en anglais) qui indiquent à vos lecteurs et aux moteurs de recherche quelle est l’importance relative de chaque titre. A ne pas confondre, toutefois, avec la balise <title> qui n’apparaît pas aux yeux du lecteur mais joue elle aussi un rôle clé en matière de référencement naturel (nous y reviendrons plus tard).

A quoi servent les balises h1, h2, h3 …

Les balises <h1> à <h6> encadrent chaque titre d’une page web et servent essentiellement à

  • Hiérarchiser un contenu et aider à sa compréhension en facilitant la lecture. Sans elles, pas de structure ni texte aéré. Votre page ressemblerait à un pavé de mots indigeste qui ne donnerait pas envie d’être lu.
  • Indiquer l’importance relative des différents éléments de contenu, tant aux lecteurs qu’aux moteurs de recherche.

Les balises h1 à h6 représentent six niveaux de titres, <h1> étant le plus important et <h6> le moins important. Un élément de titre décrit brièvement le sujet de la section qu’il introduit.

Pour choisir vos balises <h1>, <h2>, etc. pensez sémantique et structure avant de penser design. En clair, ce n’est pas la taille ou la forme de la typo d’une balise qui importe mais sa place dans la hiérarchie. Ainsi, on ne choisit pas une balise <h2> ou <h3> pour son « look » mais bien parce qu’elle correspond à l’importance relative d’un titre. Le formatage sera défini quant à lui dans le fichier CSS.

Les balises Hn structurent et rythment votre contenu.  Plusieurs types de structure sont possibles. D’ailleurs les experts SEO ne sont pas toujours d’accord. Voici quelques exemples :

Balisage Classique : Titre, Sous-titre, …
du + important au – important
Utilisation du fil d’Ariane en H6 Structure avec chapô en H2 –
utilisée par O. Andrieu
<h1>Univers</h1>
<h2>Monde</h2>
<h3>France</h3>
<h4>Bretagne</h4>
<h5>Finistère</h5>
<h6>Brest</h6>
<h6>Le fil d’Ariane</h6>
<h1>Titre principal</h1>
<h2>Titre secondaire</h2>
du texte
<h3>Sous-titre du H2</h3>
du texte
<h3>Sous-titre du H2</h3>
du texte

<h1>Titre principal</h1>

<h2>chapô ou résumé de l’article</h2>
du texte
<h3>Sous-titre du H1</h3>
du texte
<h3>Sous-titre du H1</h3>
du texte

Les balises sont incontournables pour le référencement naturel puisque Google en tient compte. C’est donc un élément à ne pas négliger, tant pour le lecteur que pour les moteurs de recherche.

La balise h1 – capitale, unique et concise

La balise H1 correspond au titre éditorial de la page qui fait partie des « zones chaudes » en matière de référencement. En le lisant on doit pouvoir identifier le sujet de la page. Le titre <h1> doit être le plus descriptif possible.

Comment le rédiger ?

  • Placez vos mots clés en début de <h1>. Google leur accordera davantage de poids.
  • Privilégiez un titre concis. Plus votre titre sera long, plus vous « diluerez » votre mot clé.
  • La formulation en question et définition est intéressante pour votre SEO : vous pourrez ainsi espérer atteindre la position « zéro » qui peut générer plus de 50% de clic dans les SERPs.

balises h1 - h6

L’objectif avoué de Google de devenir une sorte d’assistant personnel capable de répondre directement aux questions de chaque internaute, vous aurez plus de chance d’être repéré et bien indexé par Google si vous structurez vos contenus sous la forme de questions / réponses. Seul bémol : Google risque de trouver votre réponse tellement pertinente qu’il la récupèrera et l’affichera directement dans les SERP, avec le risque pour vous de perdre un trafic intéressant. Réservez donc cette technique à des sujets complexes pour lesquelles une réponse courte n’est pas possible de manière à drainer les internautes vers votre site.

balises h1 - h6

D’un point de vue utilisateur, la balise <h1> devrait être l’élément typographique le plus visible de la page. Il doit capter le regard et retenir l’attention de l’internaute en quelque secondes.

On recommande généralement de n’utiliser qu’une seule balise <h1> par page. Mais le sujet fait débat. Matt Cutts, ex-ingénieur chez Google a d’ailleurs évoqué ce point dans une vidéo qui date de 2009 déjà.

Selon lui, l’utilisation d’une balise h1 à plusieurs reprises sur une même page n’est pas pénalisante pour le référencement naturel tant que le raisonnement est logique. Par contre, si vous disposez plusieurs h1 sur une page, il est fortement recommandé qu’elles apparaissent en tant que “titre de section”.

La balise h2 – variations sémantiques

La balise H2 introduit les principales sections d’un contenu.  Quand vous l’utilisez, vous divisez votre contenu en blocs plus digestes et scannables : Google et vos visiteurs l’apprécieront.

Ne multipliez pas les balises H2 sans raison. Leur nombre dépend essentiellement de la longueur et du niveau de complexité de votre contenu.

Utilisez des balises d’en-tête là où cela a du sens. Trop de balises d’en-tête sur une page peut rendre difficile pour les utilisateurs de balayer le contenu et de déterminer où un sujet se termine et où un autre commence. (source : Google)
Les balises H2 sont prises en compte pour votre SEO. Songez à y incorporer quelques synonymes de votre mot-clé principal. Cela a d’autant plus de sens que Google va parcourir les titres d’une page pour essayer de comprendre de quoi il s’agit. Donc l’introduction de mots-clés secondaires dans les balises H2 peut aider les moteurs de recherche à bien comprendre le contenu de ces mots-clés.

Certains, comme Olivier Andrieu, utilisent la balise <h2> pour mettre en évidence le chapô d’un article.  Le H2 contient alors 2 à 3 phrases (soit 200 à 300 caractères) dans lesquelles apparait une fois le mot clé central. Une telle pratique nous semble toutefois contraire aux préconisations de Google qui suggère d’éviter de « placer du texte dans des balises d’en-tête qui ne seraient pas utiles pour définir la structure de la page. »

Les balises h3 – la force d’un contenu structuré

Les balises <h3> et suivantes permettent de faire ressortir la profondeur d’un contenu ou d’une page particulière ainsi que son architecture. Et plus votre contenu sera structuré, plus votre message aura de chance d’être compris.

En émaillant un long texte de plusieurs niveaux de titres et sous-titres, vous aérez votre texte et vous facilitez la lecture.

Astuce Pro : Avant de rédiger un article, j’établis un plan ou je dresse un mindmap du contenu. Cela me permet d’organiser mes idées. Les titres viennent naturellement et les sections se déroulent de manière fluide. Cette approche structurée permet d’ordonner rapidement une thématique en sections et sous-sections, ce qui accélère ensuite l’écriture. Le résultat final est bien sûr plus cohérent que si j’avais rédigé mon article au kilomètre.

N’hésitez pas à structurer votre contenu et à utiliser plusieurs balises <h3> comme intertitres. Il est probable que vous utiliserez moins de balises <h4> et au-delà, sauf si votre  texte est très long (plus de 2000 mots).

Les balises h4 et suivantes – du style avant tout

Peu de pages web ont une longueur ou une complexité telle qu’elles justifient l’usage intensif de 4 à 6 niveaux structurels. En conséquence, ces balises sont peu utilisées.

On retrouve toutefois les balises <h4> et suivantes dans les en-têtes de barre latérale ou en pied de page. C’est le cas dans de nombreux thèmes WordPress, qui n’y attachent d’ailleurs pas d’importance particulière. Une telle approche a une certaine logique : dans la mesure où le contenu principal est généralement structuré à l’aide des balises <h1> à <h3>, on peut considérer que les autres balises indiquent un contenu de moindre importance. Néanmoins, certains puristes préfèrent ne pas utiliser de balises hn dans les sidebars, considérant qu’elles sont d’une part commune à plusieurs page et n’ont pas de lien sémantique avec le sujet de la page.

Enfin, certains proposent de mettre le fil d’Ariane en h4 ou h6 (dès lors qu’il contient plein de mots-clés).

L’ordre des balises

Plusieurs écoles cohabitent.

Certains privilégient l’ordre logique, découpant la page en titre principal, sous-titres, sous-sous-titres, etc. suivant un schéma descendant : <h1>, <h2>, <h3>, etc.

D’autres bousculent cet ordre classique. Comme l’indique Olivier Andrieu, la presse adopte la logique suivante :

  • Titre éditorial en <h1>
  • Chapô (résumé en 2 ou 3 phrases) en <h2>
  • Sous-titres (intertitres) en <h3>

L’apparence des balises

Rappelons que les balises h1 à h6 ont essentiellement un rôle structurel et sémantique. Ce ne sont pas des élément de style même si on a tendance à associer une balise <h1> à une typo en gras et d’une taille bien supérieure à une balise en <h2> et ainsi de suite. Mais tout cela se définit et se modifie au niveau du CSS.

C’est là que vous pourrez laisser libre cours à votre créativité ! Voici ce que cela pourrait donner. (source :slaout)

balises h1 - h6

Balisage de la page d’accueil d’un site

Dans le cas d’un article ou d’une page interne, il est relativement simple d’appliquer la logique d’une structure en cascade, avec une seule balise <h1> , des balises <h2> et suivantes pour structurer le contenu principal de la page.

Mais qu’en est-il d’une page d’accueil qui multiplie les contenus importants et les renvois vers les différentes pages internes ? Dans ce cas, dans la mesure où Google indexe une page dans son entièreté, on a coutume de considérer que la balise <h1> est le titre du site ou du blog (et donc le sujet général de la page) tandis que les balises <h2> introduisent les différentes sections, accompagnées de <h3>  le cas échéant.

Quelques conseils pour une utilisation optimale de vos balises h1 – h6

Vous l’aurez compris, un balisage correct de votre contenu est souvent un gage de qualité et le signe d’une approche structurée du contenu. Et dans la mesure où vous avez pris la peine de créer un plan avant de vous lancer dans la rédaction de votre contenu, ces balises ne devraient vous poser aucun problème.

Voici un bref récapitulatif des règles à respecter :

  • Sur votre page d’accueil, la balise <h1>encadre le titre de votre site / blog.
  • Pour une page interne, les balises <hn>structure le cœur éditorial de la page.
    Il est recommandé d’utiliser la balise <aside> pour exclure les blocs de la barre latérale du découpage sémantique du contenu.
  • Un seul titre <h1>par page. Normal, vous ne traitez qu’un seul sujet/thème par page.
  • Chaque balise <h1>contient le mot clé central de votre page web.
  • Dans les balises <h2> et suivantes, élargissez le champ sémantique avec des variantes du mot clé central ou des mots-clés secondaires.
  • On déconseille de sauter d’une balise <h2>à une balise <h4> mais vous pouvez le faire sans être pénalisé par Google. Même si ce n’est pas logique, cela n’aura que peu d’impact sur votre SEO.
  • Structurez mais sans excès. Les titres constituent l’ossature logique d’une page. Ils doivent servir votre propos autant que le SEO. Si votre pensée est organisée, l’architecture web suivra.
  • Ne truffez pas vos titres de mots clés. Pensez densité de mots clés et richesse sémantique mais sans suroptimisation.

Sauf en cas d’articles longs (+ de 2000 mots) les balises H4 à H6 sont peu utilisées. Pour les contenus les plus longs, vous pouvez ajouter une Table des Matières qui fera ressortir la structure du contenu et vous permettra de rectifier certaines incohérences qui vous auraient échappé.

  • Pas de longueur à respecter: à la différence des balises <title> ou Meta description, les balises <hn> sont libres. Mais évitez de diluer votre mot clé dans un titre trop long.

Comment baliser vos contenus dans WordPress

En fonction de votre thème et de vos compétences, vous adopterez l’une de ces 4 méthodes pour appliquer les balises H1 à H6 à vos pages & articles.

  1. Taper manuellement les balises adéquates dans l’éditeur texte.
  2. Utiliser les options de formatage de l’éditeur visuel.
  3. Utiliser les raccourcis clavier, alt+shift+nombre 1 à 6
  4. Utiliser les touches # (et le nombre nécessaire de # pour le niveau de titre)

balises h1 - h6

Les outils pour optimiser votre balisage html

Plusieurs outils et astuces permettent d’optimiser et de vérifier la structure html de vos contenus web et l’utilisation correcte des balises h1 à h6 dans une page web.

Structurez le document Word qui sert de base à votre article

Un article web est rarement rédigé directement dans l’outil CMS. Le rédacteur commence souvent par un document Word.

Saviez-vous que l’utilisation des styles (pour les titres, intertitres et tout le formatage du texte) s’exporte et se récupère dans la majorité des CMS. En tout cas, dans WordPress, vous importerez un article complet en un seul copier-coller.

Vérifiez facilement la structure des balises h1 – h6 d’un site

Certains outils permettent de vérifier votre travail mais aussi d’analyser la stratégie SEO de vos concurrents.

Je vous conseille d’installer l’extension Web Developer sur votre navigateur  Firefox  ou Chrome . Indispensable si vous vous intéressez au SEO. L’outil vous fournira, entre autres, un plan (outline en anglais) de votre page qui fera ressortir les balises utilisées.

Je vous conseille également de tester l’outil gratuit de Webrankinfo qui vérifie les balises H1 – H6 présentes dans une page web donnée, en fait le bilan, relève les éventuelles erreurs et vous donne des conseils pour les corriger. Super pratique !