Si plusieurs éléments h1 sont une mauvaise pratique, comment se fait-il qu'Optimizely ait plus d'un h1?
La bannière de la page de destination d'Optimizley comporte 2 h1 éléments :
<div class="header-container tooltip-container"> <h1 class="mkt-hero__header optly-header-one">Hello!</h1> <h1 class="mkt-hero__header">Let's optimize digital experiences for your customers.</h1> <span class="tooltip"><!-- […] --></span> </div>
Si je voyais cela dans un autre site, je le rejetterais comme une mauvaise pratique. Mais Optimizely est un YC ancien élève qui a écrit le livre sur l'optimisation des performances du site.
Est-ce que quelqu'un sait pourquoi ils ont choisi d'utiliser deux h1 éléments?
Tu as raison. Deux éléments h1 dans la même section n’est pas une bonne idée, sémantiquement ou structurellement, mais ce n’est pas une erreur HTML. C'est probablement une erreur de copier/coller de leur part, mais qui sait pourquoi certaines personnes font ce qu'elles font.
Ne regardez pas toujours une entreprise et pensez qu'elle écrit du code parfaitement, de toutes les façons, à tout moment, peu importe qui elle est.
Ce n'est pas une mauvaise pratique en principe, mais l'implémentation dans votre exemple est .
L'utilisation de plusieurs éléments <h1> sur une page constitue un code HTML parfaitement valide et ne pose pas de problème de référencement s'il est utilisé correctement (en bref, en tant qu'en-tête de sections discrètes de contenu).
Ancien ingénieur de Google Matt Cutts le confirme dans une vidéo de questions-réponses . Notez qu'il a déclaré que la surutilisation de <h1>s avait déjà été utilisée de manière abusive et que leurs algorithmes "tentaient de prendre cela en compte".
Le premier <H1>Hello!</H1> est en réalité un espace réservé pour le ciblage géographique. Il ajoute le nom de votre société (d'après les informations IP) à ce bonjour et si vous le visitez la nuit, il modifie le texte en Still Awake? (même si le code du backend reste 'bonjour') suivi de leur deuxième H1.
Par exemple, sur mon PC local, lorsque j'ouvre le site Web, il indique Hello, (ISP Name), mais lorsque je l'ouvre à partir d'un VPS situé en France (où il est passé minuit), il indique Still Awake? suivi de leur code codé. H1.
Même s'ils auraient pu inclure tout cela dans un seul H1, je ne vois pas d'inconvénient à ce qu'ils soient configurés, car ils utilisent les H1 pour améliorer l'UX et ne fourrent pas de mots-clés dans le jeu Google.
Google traite certains éléments HTML différemment des autres. Nous savons que la balise de titre, la méta-balise de description, la méta-balise de mots-clés (dépréciée) et la balise h1 ont une influence unique sur le poids accordé à ces éléments et aux influences particulières qu’ils exercent. En cela, Google prendra toujours le premier trouvé et ignorera le reste. C'est plus un comportement historique que pas.
Cela signifie que bien que ce ne soit pas une bonne idée d'avoir plus d'une étiquette h1, c'est aussi une perte de temps.
Quoi qu'il en soit, qui sait pourquoi ils utilisent plus d'une balise h1, d'autant que la première de votre exemple est si inutile? Il est probable que la première balise h1 existe pour une autre raison, et non pour le référencement. C'est probablement une erreur. Sinon, cela n'a pas de sens.