Structure hiérarchique du contenu avec des balises d'en-tête Hx
Publié: 2018-01-30Table des matières
L'utilisation d'en-têtes de contenu sur des sites Web est un sujet assez populaire qui a suscité de nombreux mythes qui persistent encore aujourd'hui. Que sont alors les balises d'en-tête, pourquoi sont-elles utilisées et comment implémenter une structure optimale de balises d'en-tête sur un site Web ?
- 1 Qu'est-ce qu'un en-tête ?
- 2 Utilisez du contenu important dans les balises d'en-tête Hx
- 3 Que dit Google à propos des balises d'en-tête Hx ?
- 4 Autres informations essentielles sur les en-têtes de contenu
Que sont les rubriques ?
Les balises d'en-tête sont utilisées pour présenter la structure du contenu aux utilisateurs (crawlers de navigateur Web également). Il existe six tailles de rubriques, de H1 à H6 , bien que la première d'entre elles soit la plus pertinente (c'est la rubrique la plus importante), tandis que H5 et H6 sont rarement utilisées.
Étant donné que les balises d'en-tête Hx contiennent du texte qui est (devrait être) beaucoup plus gros que le reste du contenu , il s'agit d'un indice visuel pour les utilisateurs leur permettant de comprendre ce que les paragraphes ci-dessous décrivent. L'utilisation d'en-têtes de différentes tailles pour représenter la structure hiérarchique permet aux utilisateurs de digérer plus facilement le contenu.
Dans la syntaxe HTML, nous utilisons des balises entre crochets <> :
<h1>Titre 1</h1> <h2>Titre 2</h2> <h3>Titre 3</h3> <h4>Titre 4</h4> <h5>Titre 5</h5> <h6>Titre 6</h6>
mais sur un site Web, ils ressembleront, par exemple, à ceci (évidemment, en fonction d'une feuille de style):
Des exemples d'utilisations peuvent être trouvés ici : https://www.w3schools.com/html/html_headings.asp.
Utiliser le contenu important dans les balises d'en-tête Hx
Lorsque presque chaque jour apporte de nouveaux articles de blog, des nouvelles, des guides ou des articles d'experts, il vaut la peine d'attirer l'utilisateur non seulement avec une belle image ou un titre accrocheur, mais aussi avec un contenu structuré.
En parcourant un article spécifique sur un appareil mobile, les lecteurs prêtent souvent attention aux titres. Outre les aspects purement esthétiques, une bonne structure des titres facilite l'interprétation et la digestion du contenu, il est donc possible qu'un utilisateur reste plus longtemps sur un site Web donné.
Non seulement les utilisateurs peuvent bénéficier d'un site Web bien structuré, mais les robots d'exploration peuvent également le faire, car le texte de l'en-tête est également important pour eux. C'est pourquoi il est si important que les balises d'en-tête incluent des mots-clés qui seront liés au contenu de la page en termes de sujet. Si on cible une page précise avec des mots-clés précis, il est souhaitable de les mettre (même sous une forme différente) dans des rubriques ; ils peuvent naturellement être placés dans le texte, mais dans une certaine mesure.
Une structure doit être clairement définie et les rubriques doivent différer en taille les unes des autres. Ce serait une erreur de les styliser de la même manière que le corps du texte ou de ne pas les distinguer par importance.
Titres Hx dans les articles
Lors de la rédaction d'articles de blog, nous pouvons utiliser les en-têtes de manière créative. Vous devez définir la structure de votre article avant de le commencer. Les titres peuvent être des titres croisés divisant des paragraphes individuels (comme dans cet article même), et le plus important d'entre eux <h1> peut être utilisé pour décrire le sujet. Il est fréquemment défini automatiquement dans un modèle de site Web, donc si ce n'est pas le cas, cela vaut la peine de faire un changement discuté avec un expert SEO et un développeur Web.
Une structure bien conçue d'un article peut le rendre plus attrayant. Un contenu intéressant placé dans les titres informera clairement les lecteurs (et les crawlers) de ce qu'ils doivent attendre d'un article donné.
Quelles balises d'en-tête mettre sur la page d'accueil du site ?
Les pages d'accueil (ou toute autre page, par exemple les pages de service) doivent également avoir une structure hiérarchique d'en-têtes. Dans la section <head>, il est conseillé de placer H1, sous H2, H3 et ainsi de suite, bien qu'il n'y ait pas un nombre maximum de balises d'en-tête. Même dans le cas de H1, vous n'avez pas besoin de vous limiter à une seule rubrique (comme expliqué plus loin).
Cependant, vous devez vous rappeler que des sections telles que "À propos de nous" ou "En savoir plus" placées dans des en-têtes n'ajoutent pas grand-chose en termes de contenu. De plus, utiliser des titres de moindre importance, par exemple H5–H6, est pratiquement inutile (sauf pour l'aspect mise en page d'un article).
Sites Web d'une page = une balise d'en-tête H1 ?
Dans le cas des sites Web d'une page, ce n'est pas aussi évident que pour les articles de blog. Dans les spécifications HTML5 (https://www.w3.org/TR/2014/REC-html5-20141028/sections.html), vous pouvez trouver la balise <section> responsable de la définition des sections individuelles dans un document HTML. Une section comprend généralement un en-tête, ainsi chaque section peut avoir une structure hiérarchique différente, par exemple :
<section id="à propos"> <h1>À propos de moi</h1> <p>Un texte sur moi :)</p> <h2>Je m'appelle Dawid...</h2> <p>Deuxième paragraphe sur moi. lol :)</p> </section> <section id="portefeuille"> <h1>Mon portefeuille</h1> <p>Mes derniers projets...</p> </section> <rubrique> <h1>Témoignages</h1> <p>Avis de clients satisfaits...</p> <h2>Derniers tweets</h2> <p>Tweet 1</p> <p>Tweet 2</p> </section> <rubrique> <h1>Contacter</h1> </section>
Comme vous pouvez le voir ci-dessus, chaque section a un en-tête H1 différent, puis un en-tête H2… Bien que vous puissiez décider d'avoir une ou plusieurs balises d'en-tête H1 et par la suite H2, H3, etc.
Que dit Google à propos de la balise Hx ?
Les employés de Google ont beaucoup parlé des balises d'en-tête, mais cela vaut la peine de citer leurs dernières opinions. Il y a un an, John Meuller a écrit ce qui suit sur le forum Google pour les webmasters : https://productforums.google.com/forum/#!msg/webmasters/BmyI8YX_25A/81hZNQFJDQA
"Nous ne traitons pas HTML5 différemment et avoir plusieurs balises H1 sur une page est bien. Soyez raisonnable lorsque vous les utilisez, utilisez-les là où ils ont du sens. Il n'y a certainement aucune pénalité pour l'utilisation des H1.
Un peu plus tard, en avril 2017, John a assez brièvement répondu sur Twitter (https://twitter.com/JohnMu/status/852131231928135680) à une question sur le nombre de titres H1 pouvant être utilisés sur une seule page.
Enfin, dans le cadre de la série YouTube "SEO Snippets" sur la chaîne Google Webmaster, un petit guide sur cette question a été téléchargé :
Autres informations essentielles sur les en-têtes de contenu
Même si les employés de Google suggèrent (au moins dans leurs déclarations officielles) une approche flexible des balises d'en-tête, il y a quelques règles à suivre :
- Ne pas abuser des titres sur une page
- Utilisez des titres là où cela a du sens et quand ils reflètent le texte en dessous pour aider les utilisateurs à déterminer où un paragraphe donné commence et se termine
- Ne mettez pas des paragraphes entiers (tout le contenu) dans un titre
- N'utilisez pas uniquement des mots-clés, en particulier sous une forme non naturelle
- Ne masquez pas les titres dans le corps du texte en utilisant la même taille de police pour le titre et le corps du texte
- Gardez la hiérarchie de la structure ordonnée
- Utilisez peut-être parfois la balise <strong> au lieu d'une balise d'en-tête ????.
Lors de la création de contenu, ne sur-optimisez ni ne sous-optimisez ; Au lieu de cela, recherchez un équilibre et concentrez-vous sur les sentiments des utilisateurs qui digèrent le contenu de votre site Web, y compris les articles, les guides ou d'autres articles de blog. Après tout, les rubriques sont des déterminants du classement pour le moteur de recherche Google et c'est pourquoi vous ne devez pas les négliger.