À l'occasion d'audits SEO, je fais fréquemment le constat qu'une mauvaise hiérarchisation des balises de titres H1 à H6 pousse les propriétaires de sites à faire des erreurs grossières pour l'optimisation correcte des pages de leurs sites.
Je vais donc expliquer et donner des bases de bonnes pratiques pour éviter de s’emmêler les pinceaux, surtout une fois que le site évolue.
Hiérarchiser, ça veut dire quoi ?
Cela veut dire organiser les choses de manière à ce que chaque élément soit subordonné à un autre.
Lorsque l'on parle des titres que définissent les balises h1, h2, h 3, h4, h5, h6, le W3c nous dit :
« Un titre décrit brièvement le sujet de la section qu'il introduit ». Ceci veut dire qu'un titre (hn) va décrire en résumant de manière explicite le paragraphe qu'il présente.
Lorsque l'on classe les titres en les hiérarchisant dans un contenu, on apporte une notion de valeur à chacun de ces titres dans notre page. Un titre H1 devrait donc résumer le sujet général de ma page, alors qu'un Titre H6 résumera une section très détaillée dans ce sujet.
Mise en pratique de la hiérarchisation.
Plutôt que de rester dans la théorie, prenons un exemple. Nous allons traiter le cas d'une page qui présente les bonnes pratiques de conception d'un site web *.
<h1>Concevoir un site web</h1>
<h2>Le contenu</h2>
<h3>Les expressions-clés</h3>
<h4>Définir les expressions-clés</h4>
<h5>Les sources de recherche</h5>
<h6>L'écoute des clients</h6>
<h6>Les outils web</h6>
<h4>Classer les expressions par volume de recherche</h4>
<h3>La rédaction</h3>
<h4>définir des titres percutants</h4>
<h4>Utiliser des synonymes</h4>
<h2>L'arborescence</h2>
<h3>Définir des rubriques</h3>
<h3>La construction en silo</h3>
<h3>Le maillage interne</h3>
<h2>Le design</h2>
<h3>Construire son logo</h3>
<h3>Définir une charte graphique</h3>
<h3>Comment mettre l'emphase sur certains contenus</h3>
Dans cet exemple, chaque titre se verra suivi d'un paragraphe. Un titre peut aussi ne pas avoir de paragraphe qui lui soit directement attribué, mais comporter des sous-titres qui eux en posséderont.
* Ceci est juste un exemple d'utilisation des balises Hn, en aucun cas un plan parfait sur le sujet.
Quelques repères dans l'exemple :
- Les titres H3 "Les expressions-clés" et "La rédaction" dépendent hiérarchiquement du H2 "Le contenu".
- Les titres H4 "Définir les expressions-clés" et "Classer les expressions par volume de recherche" dépendent hiérarchiquement du titre H3 "Les expressions-clés"
- Les titres H2 "Le contenu" et "L'arborescence" et "Le design" ont la même valeur car on considère qu'ils ont la même importance dans notre exposé.
Quels constats fait-on dans la hiérarchisation de ces titres ?
On ne trouve qu'un seul H1
À ma connaissance, techniquement rien n'interdit explicitement de mettre plusieurs H1 dans une page. En revanche ceci pousse souvent à l'erreur (normal, c'est illogique). Si l'on considère que Google (et souvent les visiteurs) préfère qu'un seul sujet soit traité en profondeur dans une page. Avoir un seul titre principal évite de s'éparpiller sur le plan sémantique.
Pour compléter sur ce point, je conseille un titre H1 différent du Title. Dans l'exemple donné ci-dessus, le Title aurait pu être « Construire un site internet ». Le Title et le H1 veulent dire la même chose, mais utilisent des mots différents pour augmenter mes chances de me positionner dans les résultats et éviter la suroptimisation. On constate quand même que sur un site bien trusté, ça passe sans souci.
La hiérarchie est parfaitement imbriquée.
Et combien de sites ne respectent pas cette imbrication ! Un H4 ne sera jamais subordonné à un H2, mais toujours à un H3. Même principe pour les autres imbrications. En ne respectant pas cette logique, vous ne facilitez pas la compréhension de vos contenus par un moteur de recherche.
Les erreurs fréquentes de balisage :
Le manque de respect d'une logique cohérente de balisage des Hn
Celle que je trouve le plus souvent consiste à avoir la même balise H1 sur toutes les pages du site. C'est le cas où cette balise est utilisée dans le header et que le titre est celui du site, mais pas de chaque page individuelle.
À mon avis, il n'y a pas pire pour empêcher Google de bien comprendre le thème de chaque page indépendante. Quoique certains font pire, ils mettent une image (souvent leur logo) dans ce H1 !
Je vois aussi parfois des "trous". Avec par exemple des H3 dans une page qui ne possède pas de H2.
Un balisage Hn d'éléments qui ne devraient pas l'être.
On retrouve très souvent ces balises sur des éléments qui n'appartiennent pas au cœur de la page, mais à des informations connexes. Sur des boutiques en ligne, cela va être un titre « panier » ou un titre « catégories connexes » ou un titre "Newsletter". On retrouve alors ces titres balisés en Hn sur toutes les pages du site alors qu'il n'appartiennent pas au champ sémantique de chaque page unitaire.
Ceci est souvent dû à un manque de connaissances SEO, ou bien a une grosse flemme du développeur qui n'a pas envie de créer une ligne de CSS supplémentaire pour mettre en forme le texte concerné.
Quelques points à garder en mémoire
- La succession de vos titres doit correspondre à une sorte de table des matières de la page. Wikipédia est un très bon exemple pour ses pages étoffées. D'ailleurs, le petit sommaire qui est parfois présent est justement présenté comme tel. Voir une page bien structurée chez Wikipédia.
- Les titres apportent de l'ergonomie à votre page. Ils permettront de s'y repérer, surtout si votre contenu est assez fourni.
- Ne bourrinez pas en truffant vos balises Hn de mots-clés. On sait d'ailleurs que si visiblement la balise H1 a un certain poids pour le positionnement, il semble "moindre" pour les H2 et suivants (mais il compte quand même). Avant tout, ces sous-titres doivent aider votre visiteur à se repérer dans votre page en comprenant son plan.
- Avant de commencer à rédiger une page, essayez d'en faire systématiquement le plan en rédigeant avant tout ses titres et sous-titres, ceci vous facilitera souvent la vie.
- En utilisant ces éléments de titres, vous n'impactez pas seulement l'aspect visuel. Vous définissez une relation sémantique entre les mots et ceux qui leur sont subordonnés.
- Il est possible de mettre un lien sur un titre. C'est par exemple le cas sur la page d'accueil de ce blog.
En conclusion
Le SEO, c'est aussi de la rédaction. Bien structurer vos titres vous aidera mieux structurer le contenu de vos pages. Vos visiteurs vous en remercieront, tout comme les moteurs.
Pour mieux joindre l'exemple à la pratique, j'ai tenté de réaliser au mieux le balisage de cette page. Vous pouvez par exemple l'afficher en copiant son URL sur http://www.browseo.net/ Dans la colonne de droite, la liste et la hiérarchie de ses titres vous apparaitra clairement.
Edit : il reste des cafouillages dans ce thème que nous venons d'installer (un H3 de twenty twelve qui n'a rien à faire sur le menu - Voila, c'est corrigé 🙂 ).
Je n'ai pas encore le recul pour vous donner plus d'information sur les balises du type <article> ou <section> du HTML5
Article connexe :
https://web.archive.org/web/20190909224352/http://noviseo.fr:80/2012/12/optimiser-les-balises-hn-sur-wordpress/
Tres tres tres bon article - tres bon resume de ce qui doit se faire au niveau des balises - 100% d'accord avec toi meme si je suis sur que nombre de gens vont venir dire que si on met 2 balises h1 ca marche aussi et bla bla bla ... Autre truc que je conseille et que j'ai pas vu dans l'article c'est que generalement je deconseille de mettre des liens dans les H1 et H2 - si ce sont des titres sur une page donnée c'est illogique que ce soit aussi des liens vers une autre page... mais bon la aussi certains vont dire oui mais ca marche bla bla bla ... en tout cas article simple, clair et concis du grand sylvain!
Salut Sylvain,
Très bon article merci.
2 petites questions :
- Entre le H1 et le title, lequel devrait être le plus optimisé ?
- Certains webmasters mettent une liste de mot clés en fin d'article avec pour sous titre "mots clés qui sont arrivés sur cet article" suivi d'une liste en . Que penses tu de cette pratique de listing d'expressions clés en fin d'article ?
Très bon article sur la hiérarchie des Hn avec une mise en pratique claire et simple d'une structuration de page avec les bons mots pour les décrire.
Je te rejoins sur la structuration du contenu et sur le respect de la hiérarchie. Ce que je demande à mes clients maintenant, c'est, puisqu'ils utilisent word pour produire les contenus, autant qu'ils l'utilisent comme il faut en utilisant la mise en forme de l'outil pour les titrages (je crois qu'ils ont jamais fait attention qu'il y a un sélecteur dans leur editeur de texte).
Ensuite générer une table des matières, et surtout sans leur avoir présenté de design dans lequel se caler parcque c'est à partir de là que les erreurs commencent, je m'explique :
De base, je dirais que tous les CMS wordpress, joomla, magento, prestashop ont leur thémes construit avec cette erreur de titrage, dans les sidebar, vous verrez toujours des blocs avec des titres h2 ou h3, parcque visuellement, ils ont la taille dont on a besoin sans être obligé de refaire une déclaration de CSS.
La limite entre ce que devrait être un article et son interprétation par un moteur de recherche est différente.
Pourquoi avoir mis des h2 et des h3 dans les blocs de sidebar ?
C'est la logique d'un découpage de section, les blocs doivent être différentié du contenu. Avec le html5 c'est un peu éclairci, mais on ne sait pas si google le prend en compte, pour ça il y a donc la balise "aside" qui devrait permettre d'exclure ces blocs comme du contenu et d'ailleurs devraient pouvoir être structuré aussi en h1 pour ces blocs (oui on peut utiliser plusieurs h1) mais l'inconnu reste de savoir comment il l’Interprète le big G.
La plupart d'entre nous, partent sur le thème principal du CMS et l'adaptent, et partent donc avec ce problème, et souvent ils ne pourront pas faire grand chose car il faudrait aller mettre les mains dans le code du CMS pour le corriger (c'est codé comme ça).
Dans une logique seo, il faudrait que les noms des blocs sidebar soient plus explicite, mais du coup ils ne seraient plus digeste ou être sûr que google interprète cette balise aside comme elle doit l'être dans les spécifications du W3C.
Au début, je me suis dit, oh boarfffh [prononcez-le, vous verrez], et puis je l'ai relu une fois encore, parce que bon, un article sur le blog d'Axe-Net, il délivre quand même une information (parfois deux... hahahaha) !
Et puis en lisant les commentaires. Mais oui, on ne fait pas correctement les choses ! Le "on" ça peut être le professionnel comme le client.
Alors relisons tout celà et résumons :
- rédigeons hors de l'éditeur web, sous Word comme le dit Jessyseonoob, au moins on est dégagé du carcan de l'éditeur online et des obligations "SEO".
- organisons l'article de manière sensée, ordonnée et organisée. L'architecture web (et SEO) découlera d'elle même.
- corrigeons le template qui est codé par un designer (bravo à lui) mais pas toujours au fait des contraintes SEOistiques.
J'oubliais : je voulais témoigner d'une situation similaire lors d'une prise en charge de l'optimisation d'un site sur un CMS.
Récemment, un designer avec qui j'ai bossé avait mis le logo et le slogan dans une balise H1.
Ma remarque : "mais le H1 c'est pour hiérarchiser le contenu ! il ne faut pas que ça soit dans du H1 !"
Sa réponse : "mouais bof, on verra plus tard, c'est toi qui le fera quand tu t'occuperas du SEO. Mais attention à ne pas saloper ma feuille de style, hein !"
bref, pour lui, ce n'était pas une faute du tout. Ce H1 était existant dans le template de base. Et comme ça cadrait avec son besoin (taille, style, mise en page), il n'a pas trouvé intéressant de le changer car ça ne faisait partie ni de son besoin, ni de ses préoccupations.
@ Lejuge
D''abord, merci beaucoup pour les compliments.
Sinon, je serais moins vindicatif que toi sur les liens sur les H2 et en dessous.
Par exemple, c'est tout à fait adapté sur la page d'accueil d'un blog. Les H2 sont des titres (ceux des n derniers articles) et sont cliquables. On peut aussi coder comme cela sur une page d'accueil qui afficherait les n dernières actualités du site en plus d'autres contenus.
On peut aussi procéder de la sorte sur une boutique en ligne ou les H2 sont les titres des produits dans une rubrique. Ils sont là aussi cliquables.
@ Simon
Euh... Le titile très très loin devant tout le reste.
Pour ta 2ème question, elle mériterait un article complet. Je n'ai pas de réponse toute faite, cela dépend du site à mon avis. Mais en deux mots, quand c'est automatisé, cela veut dire que les visiteurs sont déjà arrivés sur la page en ayant tapé l'expression concernée. Il faudra donc faire gaffe à la suroptimisation, et au fait que l'on sait bien que ce contenu automatique est produit exclusivement pour le SEO.
@ Jessynoob
Pas bête du tout le truc des titres avec Word !
D'accord avec toi sur le fait que le contenu doit être réalisé avant le design. D'ailleurs le design est là pour mettre le contenu en valeur, pas l'inverse https://blog.axe-net.fr/contenu-maitre-design-serviteur/
Pour les balises de titres dans les sidebar, on est d'accord, c'est pourquoi je le précise dans l'article, c'est une erreur très fréquent souvent justifiée par la flemme au moment du dev.
@ Laurent
Un peu le gars qui te met du papier peint alors que tu lui dis que tu vas devoir casser les murs. Et bien évidement il te dit que c'est toi qui devra décoller le papier peint pour le reposer 🙂
@Le Juge
J’ai vu aussi des balises H1 où était ajouté du STRONG…
J’ai vu aussi des sites où tout le rédactionnel était en h1, sans discernement (site pénalisé d’ailleurs)
@Julien
Le problème globalement et que beaucoup pensent « mise-en forme » quand ils utilisent le HTML au lieu de penser « sémantique »… Cette incompréhension existe depuis que le web existe.
Hello
Bien que ce soit souvent par flemme il m'arrive parfois de mettre des h3 (les h4,5,6 mais ça par contre c'est de la pure flemme) pour identifier des widgets ou des sections en sidebar.
Je me dis que ça peut augmenter le poids de certains mots clefs sur lesquels je souhaite me positionner.
Ex : en sidebar h3>Nos meilleures montres en or
Cette balise se retrouvant dupliquée sur des dizaines voire des centaines de pages.
Est-ce que tu déconseilles cette pratique ?
Je suis sinon étonne de ne pas voir les balises strong b et a dans la hiérarchie que tu décris
Pour ma part je suis le modèle title > h1 > h2 > a > strong > i > h3
J'ignore s'il est pertinent mais je me posais une autre question (enfin 2)
- Les balises strong et b sont elles équivalentes ?
- Quid des balises Hn avec dedans du strong ou du a ?
Thx
Bonjour,
Et donc laisser un commentaire est "une phrase" qui mérite une balise h3 ?
Amitiés
Wil
Bon récap' sur la structure Hn. C'est bien de faire un peu d'éducation et j'espère qu'un certain nombre de développeurs te liront. Je suis toujours très étonné de tomber dans 3 audits sur 4 sur des sites dont la structure Hn n'est pas respectée, alors que ça fait partie des bases en intégration. Un développeur (et je ne dis pas un bon développeur), devrait toujours respecter la hiérarchie des Hn, car avant d'être une question SEO, pour lui ça doit d'abord être le respect des standards du Web dictés par le W3C Après, que ce ne soit pas optimisé sémantiquement, qu'il y ait toujours le même H1 ou que l'on trouve des titres qui ne devraient pas l'être, ça c'est bien le boulot du SEO (et je n'insulterai donc jamais un dev pour ça :p ).
C'est toujours la 1ère chose que je regarde sur un site Web, ça donne une bonne idée de sur quoi on va tomber, autant sur la qualité du code et du développement que sur l'opti on-site SEO du site...
les Hn sont effectivement le B.A.B.A de la mise en forme d'un texte, de la même façon qu'un rapport. Petit lien pratique qui vous permet vérifier la cohérence de vos balises (si j'arrive à franchir la barrière de l'anti-spam) - http://www.yakaferci.com/balises-h1-h2/ Je l'utilise systématiquement désormais avant de mettre en ligne un article.
Salut et merci pour ces précisions
je viens de regarder un peu comment les Hn sont utilisés sur mon thème wordpress et j'obtiens ceci pour mes titres de pages :
Mon Titre de Page
Alors que je devrais avoir Mon Titre de Page
Puis (idéalement) un H1 différent de mon titre de page en début d'article. Si j'ai bien suivi.
J'ai l'impression, dis moi si je me trompe, que je n'ai pas du tout de balise title mais seulement un h1 affublé d'une classe css title. Ultra mauvais non ? C'est le site web mentionné qui est concerné.
Mince ils m'ont sucré le code. Je recommence..
J'ai ceci :
Mon titre de page
Je devrais avoir :
Mon titre de page
suivi de :
Mon titre d'article
Article intéressant mais je constate que ce blog lui même ne respecte pas toutes ces guidelines ... Le menu est truffé de h3 qui ne devrait pas en être.
@ Fabien
Ce n'est pas catastrophique. C'est d'ailleurs le cas sur le thème de ce blog que nous nettoyons avant de finaliser la partie graphique.
Sinon, les balises strong ou b n'ont rien à voir. Tes title peuvent être en strong ou en B mais en général on gère cela dans les CSS
@ Wilfried @ Aurelien
Bien vu ! Comme je le disais à Fabien, nous "nettoyons" au fur et à mesure ce thème que nous venons de mettre en place. Il reste des âneries, même si nous avons déjà sacrément fais le ménage.
D'ailleurs, ce ne sont pas trop ces H3 en fin de contenu qui sont gênants car ils arrivent vraimment en fin de page, mais plutôt le H3 au début sur le menu 🙂
@ Litz
Il n'est pas dramatique non plus d'avoir un title et un H1 identique.
Il faut juste y faire attention sur des expressions très concurrentielles.
Je suis comme toi sans assez de recul sur la manière dont google prend en compte plusieurs balises h1 mais dans les spécifications html5 c est tout à fait logique de pouvoir en mettre 1 h1 par section. Je vais essayer de faire des tests en début d année pour voir comment ça réagit.
De tête, Olivier andrieu conseille (et applique sur abondance) de mettre le chapo en h2. Tu en penses quoi?
Le BA-B.A qui n'est la plupart du temps jamais mis en application de manière correcte. Bien mettre en œuvre son découpage d'information via un balisage sémantique c'est déjà une énorme partie de l'optimisation on-page.
Et c'est là où on retrouve la croisée des compétences du référencement au sens large : avoir un cerveau pour rédiger des articles intéressants, avoir une logique pour organiser l'information au sein de ces contenus, avoir des compétences (x)HTML pour la hiérarchiser , et les connaissances des notions de linking, linjuice, trustrank etc pour créer le maillage interne et externe qui finira de donner toute son autorité à la page sur la thématique ciblée en amont.
Merci Sylvain pour cet article complet !
Yann
@Le Juge J'avais pas vu ton post mais tu m'as fait réfléchir à un truc.
Les CMS générent sur la page d'accueil des résumé des articles plus complets, mais en fait ils remplissent tous la même notion d'article ils devraient avoir un balisage "article". Et je me pose donc d'autres questions :
Dans ce cas là, le lien sur le Hn sert la page interne qui aura le même titre, non ?
Donc est-ce qu'il faudrait sacrifier les H1 de la page d'acceuil avec des balises "articles > h1 > contenu" pour chaque bloc ? parcque sémantiquement ce sont vraiment des articles qu'ils décrivent et pas un contenu de page d'accueil
@Axenet
Je ne suis pas vindicatif sur les liens je conseillle ( je suis pas vindicatif tout le temps quand meme)- surtout pour les h1... bon après c'est vrai pour les h2 et en dessous on peut négocier.
Je pense ue comme tu dis - le fond du probleme vient que souvent les balises hn sont utilisées pour par les designers pour la mise en place e la page
Bonsoir Sylvain,
Tu parles du panier sur un site e-commerce.
Effectivement, sémantiquement ce bloc ne doit pas être H1 ou H2.
Il y a cependant du sens à démarquer ces blocs sémantiquement (paniers, catégories, promo, etc ...) du reste du contenu. Un Hn me semble l'une des moins mauvaises solutions.
UL / LI ce ne pas approprié, pas plus span ou div, c'est pour la mise en forme.
strong/italic éventuellement.
Bonjour,
Merci pour ce rappel des basiques, bien souvent les audits techniques de sites contiennent un chapitre sur le sujet; l'article est donc de valeur !
J'ai une petite question, si l'on souhaite faire un sommaire de nos titres, comment Google va-t-il percevoir la duplication des balises Hn sur une même page ?
Existe-t-il un moyen de lui dire que c'est un sommaire ?
@ Jérôme
Une balise Hn est normalement un titre. Il parait peu conseillé d'y mettre un texte trop long.
@ Mélanie
C'est sans doute à voir au cas par cas.
Sur le plan esthétique, on peut faire ce que l'on veut sans appliquer des balises Hn.
Sur le plan sémantique, avoir le mot "promotions" en Hn sur toutes ses pages n'est pas forcément adapté.
Mais bon, si cela vient en bas de code après avoir placé les titres différenciant dans la page, c'est sans doute un moindre mal.
@ Aston
Les textes du sommaire seront simplement des liens vers les sous titres en Hn, mais les liens eux-même n'auront pas de balise Hn.
Bonjour Sylvain,
Merci pour ce rappel d'un des fondamentaux du référencement.
J'ai tendance à faire un H1 assez bref. Il est clairement centré sur mon mot clé principal. Pour le title, je le fais plus long. Il contient mon mot clé et explique brièvement de quoi l'on parle dans la page. Il est aussi tourné pour inciter la curiosité chez l'internaute qui découvre le lien sur Google, pour l'inciter à cliquer.
En fait, je suis un peu étonné par ton article, car j'ai toujours lu qu'il ne fallait
absolument pas avoir plusieurs H1.
Je crois surtout que l'erreur principale, même si cela peu paraître con pour certain,
et de croire que les balises Hn servent à gérer la typographie seulement(une facilité
pour le débutant blogueur) alors qu'il vaudrait mieux changer la taille en manuel
pour wordpress.
Pour ceux qui écrivent leurs textes sur Word, il suffira simplement de vérifier ensuite
que dans leur article tout s'imbrique correctement comme tu l'as précisé =>affichage=>plan
Amicalement
Bonjour Sylvain, merci pour cet article. (edit : les balises ont logiquement sautés 😉 )
Qu’en est-il d’un balisage "Hn" dans une balise "Aside" puisque finalement nous isolons ce contenu du contenu principal par cette balise, ainsi ce contenu pourrait-il être considéré comme une sous page dans la page ? Et dans ce cas d’un point de vue purement sémantique ce découpage justifierait-il une balise de titre ?
Petit cas pratique en rapport pour lequel je suis en train de faire un audit :
J'ai un client qui souhaite se positionner sur "yoga + ville", "fitness + ville", "gym + ville" et 5 autres types de sports pour une seule et même petite ville à chaque fois. Tous les sports sont énumérés sur une page interne "nos cours" avec à chaque fois le nom du sport et une brève description de 60/80 mots.
J'ai préconisé de créer une page pour chaque sport pour pouvoir se servir de là puissance des title mais le client ne peut pas (pas de budget pour son dev) bref je suis obligé de cibler là page énumérant tous les sports pour le netlinking.
Dois-je mettre les titres de chaque blocs sports énumérés en h1 ou en h2 dans ce cas précis pour faire ranker le mieux possible là page sur chaque sport suivi du nom de là ville (j'ai déjà préconisé Google + pour se positionner localement avec google map) ?
@ Franckwilliams
Oui, je le lis souvent aussi, mais je ne sais pas d'où cela vient, ce n'est pas une erreur en tant que telle. Maintenant, vu le cafouillage que l'on voit très souvent, autant se limiter à un seul, cela simplifie la logique pour la plupart des gens lorsqu'ils rédigent.
@ Valentin
Si cela vient après le contenu principal, ce n'est pas très grave (cf mon edit dans l'article)
@ tShak
Euh, c'était ta première solution la bonne. Une page par sport, à condition que cela soit très naturel pour le visiteur (attention à la duplication). Maintenant, si le client ne peut pas, tu fais comme tu veux, mais en lui disant bien que c'est moins efficace.
Pense aussi à Google adresses si tu n'as qu'une ville, en terme de visibilité ça sera sans doute bien plus efficace.
Ps : difficile de toujours bien répondre sans voir le site.
Évidemment, je suis d'accord avec l'ensemble :-)... et aussi avec le Juge (vindicatif... joke !) qui nous rappelle qu'il y a toujours quelqu'un qui vient contredire nos recos… Ici, un client préfère pour des raisons esthétiques, passer outre les h1 et autres (merci le graphiste !!!!). Un autre verra son site doté de h2, mais sans h1 : à nous de redresser le tir ! Sans compter effectivement, les h1 "rangées" dans les images, etc. Il y a souvent un gros nettoyage à faire au début d'une presta SEO. Effectivement, le plus simple est de structurer ces hn au fil de la rédaction de contenu. C'est en amont qu'il faut prendre en compte cette logique.
Le balisage Hn est effectivement la base de la structure d'une page. Et je te rejoins sur le fait de conseiller de n'avoir qu'un seul H1 par page pour ne pas s'éparpiller au niveau sémantique. Cela permet de se focaliser sur le contenu principal, comme Google le souhaite (et cela même si les spécifications HTML5 indiquent que l'on peut avoir un H1 par section).
D'ailleurs, je vois que tu cites WordPress par rapport aux balises Hn sur des blocs communs (commentaires récents et autres), mais c'est loin d'être le principal problème du CMS : l'autre souci par exemple, c'est que l'utilisateur a directement accès via une liste déroulante à l'ajout de titre de niveau 1. Si on ne les forme pas, ils risquent donc d'ajouter des H1 supplémentaires au sein même d'un contenu. Et cela arrive souvent malheureusement...
Et qu'est ce que je fais moi quand mon client cet été m'a demandé de supprimer tous les titres (c'était des h1 sur chaque page) et de mettre la même balise title sur toutes les pages ?
Heureusement, la plupart de mes clients sont sensibles à ce type de recommandations.
@ Daniel
WordPress est truffé de défauts d'origine en ce qui concerne le SEO. Le plus gros est sans doute le contenu dupliqué quand les catégories, auteur, mots-clés sont utilisés sans faire attention aux impacts.
D'ailleurs, Magento, Prestashop et autres CMS sont pareils. Il faut généralement allez nettoyer un peu avant de faire un site avec.
@ Christophe.
En fait, ta question est : Que faire quand le client souhaite se suicider ? 🙂
Bon rappel pour la hiérarchisation des balises h même si comme tu le dis avec un cms (que ce soit WordPress ou Joomla) il faut savoir mettre les mains dans le code pour gérer tous les contenus comme nos fameuses sidebars.
Mais on revient ici au fondamentaux d'une rédaction pure et simple où l'info est orientée pour l'internaute, en gros comme un écrivain pour son livre, hiérarchiser et organiser son contenu comme un sommaire ou un lexique afin qu'il trouve l'information dont il a besoins plus facilement (ça reste du bon sens et le web n'y échappe pas).
Arf... moi aussi je dois avouer qu'au début quand j'ai vu le titre de cet article je me suis dit ok c'est pour ne noob de chez noob qui découvre internet... Malheur à moi... bon bref... j'ai tous mes sites à revoir pratiquement. Au passage merci Browseo que je ne connaissais pas et qui va venir enrichir mes bookmarks de tools. Mais c'est vrai qu'étant issus d'écoles de bourrins ou on souhaite faire vite... on prends jamais le temps de ces détails. Je vais faire le test d'essayer de rectifier la chose sur un de mes sites et voir si accessoirement il y a un impact sur le ranking. Je suis de plus en plus séduis par l'idée qu'un site bien fait n'a pas obligatoirement besoin d'avoir les liens de la terre entière. Je rêve de voir un site ranker avec peu de liens uniquement parce qu'il est mieux fait que les autres qui ne misent que sur le BL.
Bon ok je suis bisounous mais j'aime l'idée de faire les choses bien... autant que possible.
Hello à tous,
Merci beaucoup Sylvain pour ce merveilleux article ! Complet et "structuré" comme d'habitude 🙂
Juste un petit truc que j'ai eu l’occasion d'entendre concernant les " H3" dans une page qui ne possède pas de "H2". ...Quand j'ai posé la question à l'un de mes clients pourquoi il a fait ça alors que les recommandations données ont été bien comprises, il m'a dit : parce que le H3 est plus joli que le H2.
Donc, si vos clients qui ont la main sur le site, utilisent plus souvent des H3 que des H2, essayez de voir de côté du style CSS 🙂
A plus !
@ Emile
Toi tu as pris tellement de raccourcis en SEO que tu vas avoir du mal à retrouver les chemins balisés (humour = balisés... [bon d'accord elle est moyenne])
@ Miss SEO girl
- Pourquoi as tu acheté une Twingo alors que tu aurais eu besoin d'un 35 tonnes pour ta société de transport de gravas ?
- Parce que j'aimais la couleur...
🙂
Hello, déjà bravo pour la qualité didactique du post "Monsieur" 🙂
En même temps, on sait à qui on affaire...
L'observation suivante est à mon sens des plus justes.
"Le problème globalement et que beaucoup pensent « mise-en forme » quand ils utilisent le HTML au lieu de penser « sémantique »… Cette incompréhension existe depuis que le web existe."
Cette simple phrase devrait être connue de toutes les personnes qui s'intéressent à la "rédaction-web"
Encore merci, c'est toujours un plaisir de vous lire.
Bye.
Un bon petit rappel ne fait pas de mal.
Respecter tous ces conseils peut être bénéfique si on craint une pénalisation mais ça m'étonnerait quand même que ça soit si terrible que ça d'avoir sur certaines pages des trous entre h1 et h3 par exemple.
Google est très doué pour plein de choses, ça m'étonnerait qu'il pige pas la structure d'un site pour si peu
Bonjour,
tres bon article rappelant les bases de la structure d'un site qui meme si evidentes finissent souvent par echapper à la plupart d'entre nous, cependant j'observe de plus en plus de themes wordpress n'incluant plus de page "single" d'où la difficulté d'inclure un H1 par page du moment que la modif se fait à partir de la page "index" ce qui multiplie par X le nombre de H1 de celle-ci, avez vous une solution, la plus simple etant evidement de ne pas utiliser ce genre de theme 😉
La plupart des CMS insèrent les balises h par défault ce qui permet d'être optimisé même pour ceux qui sont novices en SEO.
Par contre,on voit beaucoup d'erreurs de suroptimisation. Certains devraient lire cet article et modifier leurs sites.
Quelques bons rappels toujours bon à prendre. Merci Sylvain.
@ Attila
À l'heure où le moindre pouième compte, il y aura sans doute une différence entre un site bien balisé et celui qui ne l'est pas pour toutes choses égales par ailleurs.
@ Madsyl
On y revient dans un futur article
@ Cadarache
Le problème, c'est justement que la plupart des CMS ne sont pas très bien conçus initialement sur ce plan.
Il suffit de regarder la démo de Prestashop. Les trois premières balises de titres sont des H4...
Ah tiens ? Je me sens vachement moins seul d'un coup, ca fait du bien ^^
Par contre, j'ai encore l'impression que tu es venu fouiller les brouillons de mon blog avec un article pareil 😀
@ Loiseau2nuit
J'utilise http://www.baume-referencement.com/not-provided-mots-cles-nsa/
Ça me permet aussi de siphonner les infos de ton ordi 🙂
Je ne connaissais pas cette façon de voir la hiérarchisation,des balises hn, après c'est vrai qu'après avoir lu cet article je dirai qu'à première vue tu es complètement dans le vrai. Je pense qu'effectivement la force de chaque balise permet de transmettre de la force à chaque mot-clé dans les balises en fonction de la valeur du H.
Browseo est un outil très sympa. Moi j'utilise également l'outil MOZ qui fournit des informations très précises sur chaque page.
Bonjour !
Comme dit dans la plupart des commentaires, et comme tu le reprécises dans ton billet ensuite, c'est vrai que beaucoup ont tendance à assimiler les Hn au style. Je pense que c'est à cause de raccourcis faits quand on conçoit son CSS en voulant attribuer des styles à des titres, en oubliant que ce sont des titres. C'est comme ça qu'on se retrouve à demander si on peut mettre un h3 sur "laisser un commentaire" parce que le style graphique de hiérarchisation du contenu correspond, même hors CMS, parce que c'est plus facile.
Merci aussi les thèmes WP qu'on choisit beaucoup sur l'apparence et pas beaucoup sur le fond de la conception de ce thème.
Finalement pour éviter cette erreur, il faut aussi réviser son CSS et apprendre qu'on peut faire des div et des class et que le HTML 5 et CSS3 proposent des alternatives sympas, non ?
J'ai vu certains sites reconnus utiliser la balise H1 pour le logo de leur site. Il modifient donc les propriétés CSS basiques de la balise titre et en font un simple logo parfois même en camouflant le vrai texte du H1 par un élément graphique. Exemple avec ce site de renommé internationale : -http://www.etsy.com/
Que pensez-vous de cette pratique SEO un peu limite ?
Salut,
C'est vrai que quand tu travailles sur le site d'un client dans le cadre d'une prestation SEO à budget relativement serré et que tu sais que seule la balise h1 compte dans le référencement, tu as envie d'en faire le moins possible.
Les sites e-commerce que tu mentionnent dans l'article ont effectivement bien souvent plus d'une dizaine de h2 ou h3. C'est monnaie courante. Si on veut bien faire, il faudrait intervenir sur toutes ses balises pour avoir quelque chose de pertinent.
Pour couronner le tout, chaque balise peut se trouver dans un module indépendant (meilleurs articles, articles consultés, panier, etc.). Il faut donc intervenir sur tous ces fichiers à la fois. C'est du boulot et dans un monde ou tout se paie et que ce n'est pas prévu dans le devis initial, ça passe à la trappe...
Bonjour,
Tout d'abord excellent article. Ensuite, je pense qu'il est complètement vital de hiérarchiser son contenu, que ce soit pour l'utilisateur ou pour Google. Autant au niveau de l'utilisabilité que du référencement, avoir un contenu bien organisé et mis en avant suivant son importance offre un bien meilleur résultat. Alors bien entendu, il faut savoir utiliser le bon type de titre au bon moment, mais pas seulement. La sémantique est très importante en html, quelque soit l'élément à utiliser, il faut l'utiliser de la bonne manière.
Un bon article qui pose les bases, que l'on peut oublier si vite parfois. En revanche, je constate tout de même que les balises Hn ont de moins en moins importante pour Google. D'une manière générale, la mise en forme html devient moins en moins importante, car Google arrive à déceler de mieux en mieux quel est le contenu principal d'une page. Suffit de voir la façon dont sont sélectionné les descriptions pour les pages qui n'ont pas de balise meta, c'est généralement plutôt bien choisi parmi le contenu... En revanche, la leçon importante à retenir, c'est de ne pas mettre de Hn dans un contenu répété sur toutes les pages comme un footer (à moins que l'on soit sûr que le contenu contiendra toujours le même niveau de profondeur).
Oui je pense qu'il est effectivement important d'intégrer les balises Hn dans une stratégie référencement pour optimiser le référencement d'une page web. Cette hiérarchisation permet surtout de communiquer des informations importantes à Google sur le contenu d'une page. La sémantique est très importante dans le domaine du web. Chaque élément doit être utiliser de la bonne manière.
Mon site a 2 H1 pour l'instant cela ne semble pas trop le pénaliser sur Google au contraire je gagne en classement .Par contre ,je comprend toujours pas pourquoi bing refuse de référencer mon site web .Sur bing webmaster il apparait en erreur comme 2 H1 .Si quelqu'un si connait sur bing webmaster tools conseil bienvenu !
Bon rappel sur la nécessité de structurer qui mériterait bien de vraies batteries de tests pour démêler la légende numérique de l'optimisation effective.
Au passage, ce qui est drôle c'est que tout le monde dit "oui oui c'est ça qu'il faut faire" et quand on regarde un peu comment sont construits les blogs et site de chacun, euh...
La structuration me semble possible sur des blogs ou autre site au contenu textuel fort, maintenant sur des e-commerces, à part de jouer sur h1 / h2 (voire h3) il me semble d'aller plus profond. D'ailleurs je me demande honnêtement sur une même page, à part sur un dossier particulièrement long, qui peut produire quelque chose de lisible et digeste en utilisant jusqu'à du h6... après on s'y perd à mon avis.
@ Sylvain (jolie prénom 🙂 )
Il n'est pas nécessaire d'en mettre des tartines si on n'en à pas besoin (déjà jusqu'au H3 c'est énorme).
En revanche, il conviendra de bien respecter la hiérachisation.
Effectivement, la structuration de la page compte plus que tout, mais plus pour ne rien mettre dedans. Il faut également construire sa page en ayant conscience que la qualité "champ lexical" qui est désormais tout aussi importante, c'est à dire que si vous parlez de SEO, des mots associés comme "SEA", "Matt Cutts" "Google" "Bing" permettront de crédibiliser la qualité de votre contenu. Sur ce point, on sait d'ailleurs que Google passe les plus gros budgets d'ingénierie Algo, sur l'algorithme sémantique qui à l'avenir coupera court à toute les spéculations puisqu'il faudra tout simplement bien écrire
Il y a vraiment trop de commentaire sur ce site 🙂 Et je suis à moitié sérieuse . Mias je racconte ma petite histoire avant : je viens d'un site du gouvernement bercy etc etc .. cela fait deux fois que je vois le bourrin.com et je n'ai pas résisté .. donc j 'ai pu voir son "ane " puis je clique à nouveau un article de 280 commentaire c'est énorme .. puis je tombe sur un titre les H1 H2 etc et là ca m'interesse . Je lis ..puis je lis .. je relis . Pas mal de puristes sur ce sites me dis-je .. Qui parle de sémantique . Diable ! Si on en était a parler véritablement de sémantique on en serait à la version W66778889999C et Google en serait à son IA Pinguins !
Bref tout ça pour dire que deux H1 qui cohabite passe la validation .. correct ou pas .... maintenant de là a savoir si ca marche ou pas . Plus je lis et plus cela devient compliqué .. cela dit c'est agréable de voir des puristes sur la toile surtout dans ce type de domaine .
Mais pour être tout a fait sincère, parce que je suis un peu fatiguée il faut dire, vous pensez vraiment que le débutant ou petit commerçant qui cherche a se renseigner va s'arréter sur un H- alors que son concurrent à graisser la patte à l'administrateur du .org de carla pour qu'il lui assure un link a PR 778 ?
Bel article. J'approuve le fait qu'utiliser des titres de second niveau revient à faire d'une pierre deux coups : structurer l'article et marquer des points en référencement.
Par contre, j'ai le sentiment (mais accepte d'être contredit) qu'au-delà du h3, les niveaux de lecture se démultiplient exagérément. Je doute fort de l'impact du h5 sur le référencement. Et sur le plan de l'ergonomie, je déconseillerais vivement de proposer plus de 3 niveaux de lecture au coeur d'une même page.
Encore merci pour l'article.
Suis tombé sur un cas de figure particulier ...
Que penser Sylvain en home d'une navigation pour un e commerce faites de H2 utilisés pour les intitulés de catégorie de niveau 1 ( H3 pour niveau 2 ) donc comme liens de nav eux même dans des li et un ul ? ...
Comment cela va t il être interprété par Google ...
1 H1 + une vingtaine de H2 ( ceux de la nav + ceux sur les intitulés des produits des vignettes produits en home ) + une dizaine de H3 et très peu de contenu en
Google interprète cela comme de la sur-optimisation ou plutôt n'arrive rien à interpreter par ce que gros cafouillage sémantique html ?
Merci pour cette bonne synthèse.
Finalement, c'est vrai que les balises Hn, c'est un peu la base et cela peut sembler le plus simple à comprendre vu que cela hérite du paradigme de la table des matières, mais dans les faits on trouve souvent des incohérences, une hiérarchisation impropre, etc.
Bonjour,
Votre article m'a beaucoup apporté.
Cependant, suite à une analyse du site Yakaferci je constate un problème de hiérarchisation de balise sur ma page d'accueil et je n'arrive pas à le résoudre.
Apparemment c'est ma colonne de gauche qui semble poser souci.
mon site : -http://www.abdm.fr
Si vous pensez pouvoir me conseiller, je vous en serait très reconnaissant.
Merci par avance.
Klima
Merci mille fois pour ce superbe article, cela faisait longtemps que j'en recherchais un comme celui-là. Pour un apprenti Seo, c'est du pain bénit !
Pour en revenir sur le sujet du E-commerce, qu'en est-t-il de l'impact des H3 ou H4 sur la mosaïque de fiches produits dans les catégories ? Ou s'il est préférable de concentrer ses efforts sur le contenu lui-même? Car mettre des balises sur des liens, il me semblait que ça n'était pas trop recommandé, ou peut-être pas de balises du tout ?!... Google doit surement savoir différencier un e-commerce d'un blog...
@ Laurent
Moi je m'occuperai plus du contenu que des balises h3 ou h4. Ces dernières n'ont sans doute pas grande importance en terme d'insertion de mots-clés. Au passage, à lire : https://blog.axe-net.fr/e-commerce-convaincre-contenu/
Après, avoir des liens sur des titres n'est pas mauvais, pourquoi le serait-ce ?
Tous les blogs ou sites d'actualité ont des liens sur des titres.
Hello Sylvain, que conseilles-tu au niveau du balisage des Sidebars ?
@ Nicolas
Dans ce cas, je me pose toujours la question, à quoi sert ce balisage dans la sidebar ?
Si le but est juste de mettre en forme un texte, je conseillerai plutôt d'utiliser les CSS sans forcément y mettre de balises Hn. Un bon exemple avec ce blog ou les mots "Catégories" ou "Articles récents" ne sont pas balisés avec des Hn, mais tout de même mis en forme.
Maintenant, il peut y avoir de bonnes raisons d'en mettre si les mots utilisés sont utiles dans la thématique du site.
Très clair! Merci pour ce complément d'informations
Bonjour, j'ai un site dans lequel le nom du site dans le header a été mis en H1 et le sous-titre en H2 (toujours en en-tête)
Sur les pages et articles revient le H1 en titre de la page et de l'article.
Comment faire pour changer pour que les pages et articles ne reviennent pas en H1 ? (changement feuille de style sur un thème parent ? directement en H2 ?)
Merci pour vos réponses
(et pourquoi un constructeur de template fait-il cela ? puisque c'est négatif !
@ Capsule
Un développeur (pas trop mauvais) pourra t'aider à modifier ton site.
Sur des pages d'article, ce n'est pas gravisime si le title et le H1 sont identique.
Et sinon, la plupart des concepteurs de template sont de gros flemmards et utilisent le balisage HN pour les aspects graphiques (CSS) et ne connaissent rien au SEO..
Bonjour,
Très instructif cet article.
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 pour mettre l'accent dessus ? Exemple H1 : les bijoux celtiques / H2 : le triskel un bijou celtique particulier..
Merci d'avance pour les éclairages
Bonjour,
je me demande, faut-il une taille différente par Hn? Où peut-on tout mettre à la taille 16px, par exemple ?
Merci
@ Er.v
Esthétiquement, on fait ce qu'on veux.
Mais vu que l'on est dans une logique de hiérarchie il ne parait pas très logique d'avoir la même présentation pour tous ces titres et sous titres...
Bonjour,
Je viens de créer nouvellement mon site web pour mon entreprise, toutefois je me retrouve très mal référencé sur google, ce qui est normal je pense.
Je débute mon travail SEO notamment par les balises hn, je les ai vérifié sur un outil en ligne qui m'as repéré quelques erreurs. Lorsque je souhaite effectuer un changement de balise sur mon texte toute la page se sélectionne (édition de texte sur WordPress). Je n'arrive donc pas à changer la structure de mes balises. Toute aide serait la bienvenue, merci camarades.
@ Jean
J'aurais plutôt commencé par travailler les balises Title. Pour ton problème sous WordPress, à moins d'une mauvaise manip de ta part qui expliquerai ce bug, je ne vois pas trop comment t'aider. Il faut juste que le titre Hn concerné ne soit pas collé au texte adjacent et tu dois pouvoir le sélectionner seul.