6 faits à connaître sur le SEO et Javascript

Connaître les bases du JavaScript est devenu une compétence vitale pour les spécialistes du référencement naturel, bien que jusqu’à récemment, la relation entre ces deux disciplines a été un sujet très controversé.

La question cruciale qui plane entre le SEO et JavaScript est de savoir si les robots des moteurs de recherche peuvent percevoir correctement le contenu d’un site Web et évaluer de façon réaliste l’expérience de l’utilisateur.

Alors que le HTML, qui fonctionne avec PHP, CSS, etc., peut être lu directement par un crawler, un site Web basé sur JavaScript n’est pas accessible d’emblé. Les crawlers de Google analysent d’abord le DOM, et ce n’est qu’ensuite qu’ils parcourent le site Web.

Définitions générales

Avant de nous pencher sur les meilleures pratiques d’optimisation de JavaScript, jetons un coup d’œil rapide à la terminologie de base :

JavaScript est un langage de programmation utilisé pour rendre les pages Web dynamiques et interactives. Vous pouvez placer JavaScript dans un document HTML, ou faire un lien ou une référence à celui-ci.

HTML signifie Hypertext Markup Language (langage de balisage hypertexte). En termes simples, il s’agit d’un organisateur de contenu : HTML fournit la structure d’un site Web (listes, titres, sous-titres, paragraphes, etc.) et définit le contenu statique.

AJAX est Asynchronous JavaScript and XML. Fondamentalement, il met à jour le contenu sans rafraîchir toute la page. AJAX permet aux applications web et aux serveurs de communiquer sans intrusion sur la page en cours.

Cependant, vous devez noter qu’à partir du deuxième trimestre 2018, Google n’aura plus besoin d’AJAX pour parcourir des sites Web basés sur JavaScript.

Un spécialiste du référencement naturel devrait également avoir une compréhension de base de DOM (Document Object Model). Vous pouvez considérer DOM comme un outil utilisé par Google pour explorer et analyser les pages Web.

Tout d’abord, Google reçoit un document HTML et identifie ses éléments JavaScript. Ensuite, le navigateur lance DOM, ce qui permet au moteur de recherche de rendre la page.

1. Laissez les moteurs de recherche voir votre JavaScript

Le fichier Robots.txt est configuré pour fournir aux moteurs de recherche de Google des possibilités d’exploration appropriées. Si vous les empêchez de voir JavaScript, la page apparaîtra différemment pour les robots d’exploration que pour les utilisateurs.

Cela signifie que les moteurs de recherche n’obtiendront pas la pleine expérience de l’utilisateur, et Google peut interpréter ces actions comme une dissimulation.

La meilleure approche est de fournir aux crawlers toutes les ressources dont ils ont besoin pour voir les pages web de la même manière que les utilisateurs.

2. Liens internes

Le lien interne est un puissant outil de référencement utilisé pour montrer aux moteurs de recherche l’architecture de votre site Web et pointer vers les pages Web les plus importantes.

Le conseil le plus essentiel ici : utilisez les liens internes, et n’essayez même pas de les remplacer par des events JavaScript lors des clics.

Oui, les URL de fin sont susceptibles d’être trouvées et parcourues avec des events on-click, mais les web crawlers ne les associent pas à la navigation globale de votre site.

Par conséquent, il serait préférable d’implémenter des liens internes en utilisant des balises d’ancrage régulières dans le HTML ou le DOM, afin de fournir aux utilisateurs une meilleure expérience.

3. Structure de l’URL

Les sites basés sur du JavaScript utilisés pour inclure des identificateurs de fragments dans les URLs, mais les hashes (#) et hashbangs (# !) ne sont pas recommandés par Google.

Une méthode fortement recommandée est l’API d’historique pushState. Il met à jour l’URL dans la barre d’adresse et permet aux sites en JavaScript de tirer parti des URL propres.

Une URL propre est également appelée URL SEO-friendly, qui consiste en un texte simple, facilement compréhensible par les utilisateurs non experts.

Envisagez d’utiliser pushState() pour un scroll infini, de sorte que l’URL se mette à jour chaque fois que l’utilisateur accède à une nouvelle partie de la page. Dans un scénario parfait, l’utilisateur peut rafraîchir la page et rester exactement au même endroit.

Aussi, explorer les meilleures pratiques SEO URL et commencer à les utiliser pour améliorer l’expérience utilisateur.

4. Testez votre site Web

Google est capable d’explorer et de comprendre de nombreuses formes de JavaScript, bien que certaines d’entre elles puissent être plus difficiles que d’autres.

Cependant, il est toujours préférable de prédire les erreurs et les problèmes possibles et de les éviter, alors pourquoi ne pas faire des tests ?

Suivez ces deux étapes de base pour détecter d’éventuelles ruptures :

• Vérifiez si le contenu de vos pages Web apparaît dans le DOM.
• Testez quelques pages pour vous assurer que Google est capable d’indexer votre contenu.

Il est crucial de savoir si Google est capable de voir votre contenu et votre JavaScript dans le robots.txt et de l’analyser correctement. Par conséquent, envisagez de vérifier manuellement les éléments de votre contenu et de les récupérer avec Google pour voir si le contenu apparaît.

Vous pouvez tester votre site simplement en utilisant la Google Search Console et la fonction “explorer comme Google”.

Vous pouvez également utiliser certains crawlers qui prennent en compte le javascript comme OnCrawl.

5. Snapshots HTML

Google a introduit les snapshots HTML en 2009 et les a désapprouvés en 2015. C’est une longue histoire et un sujet d’actualité.

Voyons d’abord qu’est-ce qu’un snapshot HTML ?
Le snapshot contient le contenu d’une page après qu’elle a été complètement analysée, interprétée et rendue. Le rôle du snapshot HTML est d’être interprétable sans avoir besoin d’exécuter du code JavaScript.

Ce qu’il faut savoir, c’est que Google supporte toujours les snapshots HTML, bien qu’il ait déterminé qu’il s’agit d’éléments à éviter.

Les snapshots HTML peuvent être nécessaires pour certaines situations, donc vous devriez au moins les connaître.

Par exemple, si les moteurs de recherche ne peuvent pas récupérer le JavaScript sur votre site Web, vous pouvez leur fournir un snapshot HTML, ce qui est mieux que de ne pas avoir votre contenu indexé du tout.

Dans un monde parfait, un site Web utiliserait une sorte de détection de l’agent utilisateur du côté serveur et montrerait le snapshot HTML aux robots et aux utilisateurs.

Notez que Google s’efforce de voir exactement la même expérience qu’un internaute. Par conséquent, il est préférable de retourner les snapshots HTML aux robots des moteurs de recherche.

6. Latence du site

Lorsqu’un navigateur crée le DOM à partir d’un document HTML reçu, il charge la majorité des ressources exactement comme elles sont mentionnées dans le document HTML.

Si un fichier massif existe en haut d’un document HTML, un navigateur chargera d’abord ce fichier énorme, et toutes les autres informations n’apparaîtront qu’après, avec un délai significatif.

L’idée clé du “critical rendering path” de Google est de charger d’abord des informations cruciales pour les utilisateurs. En d’autres termes, placer le contenu le plus essentiel pour les utilisateurs au-dessus de la zone de flottaison.

Si vos fichiers JavaScript ou certaines ressources inutiles bloquent la vitesse de chargement des pages, vous avez probablement un JavaScript bloquant le rendu, également appelé latence perçue.

Cela signifie que vos pages ont le potentiel d’apparaître plus rapidement, mais le code JavaScript les ralentit.

Vérifiez combien de temps il faut pour charger une page avec Page Speed Insights ou d’autres outils similaires. Analysez les résultats pour voir s’il y a un JavaScript bloquant le rendu.

Voici 2 solutions pour résoudre ce problème :

• Ajoutez l’attribut ‘async’ dans votre HTML pour rendre votre JavaScript asynchrone.
• Réduire les éléments JavaScript dans le document HTML.

Lorsque vous essayez d’améliorer la situation, gardez à l’esprit les règles de base de JavaScript.

Par exemple, les scripts doivent être classés dans un certain ordre. Si certains scripts référencent des fichiers, ils ne peuvent être utilisés qu’après le chargement des fichiers référencés.

Vous devriez constamment rester en contact avec votre équipe informatique pour vous assurer que toute modification n’interrompt pas l’expérience utilisateur.

Conclusion

Les moteurs de recherche sont en constante évolution, donc ils interpréteront sans doute mieux et plus rapidement votre JavaScript à l’avenir.

Pour l’instant, assurez-vous que votre contenu existant peut être parcouru et obtenu, avec une latence de site appropriée.

[Read More ...]