Le référencement JavaScript fait partie du référencement technique qui vise à faciliter l’exploration, le rendu et l’indexation des sites Web créés avec JavaScript pour les moteurs de recherche. Les tâches courantes incluent les suivantes :
- Optimisation du contenu injecté via JavaScript
- Implémenter correctement le chargement paresseux
- Suivre les bonnes pratiques en matière de liens internes
- Prévention, détection et résolution des problèmes JavaScript
Comment Google explore-t-il et indexe-t-il JavaScript ?
Google traite JS en trois phases :
- Rampant
- Le rendu
- Indexage
lire et exécuter JS pour des billions de pages sur près de 2 milliards de sites Web. Ainsi, Google diffère le rendu de JavaScript. Il met en file d’attente tout ce qui n’est pas exécuté pour le traiter plus tard à mesure que les ressources deviennent disponibles. Une fois que les ressources le permettent, un Chromium sans tête (navigateur Chrome sans interface utilisateur) rend la page et exécute le JavaScript. Googlebot traite à nouveau le HTML rendu pour les liens. Et met en file d’attente les URL qu’il trouve pour l’exploration. Dans la dernière étape, Google utilise le HTML rendu pour indexer la page.
Rendu côté serveur vs rendu côté client vs rendu dynamique
Les problèmes d’indexation Google JavaScript reposent en grande partie sur la façon dont votre site restitue ce code : côté serveur, côté client ou rendu dynamique.
Rendu côté serveur
Le rendu côté serveur (SSR) correspond au rendu de JavaScript sur le serveur. Une page HTML rendue est ensuite servie au client (navigateur, Googlebot, etc.). Par exemple, lorsque vous visitez un site Web, votre navigateur envoie une requête au serveur qui détient le contenu du site Web. Une fois la demande traitée, votre navigateur renvoie le HTML rendu et l’affiche sur votre écran. SSR a tendance à aider les pages avec des performances SEO parce que :
- Cela peut réduire le temps nécessaire au chargement du contenu principal d’une page
- Il peut réduire les changements de mise en page qui nuisent à l’expérience utilisateur
Cependant, SSR peut augmenter le temps nécessaire à votre page pour autoriser les entrées utilisateur. C’est pourquoi certains sites Web qui traitent beaucoup de JS choisissent d’utiliser SSR pour certaines pages et pas pour d’autres. Dans des modèles hybrides comme celui-ci, le SSR est généralement réservé aux pages importantes à des fins de référencement. Et le rendu côté client (CSR) est généralement réservé aux pages qui nécessitent beaucoup d’interactions et d’entrées de l’utilisateur.Mais la mise en œuvre du SSR est souvent complexe et difficile pour les développeurs. Pourtant, il existe des outils pour aider à mettre en œuvre la RSS :
- Gatsby et Next.JS pour le framework React
- Angular Universal pour le framework Angular
- Nuxt.js pour le framework Vue.js
Rendu côté client
La RSE est le contraire de la RSS. Dans ce cas, JavaScript est rendu côté client (navigateur ou Googlebot, dans ce cas) à l’aide du modèle d’objet de document (DOM). Plutôt que de recevoir le contenu du document HTML comme dans le rendu côté serveur, vous obtenez un HTML simple avec un fichier JavaScript qui rend le reste du site à l’aide du navigateur. La plupart des sites Web qui utilisent la RSE ont des interfaces utilisateur complexes ou de nombreuses interactions.
Rendu dynamique
Le rendu dynamique est une alternative au rendu côté serveur. Il détecte les robots qui peuvent avoir des problèmes avec le contenu généré par JS et fournit une version rendue par le serveur sans JavaScript. Tout en montrant aux utilisateurs la version rendue côté client. Le rendu dynamique est une solution de contournement et non une solution recommandée par Google. Cela crée des complexités et des ressources supplémentaires inutiles pour Google. Vous pouvez envisager d’utiliser le rendu dynamique si vous avez un site volumineux dont le contenu change rapidement et nécessite une indexation rapide. Ou si votre site repose sur des médias sociaux et des applications de chat qui ont besoin d’accéder au contenu d’une page. Ou si les robots d’exploration importants pour votre site ne peuvent pas prendre en charge certaines des fonctionnalités de votre JS. Mais en réalité, le rendu dynamique est rarement une solution à long terme. Vous pouvez en savoir plus sur la configuration du rendu dynamique et certaines approches alternatives à partir des directives de Google.Note : Google ne considère généralement pas le rendu dynamique comme du « cloaking » (le fait de présenter un contenu différent aux moteurs de recherche et aux utilisateurs). Bien que le rendu dynamique ne soit pas idéal pour d’autres raisons, il est peu probable qu’il enfreigne les règles de dissimulation décrites dans les politiques anti-spam de Google.
Comment rendre le contenu JavaScript de votre site Web optimisé pour le référencement
/h3> Après une minute ou deux et vous verrez le code de la page et une capture d’écran. Vérifiez s’il y a des divergences ou du contenu manquant en cliquant sur le bouton « Plus d’informations” onglet. Une raison courante pour laquelle Google ne peut pas afficher les pages JS est que le fichier robots.txt de votre site bloque le rendu. Souvent accidentellement.Ajoutez le code suivant au fichier robot.txt pour vous assurer qu’aucune ressource cruciale n’est bloquée pour l’exploration :User-Agent : Googlebot
Autoriser :.js
Autoriser :.cssNote : Google n’indexe pas les fichiers.js ou.css dans les résultats de recherche. Ils sont utilisés pour afficher une page Web. Il n’y a aucune raison de bloquer ces ressources cruciales. Cela peut empêcher votre contenu d’être rendu et, à son tour, d’être indexé.
Assurez-vous que Google indexe le contenu JavaScript
Par exemplecom/page-URL/Si la page est indexée Par exemple :site :votredomaine Et vérifiez le code source HTML de la page. Scannez le code HTML pour trouver des extraits de contenu JavaScript. Si vous ne voyez pas votre contenu JS, cela peut être dû à plusieurs raisons :
- Le contenu ne peut pas être rendu
- L’URL ne peut pas être découverte car JS génère des liens internes pointant vers elle en cas de clic
- La page expire pendant que Google indexe le contenu
Exécuter un audit de site
« Alors choisi « Activé” pour le rendu JS dans les paramètres du robot d’exploration. Après l’exploration, vous trouverez tous les problèmes sous la rubrique « Questionsonglet « .
Problèmes courants de référencement JavaScript et comment les éviter
Voici quelques-uns des problèmes les plus courants, ainsi que quelques bonnes pratiques JavaScript SEO :
- Le blocage des fichiers.js dans votre fichier robots.txt peut empêcher Googlebot d’explorer ces ressources. Ce qui signifie qu’il ne peut pas les rendre et les indexer. Autorisez l’exploration de ces fichiers pour éviter ce problème
- Google n’attend pas longtemps que le contenu JavaScript soit rendu. Votre contenu peut ne pas être indexé en raison d’une erreur de délai d’attente.
- Lors du chargement paresseux d’une page à l’aide de JavaScript, ne tardez pas à charger le contenu qui doit être indexé. Concentrez-vous principalement sur les images plutôt que sur le contenu textuel lors de la configuration du chargement paresseux.
- Google ignore souvent les hachages, alors assurez-vous que des URL statiques sont générées pour les pages Web de votre site. Assurez-vous que vos URL ressemblent à ceci : (votredomaine.com/page-web). Et pas comme ceci (votredomaine.com/#/page-web) ou ceci (votredomaine.com#page-web)
Allez plus loin
vous serez sur la bonne voie pour créer des sites Web efficaces qui se classent bien et que les utilisateurs adorent. Prêt à plonger plus profondément ? Nous vous recommandons de lire ce qui suit pour en savoir plus sur le JS et le SEO technique :