C’est la croix que portent tous les consultants SEO : quand on audite des sites, on voit parfois des horreurs dans le code HTML. Certaines ne sont que des pécadilles sans grande conséquence pour le SEO (mais vont fâcher tout rouge les puristes des normes W3C).
D’autres ont parfois des conséquences graves.
C’est le cas notamment de la présence de balises <iframe> et <img> dans la zone <head> de votre code html.
Si ces deux balises sont rencontrées au milieu du code HTML dans la zone <head>, Google va s’arrêter de lire le contenu de la section <head>, pensant que la suite appartient au body.
Résultat : toutes les balises meta, link rel, <script>, <style> situées après cette erreur seront superbement ignorées.
Bon, vous me direz que ces deux balises n’ont bien sûr rien à faire entre <head> et </head>, on s’attend à les voir dans la section <body> de votre code.
Donc ce genre d’erreur doit être rare.
Sauf que non, pas du tout, c’est assez fréquent.
Quand votre code à ce problème, mais vous ne le voyez pas
Si le problème est aussi fréquent, c’est que l’on a souvent un bout de code javascript dans la zone head qui correspond à un « tag manager ».
Et dans le tag manager peut figurer un autre bout de javascript qui appelle :
- un beacon sous forme d’image (aïe : une balise <img>)
- et/ou une iframe pour appeler un contenu
Même des produits de Google passent par des iframes dans ce genre de contexte et génèrent ce type d’erreurs.
Comme on ne voit le problème que dans la rendition complète de la page, après exécution du Javascript, un rapide examen du code source de la page côté serveur ne permet pas de détecter le problème.
Comment détecter ce problème
Si vous voulez être tranquille, il suffit de crawler chaque template de votre site avec Screaming Frog ou un outil équivalent, en mode rendition javascript, en stockant le html. Et de chercher la présence des balises intempestives dans le head.
En général, la recherche de ce genre d’anomalie ne se fait que quand on détecte un comportement anormal sur la page. Dans ce cas, la recherche ne se fait que sur un seul template.
Comment traiter ce problème
Si ces balises apparaissent en dur dans le code source de la page HTML, il faut évidemment modifier ce code.
Si ces <iframe> et <img> sont générés en JS, le problème est un peu plus délicat à régler.
La solution consiste à placer le code qui charge ces balises à la toute fin de la zone head. Juste avant la balise </head>.
Le problème de « parsing » demeurera pour Googlebot, mais au moins il ne zappera plus de balises après celle ci, puisqu’il n’y en a plus.
Pour référence, ce problème est évoqué dans une page support de Google sur les metadata :
https://developers.google.com/search/docs/crawling-indexing/valid-page-metadata
Et un problème similaire survient avec les erreurs javascript, nous l’avions abordé dans cet article :