En tant que référenceurs web, nous avons tous déjà été amenés à travailler sur le référencement de sites utilisant des technologies et des langages informatiques quelque peu particuliers en termes de référencement.
La technologie Flash en est une et fait parfois le cauchemar des référenceurs, l’Ajax en est une autre.
Alors quelles techniques de référencement utiliser sur un site programmé en Ajax ?
Qu’est-ce que la technologie Ajax ?
Asynchronous JavaScript And XML, autrement dit Javascript et XML asynchrones.
L’Ajax est donc l’ensemble des technologies utilisées pour le développement d’applications web, notamment le chargement de photos ou encore du panier dans le cas d’un site e-commerce.
(source : http://www.webotheque.fr/glossaire-web/AJAX.html)
L’Ajax est donc l’ensemble des technologies utilisées pour le développement d’applications web, notamment le chargement de photos ou encore du panier dans le cas d’un site e-commerce.
(source : http://www.webotheque.fr/glossaire-web/AJAX.html)
Comment fonctionne l’Ajax ?
Dans une application Web classique, lors de chaque manipulation faite par l’utilisateur, le navigateur envoie une requête contenant une référence à une page Web, puis le serveur HTTP envoie le résultat sous forme d’une page à destination du navigateur. L’utilisateur doit alors attendre l’arrivée de la réponse pour effectuer d’autres manipulations.
La technologie Ajax, écrite en langage de programmation JavaScript et incorporé dans une page web, est exécutée par le navigateur. Celui-ci envoie des demandes auserveur HTTP, puis modifie le contenu de la page actuellement affichée par le navigateur en fonction du résultat reçu du serveur, évitant ainsi la transmission et l’affichage d’une nouvelle page.
En Ajax, comme le nom l’indique, les demandes sont effectuées de manière asynchrone : les requêtes sont envoyées au serveur HTTP pour récupérer uniquement les données nécessaires, le temps de réponse est nettement raccourci et donc le temps d’affichage des pages pour l’utilisateur.
Ajax et référencement naturel
La technologie Ajax se base donc sur l’affichage de pages dynamiques, par l’envoi de requêtes au serveur HTTP afin d’afficher uniquement la page demandée. Les moteurs de recherche quant à eux sont dans l’incapacité d’interpréter ce langage, ce qui aura un impact sur le référencement de votre site.
Il existe toutefois des techniques permettant de pallier à ce frein au référencement.
Il existe toutefois des techniques permettant de pallier à ce frein au référencement.
L’utilisation de la balise noscript
Le langage JavaScript, l’une des composantes de l’Ajax utilise des scripts pour y être exécutés sur le poste client. C’est alors le navigateur Web qui prend en charge l’exécution de ces programmes, qui ne sont pas interprétés ni intégrés par les moteurs de recherche, d’où l’utilisation du noscript, qui lui le sera.
J’ai été amenée à travailler sur le référencement d’un site full Ajax, ce qui veut dire que l’intégralité du site utilisait cette technologie. Le panier, l’affichage des photos mais également le menu, les catégories, etc.
Il m’a alors été posée la question suivante : l’utilisation de la balise noscript pourrait-elle constituer un palliatif à l’Ajax ?
Il m’a alors été posée la question suivante : l’utilisation de la balise noscript pourrait-elle constituer un palliatif à l’Ajax ?
Voici ce que j’en pense, et cela n’engage que moi, libre à vous de donner votre avis sur le sujet.
La balise noscript peut en effet être utilisée, mais avec parcimonie ! Pourquoi ? Les moteurs ne lisent certes pas le JavaScript, mais bel et bien ce qui est contenu dans lenoscript. Il s’agit donc d’utiliser cette balise dans le seul but de rendre lisible un contenu aux moteurs.
Imaginons que le contenu du JavaScript ne soit pas similaire à celui figurant dans labalise noscript, ce qui veut dire que la page propose un contenu aux utilisateurs qui sera différent de celui soumis aux moteurs. On parle alors de cloacking, autrement dit “tromper” les moteurs en leur proposant un contenu différent de celui réellement affiché, qu’ils intègreront, à des fins de meilleur positionnement par exemple.
Il va s’en dire que ce type de techniques est sujet au blacklisting ou à l’effet sandbox, si tant est qu’elles soient repérées.
Imaginons que le contenu du JavaScript ne soit pas similaire à celui figurant dans labalise noscript, ce qui veut dire que la page propose un contenu aux utilisateurs qui sera différent de celui soumis aux moteurs. On parle alors de cloacking, autrement dit “tromper” les moteurs en leur proposant un contenu différent de celui réellement affiché, qu’ils intègreront, à des fins de meilleur positionnement par exemple.
Il va s’en dire que ce type de techniques est sujet au blacklisting ou à l’effet sandbox, si tant est qu’elles soient repérées.
Ensuite, dans mon cas de site en full Ajax, imaginez le travail que cela implique : intégrer des balises noscript absolument partout, afin que le contenu soit intégré par les moteurs…. Pas très rentable comme méthode, surtout si l’on prend en compte que le site propose de la vente en ligne, ce qui veut dire que son contenu changera très régulièrement, avec l’ajout de nouvelles fiches produits, etc.
Référencement de l’Ajax : la solution de Google
Depuis quelques années déjà, Google propose une technique visant à contourner ce frein au référencement. Pour les férus de langue anglaise, vous trouverez le détail de la mise en place sur le Google Webmaster Central Blog.
Sébastien Billard propose également un article que je trouve très clair, intitulé Google propose une méthode pour le référencement des sites Ajax.
L’insertion d’un Token dans les Urls
En Ajax, les Urls se distinguent à l’aide d’ancres internes, que l’on distingue lors de l’apparition du # dans une Url. Or les moteurs de recherche n’intègrent pas les ancres internes.
Google propose alors de distinguer les pages Ajax des simples Urls à ancres internespar l’insertion d’un point d’exclamation dans l’Url de la page. Comme indiqué dans leur blog officiel, l’Url http://example.com/page?query#state deviendrait alors http://example.com/page?query#!state. L’insertion de ce point d’exclamation est appelé unToken.
Google propose alors de distinguer les pages Ajax des simples Urls à ancres internespar l’insertion d’un point d’exclamation dans l’Url de la page. Comme indiqué dans leur blog officiel, l’Url http://example.com/page?query#state deviendrait alors http://example.com/page?query#!state. L’insertion de ce point d’exclamation est appelé unToken.
Utilisation d’un navigateur côté serveur
Le navigateur côté serveur sera utilisé afin d’accéder aux pages Ajax de votre site et de générer un instantané de cette page en version HTML.
Dans ce cas, seules les Urls comprenant le Token seront traitées par le navigateur côté serveur.
En procédant du côté serveur, le webmaster sera alors en mesure de contrôler le code HTML généré et pourra vérifier que le JavaScript soit exécuté correctement.
L’installation d’un navigateur côté serveur peut se faire avec HtmlUnit par exemple.
Dans ce cas, seules les Urls comprenant le Token seront traitées par le navigateur côté serveur.
En procédant du côté serveur, le webmaster sera alors en mesure de contrôler le code HTML généré et pourra vérifier que le JavaScript soit exécuté correctement.
L’installation d’un navigateur côté serveur peut se faire avec HtmlUnit par exemple.
Utilisation d’une Url spécifique pour accéder à la version HTML de la page
Google propose ensuite l’insertion d’un token spécifique dans les paramètres des Urls, afin que la page soit repérée, c’est alors l’instantané HTML qui sera indexé par le moteur.
Ce token proposé par Google sera sous la forme _escape_fragment, ainsi l’Url originale http://example.com/page?query#state deviendra http://example.com/page?query&_escaped_fragment_=state.
Le fait “d’échapper à l’état” indique au moteur qu’il peut accéder à la version HTML de la page.
L’affichage des Urls originales pour les internautes
Enfin, Google indique dans ses recommandations que par mesure d’expérience utilisateur, c’est l’Url originelle de la page qui sera affichée à l’utilisateur, dans notre cas de figure http://example.com/page?query#!state.
Il est également mentionné que les robots seront en mesure de vérifier que le contenu proposé aux utilisateurs soit identique à l’instantané HTML soumis au moteur.
Il est également mentionné que les robots seront en mesure de vérifier que le contenu proposé aux utilisateurs soit identique à l’instantané HTML soumis au moteur.
Pourquoi Google demande aux webmasters cette mise en place ?
La question que l’on peut alors se poser est de savoir pourquoi les gentils gens de chez Google n’installent pas eux-mêmes ce système capable de générer des instantanés HTML?
Je citerai le fils d’Alexandre Dumas pour répondre à cette interrogation “Les affaires ? C’est bien simple, c’est l’argent des autres”. CQFD.
Quant au cas de mon site full Ajax, l’insertion de balises noscript n’a finalement pas été retenue, en revanche le site a été entièrement nettoyé, sans Ajax ;-)
