balises Hn et SEO
Portrait Olivier Duffez

Olivier Duffez

Créateur de WebRankInfo,
consultant en référencement

Guide SEO des balises de titres H1, H2, H3... H6

Les balises de titres (h1, h2, h3...h6) servent à structurer l'information dans une page web. Comment bien les utiliser pour améliorer le référencement naturel en plus de la lisibilité de la page ? Voici le guide ultime !

Dossier mis à jour le 25/08/2023, publié initialement en 2016

Ce dossier comporte 4 parties (cliquez pour y accéder directement) :

  1. Syntaxe
  2. Impact référencement
  3. Outils
  4. Balises de titres et CMS
Avant de commencer, sachez que je vous propose 2 bons plans pour tester vos balises H1-H6 :-)

Pour tester gratuitement une seule page à la fois, utilisez mon outil d'analyse des balises H

Pour tester toutes les pages de votre site, lancez mon outil d'audit RM Tech. Entre autres (nombreuses) choses, il analysera les balises de titres Hn de toutes vos pages sous 9 critères ! Vous pouvez lancer un audit gratuitement pour voir s'il détecte des problèmes. Pour avoir les détails il faudra acheter des crédits.

Testez les balises H1-H6 de toutes vos pages ! Lancez un audit RM Tech

Ce qu'il faut retenir, détaillé dans ce guide :

  • les balises H1, H2... H6 servent aux différents niveaux de titre dans le contenu d'une page web
  • la balise H1 est la plus importante et la H6 la moins importante
  • elles servent à l'optimisation sémantique car elles indiquent l'arborescence des sujets abordés dans la page
  • une bonne structure de Hn aide au référencement
  • l'impact SEO est assez important pour la H1 et pas tant que ça pour les autres

Syntaxe des balises de titres H1-H6

Après une définition, je vous explique à quoi servent ces balises et comment respecter la norme W3C pour ces balises HTML.

Définition des balises Hn

Les balises de titres H1, H2... H6 (parfois notées Hn) sont des balises servant à définir les différents niveaux de titres pour structurer un (gros) contenu éditorial sur une page HTML. C'est similaire aux différents styles Titre 1, Titre 2, Titre 3, etc. que vous pouvez trouver dans votre traitement de texte Word, Libre Office, Google Docs ou équivalent.

Dans la norme HTML, il existe 6 niveaux de titres : H1 est le plus important, H6 le moins important.

Remarque : j'utilise souvent dans cet article des majuscules pour noter ces niveaux de titres, mais en pratique dans le code HTML on utilise généralement des minuscules. Cela dit, la casse n'a pas d'impact.

Voici la syntaxe du code HTML pour ces différents niveaux de titres :

<h1>titre de niveau 1</h1>
<h2>titre de niveau 2</h2>
<h3>titre de niveau 3</h3>
<h4>titre de niveau 4</h4>
<h5>titre de niveau 5</h5>
<h6>titre de niveau 6</h6>

A quoi servent les balises de titres ?

Il ne faut pas utiliser les balises H pour de la mise en forme, mais pour fournir une information sémantique. En d'autres termes, ces balises servent à définir des niveaux de titres, un découpage en sous-parties, bref une structure ou une hiérarchie des contenus de la page.

Ne vous souciez pas de la mise en forme liée à chaque niveau de titre, les feuilles de styles CSS sont là pour définir leur apparence.

Une bonne façon de voir si vous avez bien utilisé ces balises dans une page, c'est de voir si on peut facilement en faire une table des matières. Faites le test suivant :

  • extrayez de votre page uniquement les libellés des balises de titres H1 jusqu'à H6
  • affichez-les dans un document sans rien d'autre
  • faites-le lire à une autre personne : elle doit comprendre la logique de l'ensemble, de quoi parle la page et comment elle est structurée

Les (bons) rédacteurs web savent utiliser ces niveaux de titres à bon escient : c'est un endroit idéal pour glisser des mots-clés (expressions) stratégiques pour la page, tant qu'on sait rester naturel. Ne versez pas dans la sur-optimisation en mettant toujours plus de mots-clés dans vos balises Hn, et toujours plus de balises Hn dans vos pages "car ça améliore le SEO"...

Cerise sur le gâteau, une bonne structure de titres améliore la lisibilité, surtout pour les contenus longs comme l'article que vous lisez actuellement.

Les balises de titres dans la norme HTML

Voici la définition en HTML4 (source W3C) :

Un élément de titre décrit brièvement l'objet de la section qu'il introduit. Les informations fournies dans ces titres peuvent être utilisées par des noms d'agents (NDLR : user agents, c'est-à-dire les navigateurs mais aussi les crawlers des moteurs de recherche) par exemple pour construire automatiquement la table des matières d'un document. Il y a 6 niveaux de titres en HTML, H1 étant le plus important et H6 le moins important.

Voici la définition en HTML5  (source W3C) :

Les éléments h1, h2, h3, h4, h5 et h6 représentent les titres de leurs sections. Ils sont classés selon le nombre indiqué dans leur nom : h1 se positionne en premier et h6 en dernier. Ces éléments ne doivent pas être utilisés comme des sous-titres (subheadings, subtitles) ou comme des titres alternatifs ou des accroches, à moins que cela représente le titre d'une nouvelle section ou sous-section.

La norme HTML4 indique que les attributs possibles sont les suivants :

  • id, class (identifiants pour la page)
  • lang (langue), dir (sens de lecture du texte)
  • title (titre de l'élément affiché sous forme d'infobulle au passage de la souris)
  • style (information de style en ligne)
  • align (alignement)
  • onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup (événements)

Selon HTML5, les attributs possibles des balises de titres sont tous les attributs globaux.

Selon la norme HTML5 (source W3C), les balises de titres H1-H6 ne sont pas adaptées dans les cas suivants :

  • pour un fil d'ariane ou un nuage de tags : il vaut mieux utiliser les listes (<ul>)
  • pour une conversation, le compte-rendu d'un événement minute par minute, le transcript d'un chat, les dialogues dans un scénario, les logs d'une conversation par messagerie instantanée : il vaut mieux utiliser des paragraphes (<p>)
  • les notes de bas de page ou dans la marge (dans ce cas la balise <aside> est appropriée)

Toujours selon le W3C, les cas suivants sont considérés comme valides (j'en reparle plus loin dans la partie SEO) :

  • mettre une image dans une balise H1 (ou autre niveau de titre)
  • mettre un lien <a href> dans une balise H1-H2-H3
  • utiliser du <strong> ou du gras <b> dans une balise de titre

Les titres H1-H6 et le référencement

Découvrez comment bien utiliser les balises Hn pour améliorer votre référencement naturel, sans tomber dans les excès et la suroptimisation. Je décris comment faire une bonne optimisation sémantique à la fois pour les internautes et les moteurs de recherche.

Impact des balises de titres sur le référencement naturel

L'impact SEO direct existe mais il est faible, bien plus faible qu'on l'imagine souvent. Cela étant, vous auriez tort de ne pas les utiliser, notamment les H1. Regardez par exemple ce test qui montre l'intérêt des H1 en SEO.

Mais l'impact indirect me semble également très intéressant. En effet, ça incite à bien réfléchir au contenu et surtout à bien le structurer. Cela permet aussi d'inclure des expressions stratégiques dans les H, tant qu'on ne tombe pas dans la "suroptimisation".

Combien de balises H1, H2, H3... maximum par page ?

C'est ridicule de se poser la question de cette façon !

Ce serait également idiot de penser "Je n'ai pas encore utilisé de H2 sur cette page, il faut donc que j'en ajoute pour améliorer mon référencement. Et si possible aussi quelques H3".

Voici le raisonnement que vous devriez plutôt suivre :

  • pour le titre éditorial principal de ma page, je choisis H1
  • si j'ai 3 parties dans mon contenu, alors je vais utiliser une balise H2 pour le titre de chacune des 3 parties
  • si dans une des parties de niveau 2 j'ai besoin de découper encore, j'utiliserai le niveau 3, donc des H3
  • etc.

Rappelez-vous une règle d'or : la structure des balises de titres de votre page doit permettre de se faire une très bonne idée de la structure de son contenu.

Règles sur la structure des balises Hn

Il s'agit généralement simplement de bon sens. Ne pas les respecter ne va plomber votre référencement, mais autant faire les choses comme il faut. J'ai essayé de les classer en mettant les règles les plus importantes en premier (parfois il y a des bonnes raisons de ne pas les suivre).

Pas de saut de niveau

Une balise Hn ne peut être suivie que par une balise H(n+1) dans l'ordre du code source : on ne saute pas de niveau. Par exemple, après une H1, il ne peut y avoir qu'une H2. Après une H3, il ne peut y avoir qu'une H4.

Remarque : Ce type de problème est repéré par mon outil RM Tech.

Ceci n'est pas correct car on passe du niveau 1 au niveau 3 :

<h1>Tables de jardin</h1>
    <h3>Tables en bois</h3>
    <h3>Tables en plastique</h3>
    <h3>Tables en métal</h3>

Ceci est correct :

<h1>Tables de jardin</h1>
  <h2>Tables en bois</h2>
  <h2>Tables en plastique</h2>
  <h2>Tables en métal</h2>

Pas de balise vide

Une balise Hn ne doit pas être vide. Si votre balise ne contient qu'une image (c'est possible), n'oubliez pas de remplir son attribut ALT, qui fera office de texte du titre.

Remarque : Ce type de problème est repéré par mon outil RM Tech.

Taille des balises de titres

Un titre doit rester un titre ! Ce n'est pas un paragraphe, vous devez donc limiter sa taille (en nombre de mots ou de caractères). Essayez de limiter la taille pour que le titre s'affiche sur une seule ligne (ce n'est pas un critère SEO, plutôt de lisibilité).

Concrètement, la taille d'une balise de titre ne doit pas dépasser ~80 caractères (c'est un ordre de grandeur).

Remarque : Ce type de problème est repéré par mon outil RM Tech.

Rappelez-vous aussi qu'un sous-titre ou un slogan ne doit généralement pas être géré par une balise de titre.

Même chose pour un chapeau (ou "chapô", le paragraphe d'introduction d'un article) : il n'a aucune raison d'être dans une balise de titre.

Au moins une balise H1 par page

Une page doit au minimum avoir une balise H1 (sauf peut-être la page d'accueil), par contre il est tout à fait possible d'avoir uniquement une H1 et rien d'autre, pas même des H2.

Remarque : Ce type de problème est repéré par mon outil RM Tech.

Nombre de balises H1 par page

Le W3C n'émet pas d'objections à avoir plusieurs balises H1 par page, y compris dans HTML4. En HTML5, c'est encore plus libre car il peut y avoir une balise H1 dans chaque section (source).

Cela étant, pour ma part je recommande généralement de limiter à 1 le nombre de balises H1 par page. L'idée étant de se concentrer sur la section principale de contenu de la page.

Remarque : Ce type de problème est repéré par mon outil RM Tech.

Ne faites pas l'erreur d'avoir dans votre template une balise H1 sur le logo ou le nom du site, en plus d'une autre balise H1 en haut du contenu.

Commencez votre page par une H1

A part si vous utilisez plusieurs jeux de balises de titres dans différentes "sections" de votre page HTML, sinon la première balise de titre d'une page doit être une <h1>.

Cela vous semblerait-il normal de commencer un document Word par un titre de niveau 2, puis un peu plus loin un titre de niveau 1 ? Non ! Donc faites pareil sur une page HTML.

Remarque : Ce type de problème est repéré par mon outil RM Tech.

Ceci n'est pas correct car on commence par autre chose qu'un titre h1 :

  <h2>Qui sommes-nous ?</h2>
  <h2>Newsletter</h2>
<h1>Tables de jardin</h1>
  <h2>Tables en bois</h2>
  <h2>Tables en plastique</h2>
  <h2>Tables en métal</h2>

Ceci est correct :

<h1>Tables de jardin</h1>
  <h2>Tables en bois</h2>
  <h2>Tables en plastique</h2>
  <h2>Tables en métal</h2>

Pas de doublons avec la balise H1

La balise H1 décrit le contenu précis d'une page, il me semble donc logique qu'une balise <h1> ne doit pas être identique sur toutes les pages (sinon c'est considéré comme un doublon, éventuellement du duplicate content).

Remarque : Ce type de problème est repéré par mon outil RM Tech.

Evidemment, si vous utilisez plusieurs balises H1 dans la page, dans différentes sections, cette règle ne s'applique plus.

Pas de balise isolée (H2-H6)

Pour les balises H2-H6, dans un niveau donné, le nombre de titres du niveau inférieur doit être 0 ou au moins 2 (donc pas seulement 1). Par exemple si on a un H2 et juste en dessous un seul H3, c'est pas bon car il devrait y avoir au moins 2 H3.

Remarque : Ce type de problème est repéré par mon outil RM Tech (je n'en connais aucun autre qui le repère).

Ceci n'est pas vraiment correct car le titre H3 est isolé :

<h1>Tables de jardin</h1>
  <h2>Tables en bois</h2>
  <h2>Tables en métal</h2>
    <h3>Tables en fer forgé</h3>
  <h2>Tables en plastique</h2>

Ceci est mieux car le titre H3 n'est plus isolé :

<h1>Tables de jardin</h1>
  <h2>Tables en bois</h2>
  <h2>Tables en métal</h2>
    <h3>Tables en fer forgé</h3>
    <h3>Tables en aluminium</h3> 
  <h2>Tables en plastique</h2>

Pas de titres identiques dans une même page

Dans la mesure du possible, il faut éviter d'utiliser un même libellé dans plusieurs balises H1-H6 d'une même page.

Remarque : Ce type de problème est repéré par mon outil RM Tech.

La balise H1 doit-elle être identique à la Title ?

En théorie, rien n'interdit d'utiliser exactement le même libellé dans la balise <title> et la balise <h1>. Certains estiment que c'est une forme de suroptimisation, mais je ne vois pas pourquoi.

Cela étant, si c'est possible pour vous, essayez de varier légèrement ces 2 titres, pour les raisons suivantes :

  • en ayant des libellé légèrement différents, vous optimiserez votre page pour la longue traîne (et peut-être un peu pour la recherche vocale ou même RankBrain). Variez donc un peu les termes : synonymes, hyperonymes, hyponymes, formes conjuguées, traductions, sigles, etc.
  • La balise <title> doit pouvoir être comprise en dehors du contexte de la page (car elle s'affiche dans les pages de résultats de recherche). Elle doit être travaillée spécialement pour le référencement. Sa taille est assez limitée.
  • La balise H1 s'affiche en haut d'une page dont l'internaute est censé avoir compris le contexte. Elle peut donc être davantage travaillée dans un but d'accroche (optimisation éditoriale, cf. techniques journalistiques). Même s'il ne faut pas abuser, elle peut être plus longue que la balise title.

Balises de titres sur une page d'accueil ou une page de catégorie

Ces balises sont surtout utiles aux pages à fort contenu (éditorial). Donc à mon avis :

  • sur la page d'accueil c'est difficile à définir, voire non adapté, sauf dans le cas d'une page d'accueil avec beaucoup de texte, ou alors avec clairement plusieurs parties (qui peuvent donc démarrer par un H2). Mettez éventuellement le titre du site en H1 (à condition de ne pas le laisser en H1 sur les autres pages du site).
  • sur une page de catégorie/listing, ce n'est pas non plus très adapté. Les avis divergent, pour ma part je ne recommande pas de mettre une balise de titre sur chaque produit/article/annonce. D'ailleurs le W3C recommande aussi d'utiliser simplement une liste <ul> et pas de <h1>...<h6>

Zones de la page adaptées aux balises de titres

Je vous conseille de vous concentrer à utiliser les balises de titre dans la zone principale de contenu de votre page, la section la plus importante. C'est pourquoi pour ma part, même si ce n'est pas un problème selon le W3C, je ne suis pas favorable à utiliser des balises de titres dans les menus, l'entête ou le pied de page.

Précision : si vous utilisez des balises de titre dans une barre latérale ou un pied de page (c'est encore très fréquent), pour respecter les règles du W3C ces titres devraient servir à structurer la section dans laquelle ils sont. Hors, presque tout le temps, je vois des niveaux de titre H2 dans la barre latérale (sans H1 avant) et des H2, H3 ou H4 dans le footer...

Les conseils de Google pour les balises de titres

Ce qu'il faut faire :

  • Utilisez des titres pertinents pour indiquer les sujets importants et organiser le contenu de manière hiérarchique
  • Utilisez les points principaux et secondaires du contenu de la page, pour constituer une sorte de plan
  • Utilisez les balises de titre avec pertinence et parcimonie

Ce qu'il faut éviter :

  • Placer du texte dans des balises de titre qui ne seraient pas utiles pour définir la structure de la page
  • Utiliser des balises de titre là où d'autres balises comme <em> et <strong> seraient plus appropriées
  • Choisir des balises de titre de différentes tailles de manière irrégulière

Pour les détails, voyez cette page.

Utiliser d'autres balises HTML avec les balises de titres

Mettre une image dans une balise H1-H6

Même si ce n'est pas très fréquent, rien n'interdit d'inclure une image dans une balise de titre, par exemple H1. D'après mon expérience, ça ne semble pas non gêner le référencement, à condition bien entendu de remplir l'attribut ALT de la balise <img> avec ce que vous auriez naturellement mis en texte dans la balise <h1>.

Ceci n'est pas correct car il n'y a pas d'attribut alt dans l'image :

<h1><img src="/tables-jardin.jpg"></h1>

Ceci est correct :

<h1><img src="/tables-jardin.jpg" alt="tables de jardin"></h1>

Remarque : il serait mieux de préciser certains attributs comme par exemple height et width.

Mettre un lien dans une balise H1-H6

Même si ce n'est pas très utile a priori, rien n'interdit d'inclure un lien dans une balise de titre, c'est-à-dire le rendre cliquable. Voilà à quoi pourrait ressembler le code :

<h2><a href="/tables-en-bois/">Tables en bois</a></h2>

Bien sûr, un cas de figure évident est une page listant des éléments (catégorie de ecommerce, petites annonces). Mais si vous avez bien lu le début de cet article, vous savez que les balises de titres ne sont pas vraiment adaptées à ce cas de figure.

Mettre du gras dans une balise H1-H6

A mon avis ce n'est pas très malin d'utiliser du gras dans une balise de titre (en tout cas si c'est sur l'ensemble du titre), car il vaut mieux utiliser les CSS pour définir l'apparence.

Voici à quoi cela pourrait ressembler si la mise en exergue est mise sur tout le titre :

<h1><strong>Tables de jardin</strong></h1>

Cela dit je ne pense pas que cela pose de véritable problème en référencement (et même avec le W3C). Attention tout de même à vouloir tout "optimiser" à outrance !

Mettre du <span> dans une balise H1-H6

Ce n'est pas interdit d'inclure une balise <span> au milieu d'un titre, par exemple pour mettre en évidence (couleur, gras, taille...) une partie. Cette pratique se rapproche de la précédente quand la mise en exergue ne concerne qu'un bout du titre.

Voici à quoi cela pourrait ressembler si la mise en exergue est mise sur une partie du titre :

<h1>Tables de <span>jardin</span></h1>

Cacher une balise H1-H6

Evitez d'utiliser une technique pour rendre invisible votre balise Hn, c'est interdit par les moteurs. Inutile de prendre un tel risque alors que vous pouvez éviter de les cacher.

Outils d'analyse des titres H1-H2-H3...H6

Pour travailler les titres Hn d'une page, mais encore plus pour TOUTES les pages d'un site, il vaut mieux un outil d'analyse. Je propose un outil gratuit sur WebRankInfo et un outil payant professionnel (RM Tech).

Pour l'analyse d'une seule page

Outil WebRankInfo H1-H6

Outil balises H1-H6
Outil permettant de récupérer les balises Hn et listant des conseils pour le référencement naturel

Je vous propose un outil en ligne gratuit permettant de tester des balises H1, H2, H3 d'une page et non seulement de les lister, mais aussi de fournir des conseils d'amélioration.

Testez les balises H1-H6 d'une page web : outil gratuit WebRankInfo

Extension Web Developer

Il existe un grand nombre d'extensions pour Firefox ou Chrome pour l'analyse des balises de titre, mais j'aime bien Web Developer. D'abord, vérifiez que la case est cochée devant "Entourer > Indiquer les balises en entourant les éléments" puis cliquez sur "Entourer > Titres (H1-H6)" :

Web developer titres h1 h6
Le plugin Web Developer de Firefox ou Chrome permet d'entourer les balises de titre dans la page

ce qui met en évidence les balises de titre directement dans la page web (sans voir le code source), avec un code couleur :

Voir les balises de titres h1 h6
L'extension Web Developer permet d'entourer les balises de titre directement dans la page

Une autre façon d'utiliser cette extension est de demander de générer une table des matières. Dans ce cas, le vert indique que tout est correct, et l'orange qu'il y a un problème, comme ici :

Plan balises h1-h6
L'extension Web Developer permet de générer un plan à partir des balises de titre, en indiquant certains problèmes comme un titre manquant.

Remarque : il existe d'autres extensions, n'hésitez pas à indiquer celles que vous préférez !

Pour l'analyse d'un site en entier

Etudier une page c'est bien, mais largement insuffisant pour la plupart des sites. C'est pourquoi j'ai inclus dans mon outil d'audit SEO en ligne "RM Tech" une analyse très poussée des balises de titres. Je ne suis sans doute pas objectif, mais il me semble que c'est l'analyse la plus complète qui soit parmi les outils SEO.

Voici un exemple de bilan des balises de titres dans un rapport RM Tech :

Analyse h1 h6 RM Tech
RM Tech effectue une analyse avancée des balises de titre sur toutes les pages du site

Sans oublier l'analyse des doublons des balises H1 sur l'ensemble du site :

Analyse doublons h1 RM Tech
RM Tech repère les balises H1 en doublons sur l'ensemble du site
Ne perdez pas plus de temps : Testez votre site avec RM Tech

Gestion des titres H1, H2, H3... H6 dans les CMS

Concrètement, comment ajouter ou modifier les titres et sous-titres dans une page ? Cela dépend de votre CMS, alors suivez mes explications pour WordPress, Prestashop, Wix.

Chaque CMS a sa façon de gérer les balises de titres : à vous de vérifier dans votre cas si c'est bien fait ! En outre, cela dépend aussi du modèle (template / thème) utilisé sur votre site.

A vous de vérifier que vous n'avez pas les erreurs suivantes :

  • le template utilise une balise <h1> sur le nom du site, sur toutes les pages (je rappelle que la balise H1 doit logiquement décrire le contenu principal de la page, pas du site)
  • le template utilise autre chose qu'une balise <h1> pour le titre de l'article affiché en haut de page
  • le template n'utilise aucune balise Hn pour les titres

Lisez les conseils ci-dessous pour les détails.

L'automatisation des balises title, H1..H6

Mieux vaut rédiger individuellement les balises, mais de bonnes règles d'automatisation permettent d'industrialiser le référencement naturel on-site.

Si votre site est gros, je vous conseille donc de commencer par définir des règles d'automatisation, puis au cas par cas de les améliorer manuellement. On fait exactement la même chose avec la balise Title et la meta description !

Dans la suite, j'explique comment ajouter/mettre/modifier une balise H1, H2, H3... dans chaque CMS populaire. Si le vôtre n'est pas listé ici, dites-le dans les commentaires !

Les balises H1-H2-H3 dans WordPress

Quand vous éditez un article ou une page dans le backoffice de WordPress, vous pouvez définir le niveau d'un titre en cliquant sur le menu déroulant des styles :

Balises h1 h6 wordpress
Ce menu de WordPress permet de définir un niveau de titre

Généralement, vous n'avez pas besoin de sélectionner le titre de niveau 1 car votre template l'utilise déjà avec le titre de votre article, qui s'affiche (en front) dans le haut de la page.

Si vous souhaitez définir un titre différent pour la balise <title> et la balise <h1>, vous aurez besoin d'une extension (comme par exemple Yoast SEO ou RankMath).

Les balises H1-H2-H3 dans Prestashop

C'est très classique, là aussi dans Prestashop vous pouvez choisir un titre parmi les 6 possibles :

Balises h1 h6 Prestashop
Ce menu de Prestashop permet de définir un niveau de titre

Les balises H1-H2-H3 dans Wix

Cela dépend peut-être des templates (dites-le moi en commentaires !) mais sur Wix vous pouvez choisir le niveau de titre en cliquant sur un titre puis sur "Modifier" puis sur "Thèmes" afin d'accéder à ce menu :

Balises h1 h6 Wix
Ce menu de Wix permet de définir un niveau de titre

Les noms des différents niveaux de titres prêtent à confusion car on a l'impression que le Titre 1 n'est adapté que pour le nom du site, et qu'on choisit les autres en fonction de leur taille en pixels...

Vos autres questions

Voici les réponses à d'autres questions sur ces balises H1-H6 et leur importance SEO. Si vous avez d'autres questions, posez-les dans le forum.

À quoi sert la balise <h1> ... </h1> ?

La balise H1 sert à indiquer le titre principal du contenu d'une page. À la différence de la balise <title>...</title>, la balise H1 est visible par l'internaute directement sur son écran, généralement en haut de la zone principale. Il est recommandé de toujours avoir une balise H1 pour décrire succinctement ce que la page propose, éventuellement un peu différente de la Title (pour jouer sur plusieurs mots-clés), inédite (ce titre H1 ne doit pas se retrouver sur d'autres pages du site). Il est préférable d'avoir une seule H1 par page même si la norme HTML ne l'impose pas.

Qu'est-ce qu'une balise H2 ?

Une balise H2 est une balise de titre de niveau 2. Il existe 6 niveaux (H1 H2 H3 H4 H5 H6) pour hiérarchiser l'information et aider le lecteur à comprendre comment elle est organisée. Utilisez autant de H2 que vous avez de grandes parties dans votre article. Ensuite, à l'intérieur de chaque partie dont le titre est de niveau 2, appliquez la même règle : s'il y a besoin de découper en sous-parties, alors utilisez des titres de niveau 3 (balise H3).

Faut-il utiliser des balises H3 ?

Utilisez des balises H3 si, à l'intérieur d'une section de niveau 2, vous avez plusieurs parties à indiquer. Par exemple dans cet article, dans la section de niveau 2 dédiée aux différents CMS, j'utilise une balise H3 pour chaque CMS (WordPress, Prestashop, Wix, etc.). Les balises H3 ne sont utiles que sur des contenus assez gros qui nécessitent un bon découpage.

Comment éviter les doublons de balises de titres Hn sur un site web ?

Seuls les doublons de titres H1 posent problème pour le référencement naturel. Vous pouvez obtenir la liste de toutes les pages en doublon en faisant un audit technique du site avec RM Tech.

Quels sont tous les types de balises H1 H2 H3 H4 H5 H6 ?

Voici un aperçu général :

  • La balise H1, le titre H1 ou le titre principal : ces termes désignent la balise de titre la plus importante, celle qui résume le sujet et la thématique de la page
  • Les balises de titres, les balises Hn ou les balises heading : tous ces termes désignent l’ensemble des balises de titre, sans distinction de niveau
  • Les balises H2, les titres H2 ou les sous-titres principaux : ces termes désignent les balises de titre de second niveau, celles qui introduisent les grandes parties du contenu de la page
  • Les balises H3, les titres H3 ou les sous-titres secondaires : ces termes désignent les balises de titre de troisième niveau, celles qui introduisent les sous-parties du contenu de la page
  • Les balises H4, H5 et H6, les titres H4, H5 et H6 ou les sous-titres tertiaires : ces termes désignent les balises de titre de quatrième, cinquième et sixième niveau, celles qui introduisent les subdivisions du contenu de la page. Ces balises sont moins utilisées que les précédentes et ont moins d’impact sur le SEO

Cet article vous a-t-il plu ?

Note : 4.6 (17 votes)
Cliquez pour voter !

22 commentaires

Philippe LAINE

Bonjour Olivier, je teste les possibilités de Wix pour faire un BLOG.
Or j'ai l'impression que les options dans un post de blog ne sont pas les mêmes que pour une page.
Aussi, je ne trouve aucun moyen de placer le titre de l'article en H1, et encore moins de gérer correctement les H2, H3, etc... dans mes articles. On peut seulement choisir 2 niveaux de titres qui sont gérés en css et pas en Hn.
Je me trompe ?

Olivier Duffez

Désolé Philippe, je n'utilise pas Wix, je ne sais pas répondre.

Marie Langlais

Pour les moteurs de recherche (google, yahoo, bing), les balises H1 a H6 n’ont pas toutes le même poids. D’un point de vue référencement, la balise H1 est la plus importante parmi tous les autres titres. Plus on augmente de niveau de titre (h2, h3, h4, h5 et h6), moins son contenu sera considéré comme important par les moteurs de recherche.

Chris

Bonjour, une structure du type:
h1
h2
h1
h2
h3

est elle correcte ?

Olivier Duffez

Non car généralement une page n'a qu'un seul titre de niveau 1.
Et pourquoi n'y a-t-il qu'un seul H3 ? le niveau supérieur est H2 ce qui est bien, mais s'il y a besoin de découper c'est en plusieurs parties donc il devrait y avoir au moins 2 H3.

Alitchi

Bonjour, bonjour,

Merci pour votre long article très intéressant !

J'ai cependant une confusion... à laquelle je ne trouve pas de réponse précise.

Est-ce ok si dans un site de 5 pages il y ait :

1/wrapper > header > H1> image logo > avec la fonction "alt" je mets quelques mots propres à chaque contenu de page . Mon H1 est donc lié au logo.

+

2/ wrapper > section banner > div inner > H1 = en guise de début de titre de page. C'est le début de mon article

J'ai bien compris que un seul H1 pouvait suffire, mais pour le coup si je ne le place qu'en titre de la banner, ce qui me semble être le plus logique, puis que je cherche à le valider sur un validateur, mon header devient "untitled section".
ce qui m'inquiète un peu...

Est-il préférable de mettre un h1 dans le header + dans la banner ? ou la banner suffit ?

Pour la home, qui a moins de contenu, le H1 sur le logo en header est-il suffisant ?

Mille mille mercis d'avance pour vos réponses

Olivier Duffez

sur une page HTML4, il est vraiment conseillé de rester à une seule balise H1, le titre de la page (et pas du site)
sur une page HTML5, il peut y avoir plusieurs H1 puisqu'on peut avoir plusieurs arborescences dans plusieurs sections. Je pense néanmoins que le plus important reste de travailler les Hn dans la partie principale de la page

pour une page d'accueil, les Hn ne s'imposent pas vraiment sauf si elle est bien remplie au niveau contenu

michel

bonjour et merci

En premier je vais supprimer les balises de l'accueil et cela répondra à la remarque sur l'esthétisme et je vais créer une page abstract avec les balises de tout le projet (et une utilisation de liste)

dans un deuxième temps je tenterais de coller à schema.org (pour la page abstract)

michel

bonjour

Mon site utilise webacappella 4

J'ai créé une balise H1 par page

La page accueil est divisée en 4 balises H2 (je suis dans la phase de mise en conformité avec schema.org

Cela perturbe l'équilibre de la page

Que faire sans être sanctionné par google :

- rendre invisible les balises : comment ? attitude googlee

- mettre les infos des balises en bas de la page ?

-............... etc
- merci pour vos conseils

cordialement

MJ

Olivier Duffez

Non Michel, il ne faut ni rendre invisibles ces titres, ni les planquer en bas de page. Si l'accueil a 4 rubriques, c'est une bonne idée de leur donner un titre en H2 à chacune, en quoi cela perturbe-t-il l'équilibre de la page ?
Cela étant, pour une page d'accueil, les balises H ne sont pas vraiment adaptées.

Christelle

Merci pour le retour rapide.
C'est un peu confus, donc un article (moyen de 200-300) sans balise H2,n'est pas nécessairement mal optimisé ? Ce n'est pas "dommage" ?

Olivier Duffez

@Christelle : effectivement, dans un article aussi court que 200 mots, ça risque d'être dur d'avoir plusieurs parties qui méritent chacune un titre (qui serait alors un H2). C'est fou le nombre de personnes qui pensent que pour le référencement, il faut essayer de mettre le plus possible de balises H dans une page ! On en met quand on a besoin de structurer un contenu, c'est tout.

Christelle

Bonjour,
Très instructif cet article.
D'après ce que j'ai compris, les balises permettent (entre autres) de dire à google où sont les mots clefs : title, Hn, Alt de l'image... Du coup, on pourrait croire qu'il peut être obligatoire de toujours mettre des sous-titres pour mieux hiérarchiser l'information et en profiter pour placer des mots clefs. D'où ma question : la balise H2, doit-elle comprendre aussi les mots clés visés ? Est-ce que les mots clefs du H1 doivent aussi se retrouver sur l'un des h2 au moins  ? Exemple H1 : Interview avec Paul Henry / H2 : Paul Henry, un parapentiste téméraire
Merci d'avance pour les éclairages

Olivier Duffez

@Christelle : il ne faut surtout pas résumer en disant "ces balises permettent de mettre des mots-clés", sinon on imagine en effet "tant que je n'ai pas assez utilisé de H2 (et H3) dans ma page, ce n'est pas assez optimisé" ou "ll faut que j'arrive à rajouter des mots-clés dans mes H2" ou "là j'ai des mots-clés, je vais donc les mettre en H2"...
La balise H2 aura sans doute des mots importants pour la page, c'est logique mais pas indispensable.
On ne peut certainement pas donner des règles du genre "les mots-clés du H1 doivent se retrouver partiellement dans les H2"...
J'espère que c'est plus clair ?

Sara

Merci pour cet article très complet.
Grande débutante en WordPress, j'ai fais l'erreur de remplacer tous mes titres 1 pars des titres 2 pour qu'il aient un style différent du titre du site. Il vaut mieux que je change tout ça rapidement ou Google comprendra quand même ? Mes titres utilisés pour le référencement ne sont pas tout à fait les mêmes que ceux de mes pages, qui n'ont en plus que des h2 et autres.

Olivier Duffez

@Sara : il ne faut pas choisir les niveaux de titres en fonction de leur apparence mais de leur signification, comme expliqué dans mon article.
Le plus simple pour aider serait d'avoir une URL d'exemple...

AL2015

@Olivier,
Non désolé pas en mesure de donner de résultats (car d'autres facteurs bien plus essentiels comme la qualité du contenu priment avant tout). Toutefois si je peux aider Google à comprendre la structure de chacune de mes pages en remplaçant un simple "div" par un nav, un footer ou encore un aside, je crois que cela ne peut être que positif. Le HTML 5 autorise la multiplicité des balises H1. Google doit pouvoir s'adapter selon le HTML utitlisé.

Olivier Duffez

Je suis bien d'accord, si on peut aider Google autant le faire, en espérant que ça nous apporte quelque chose. Je dis juste que je n'ai jamais vu de retour d'expérience positive grâce à ça.

AL2015

Beaucoup de plugins et sites d'audits ne connaissent pas le HTML 5. Ne vaut-il pas mieux (en 2016) jouer la carte du html sémantique à coup de balises article, section, aside, footer & nav, figure/figcaption etc.

Olivier Duffez

@AL2015 : oui tant qu'à faire, c'est bien d'utiliser HTML5 et ces balises. Cela dit, je n'ai jamais rencontré un seul cas où leur utilisation avait été bénéfique en SEO (en tout cas mesurable). Peut-être avez-vous un retour d'expérience à partager ?

Carine

Merci pour cet article très détaillé. Dans le ecommerce nous trouvons souvent l'utilisation des h... dans les menus et dans le titres des produits d'une page catégorie. Est-ce une bonne pratique pour le seo ?

Olivier Duffez

@Carine : je l'ai indiqué dans l'article, mais pas de façon aussi précise ou explicite.
Dans aucun cas je ne trouve qu'une balise de titre H ne devrait se trouver dans un menu : il est préférable d'utiliser des listes à cet endroit.
Pour les titres des produits dans une catégorie, les avis sont partagés mais j'ai indiqué que je préfère ne pas en utiliser (c'est également la recommandation du W3C).

Les commentaires sont fermés