SEO et JavaScript : pas si incompatibles que ça !

Le 26 octobre 2020

29 minutes

Partager sur :

Pour cette nouvelle saison du Wamcast, notre podcast SEO, les équipes de WAM-Référencement ont le plaisir d’accueillir Guillaume André, CTO de Wex IT. Au menu de ce 13e numéro : un point complet sur les liens entre le JavaScript et le SEO.

Qu’est-ce que le JavaScript ?

Pour bien lancer ce Wamcast, le podcast SEO, Mathieu Doubey, manager du Pôle SEO et data de WAM, fait le point sur le JavaScript. Alors, qu’est-ce que c’est, concrètement ?

Pour faire simple, le Javascript (ou JS) est un langage de programmation. Historiquement, il était surtout utilisé pour animer les pages web et réaliser des choses plus complexes que ce que permettaient de faire le HTML et le CSS. En gros, on trouvait une page en HTML, du CSS pour faire le design et du JS pour animer le tout.

Toutefois, le web a bien évolué et, petit à petit, le JS s’est retrouvé de plus en plus présent sur les sites internet. Cette technologie a pris en importance quand des frameworks spécialisés sont apparus ces dernières années. Pour tout comprendre sur le JavaScript, ce que sont les frameworks et leurs soucis vis-à-vis du SEO, retrouvez l’éclairage de Mathieu Doubey et Guillaume André dès le début de ce podcast.

JavaScript : comment Google traite ces informations ?

Deuxième point abordé dans ce nouveau Wamcast : le traitement du JavaScript par Google. Brice Narjoux, chef de projet SEO et responsable du pôle R&D chez WAM-Référencement, nous explique qu’auparavant, il n’était pas nécessaire d’auditer le JS : Google ne voyait pas les informations générées en JavaScript. En effet, ce sont des opérations très coûteuses en ressources processeur ou mémoire, qui impactent directement les coûts monétaires. Mais aujourd’hui, la donne est différente. Et Google procède désormais en trois étapes.

  1. Dans un premier temps, Google constitue une liste d’URLs à parcourir.
  2. Dans un deuxième temps, les algorithmes de Google traitent ces URLs une à une. Un premier passage est fait afin de découvrir le contenu principal de la page et la structure des liens qui nous intéressent tant en SEO. Une version « brute » est envoyée aux algorithmes d’indexation pour que la page apparaisse dans les résultats de recherche. Pendant ce temps, cette même URL est mise en liste d’attente dans ce qu’on appelle la phase de « Rendering ».
  3. Enfin, lors de la fameuse phase de rendu, arrivant en « deuxième vague », Google analyse la page en tenant compte des ressources JS et CSS, en utilisant plus ou moins la dernière version de Chrome. De cette manière, l’index peut être mis à jour avec la version de page que tout le monde visualise.

Retrouvez à partir de la 8e minute du Wamcast, toutes les explications et l’expertise de Brice Narjoux et Guillaume André.

[extra_push_quote content= »« Le Rendering, c’est le processus qui consiste à exécuter le JavaScript pour remplir un template HTML avec de la donnée reçue depuis une API ou une base de données. » » author_name= »Guillaume André, CTO de WexIT » /]

Comment savoir si le contenu est bien vu par les robots ?

Si Google a progressé dans sa manière d’indexer les pages, on peut se demander comment être certain que le contenu soit bien vu par les robots. Dès 10min40 du Wamcast,  Guillaume André, CTO chez Wex IT, apporte son analyse.

Pour lui, il existe différentes manières de faire. La plus simple, pour le SEO, reste que la version HTML finale de la page soit générée côté serveur. C’est ce que l’on appelle le Server-Side Rendering, ou SSR. Les navigateurs web récupèrent également la page déjà construite, tout comme Google. On est donc face à une problématique SEO classique où il faut donner quelque chose de concret à « manger » au Googlebot, tout en évitant les inconvénients qui sont plutôt du côté de la gestion des temps de chargement.

Il existe également le rendu côté client : le Client Side Rendering, ou CSR. Cette fois, c’est le navigateur web qui récupère tout le travail de construction de la page. Il va télécharger le HTML sur le serveur, le CSS pour la mise en page, le JS pour la personnalisation et va rassembler tous ces éléments. Les bénéfices en matière d’expérience utilisateur sont notables. Et c’est pour cela qu’on a vu la naissance des frameworks comme Angular ou React.

Les frameworks les plus connus ont ainsi intégré des solutions de Rendering complémentaires pour répondre aux exigences du SEO. Il ne faut donc pas oublier de les activer si nécessaire !

À noter : on peut tout à fait coupler le CSR et le SSR ensemble en faisant du cloacking sur la base d’un user-agent. Concrètement, on donne du HTML/CSS/JS aux internautes (CSR) et on enverra uniquement le HTML/CSS généré côté serveur à Google : c’est ce qu’on appelle le Dynamic Rendering.

Retrouvez dans le Wamcast un point complet sur le JavaScript et le SEO et découvrez en intégralité et en détail les explications de Guillaume André sur la mise en place des solutions évoquées ci-dessus.

Nos derniers Wamcasts

Voir tous les podcasts