Depuis la modification de la fonction de recherche d’images dans Google, de nombreux webmasters et professionnels du référencement s’intéresse de près au trafic généré par Google Image. En effet, la modification apportée au moteur de recherche oblige désormais les internautes à se rendre directement sur le site hébergeur pour avoir accès à une image dans sa dimension native. Il s’agit donc d’une nouvelle source de trafic très intéressante pour tous les secteurs dans lesquels l’impact visuel des produits est important. Cependant, la course à la vitesse, encore accélérée par le déploiement du Mobile First au début de l’été, est difficilement compatible avec des pages riches en images de bonne qualité. Il existe cependant une façon intelligente de résoudre le problème.
Le lazy loading au secours de vos temps de chargement
Le lazy loading (ou délayage) est une technique qui existe depuis longtemps pour favoriser l’expérience de l’utilisateur sur des pages riches en éléments à charger. Elle consiste à retarder le chargement des éléments qui ne sont pas au-dessus de la ligne de flottaison (donc pas directement visible par l’internaute). Ainsi, la navigation est facilitée sur des pages longues, la reste de la page se chargeant pendant que l’internaute consulte la première partie. Une façon intelligente de travailler les critères de référencement pertinents.
Il existe différentes façons de mettre en place du lazy loading, mais il est à noter que suite au développement de ce besoin, beaucoup de CMS proposent des solutions simples de mise en place, notamment via des modules ou plugins qui simplifient le travail du webmestre. Cependant, même sur WordPress, il est nécessaire de passer du temps sur la configuration de cette technologie, pour éviter un écueil important : en retardant le chargement de certains éléments de la page, il est possible que ceux cis ne soient pas détectés par le Google Bot. Ce qui impliquerait que lesdits éléments ne seront pas indexés.
Les conseils de Google pour utiliser du Lazy load en assurant l’indexation
John Mueller est revenu sur la bonne façon de mettre en place l’utilisation du « chargement paresseux » et préconise un process simple pour s’assurer que le contenu image reste bien visible par le Google Bot :
- Pour commencer, il est nécessaire d’utiliser l’outil de Google de test de compatibilité mobile, pour visualiser le code de la page tel qu’il est perçu par le Google Bot.
- Il vous suffit ensuite de copier-coller le code affiché dans un éditeur de texte, et de chercher le nombre d’occurrence de balises images détectées : <img>. Vous pouvez ensuite comparer le résultat avec votre page réelle, et détecter si certaines images ne sont pas visibles pour le Google Bot.
Enfin, la solution la plus efficace pour favoriser la détection des éléments images qui ne sont pas perçus par le Google Bot est d’ajouter la balise <noscript> aux images, qui permet notamment aux internautes ne bénéficiant pas de javascript de pouvoir accéder facilement aux images.
Ce qui donnera donc :
<noscript>
<img src=’’image1.jpg’’>
</noscript>
Dans le doute, d’après les conseils de John Mueller, il ne faut pas hésiter à ajouter la balise sur l’ensemble des images du site, ce qui ne peut en aucun cas pénaliser votre SEO. Vous pouvez ensuite relancer le test décrit plus haut et vous assurer que l’ensemble de vos images est bien crawlable par le google bot.