Martin Splitt de Google a dû rappeler aux référenceurs et aux propriétaires de sites que Googlebot ne fait pas défiler les pages.

Lorsque le défilement infini est implémenté sur une page Web, cela peut entraîner des problèmes avec la façon dont le contenu est indexé dans la recherche Google.

Dans un problème résolu par Splitt lors d’une conférence virtuelle, le contenu d’un site Web manquait dans l’index de recherche Google en raison du défilement infini.

Voici plus sur le problème, pourquoi le défilement infini empêche l’indexation du contenu et ce que Google recommande de faire à la place.

Martin Splitt de Google débogue les problèmes de référencement JavaScript lors d’une conférence virtuelle

Splitt était l’un des nombreux conférenciers invités lors d’une conférence virtuelle sur le référencement technique intitulée «Mieux ensemble», tenue le 14 avril.

Être un événement virtuel a permis à Splitt de partager son propre écran et de montrer aux gens en temps réel comment il débogue les problèmes de référencement.

Chaque problème qu’il a examiné était basé sur un cas réel qu’il avait débogué dans le passé.

L’un de ces problèmes concernait le contenu manquant dans l’index de Google.

Splitt a guidé les gens à travers une série de tests qui lui ont finalement permis de découvrir que le site Web utilise un défilement infini.

Splitt découvre qu’un site Web implémente un défilement infini

Voici pourquoi c’est un problème en matière d’indexation.

Pourquoi Infinite Scroll est un problème

Splitt a fourni l’exemple d’un site Web d’actualités qui s’appuie sur un défilement infini (également appelé «chargement paresseux) pour charger du nouveau contenu.

Cela signifie que la page Web, dans ce cas la page d’accueil, ne charge pas de contenu supplémentaire jusqu’à ce qu’un visiteur défile vers le bas de l’écran.

Splitt explique pourquoi c’est un problème: « Qu’est-ce que Googlebot ne fait pas? Il ne défile pas. « 

Ce que fait Googlebot, c’est atterrir sur une page et explorer ce qui est immédiatement visible.

Selon ce qui est déclaré par Splitt, Googlebot ne peut pas analyser le contenu qui se charge uniquement après le défilement d’une page.

Il convient de noter que cette déclaration est nettement différente de celle fournie par Splitt le mois dernier, où il n’a pas précisé de manière définitive si Googlebot pouvait voir du contenu supplémentaire.

Voir: Martin Splitt de Google sur les pages d’indexation avec défilement infini

Le fait que Googlebot ne soit pas en mesure de faire défiler la liste pourrait entraîner la disparition de nombreux contenus dans l’index de recherche de Google.

C’est ce que les propriétaires de sites devraient envisager de faire à la place.

Alternatives à Infinite Scroll

Splitt dit que les propriétaires de sites devraient changer leur implémentation pour ne pas se fier uniquement au défilement.

Il mentionne que le chargement paresseux natif des images est correct, et l’utilisation de l’API IntersectionObserver est également acceptable.

Si vous devez absolument travailler avec un chargement paresseux pour le contenu clé d’une page Web, assurez-vous que votre bibliothèque JavaScript prend en charge le chargement des données lorsqu’elle entre dans la fenêtre.

Vous pouvez également utiliser le chargement paginé en plus du défilement infini.

La documentation officielle de Google sur la correction du contenu paresseux recommande de prendre en charge le chargement paginé pour le défilement infini:

«Si vous implémentez une expérience de défilement infini, assurez-vous de prendre en charge le chargement paginé.

Le chargement paginé est important pour les utilisateurs car il leur permet de partager et de se réengager avec votre contenu.

Il permet également à Google d’afficher un lien vers un point spécifique du contenu, plutôt que le haut d’une page de défilement infinie. « 

Pour vous assurer que votre site Web prend entièrement en charge le chargement paginé, vous devez être en mesure de fournir un lien unique vers chaque section que les utilisateurs peuvent partager et charger directement.

Testez votre implémentation

Quelle que soit la méthode que vous choisissez, Splitt souligne combien il est crucial de tester votre implémentation.

Splitt conclut sa présentation.

Le problème que Splitt a débogué aurait pu être découvert par le propriétaire du site lui-même s’il avait testé son implémentation du défilement infini.

Splitt a en fait utilisé le riche test de résultats de Google pour découvrir le problème lui-même.

Le test de résultats riches vous permet de voir exactement ce que Googlebot est capable d’explorer lorsqu’il atterrit sur une URL.

Splitt utilise le test de résultats riches pour examiner l’implémentation du chargement paresseux.

Dans le cas du site Web d’actualités auquel Splitt parlait, Googlebot n’a pu voir dix articles sur la page d’accueil que lorsqu’il y en avait beaucoup plus.

C’est une façon de tester votre implémentation du chargement paresseux.

Une autre façon, incluse dans le document d’aide officiel de Google, consiste à utiliser le script Puppeteer:

Voici quelques ressources supplémentaires:

Voir la présentation complète de Martin Splitt dans la vidéo ci-dessous:

À partir de la marque 31:34:

«Nous voyons qu’il y a un window.onoverscroll. Qu’est-ce que window.onoverscroll?

Window.onoverscroll est une fonction qui nous permet d’appeler ce code et d’exécuter ce JavaScript lorsque la page est défilé

Qu’est-ce que Googlebot ne fait pas? Il ne défile pas.

C’est pourquoi cela n’est en fait pas appelé lorsque Googlebot est impliqué, car nous ne faisons défiler rien sur la page.

Donc, la chose simple ici est qu’ils doivent corriger et réellement changer leur implémentation pour ne pas simplement utiliser le défilement.

Ils peuvent utiliser des choses comme le chargement paresseux natif des images.

Ou, s’ils veulent l’utiliser pour faire un défilement infini, certaines bibliothèques le font mieux et d’autres bibliothèques utilisent plutôt IntersectionObserver.

Ces deux façons sont précieuses.

La leçon la plus importante à apprendre ici est de tester votre implémentations.

Si vous implémentez quelque chose – ils auraient pu faire la même chose étant donné qu’ils comprennent ce qu’ils regardent et auraient pu voir que ce qu’ils manquent c’est ce qu’ils font défiler et dans notre documentation nous disons que nous ne faisons pas défiler ils auraient donc besoin de changer leur code. «