Blog dev' de Simon MARTINEZ

L’ajax est omniprésent depuis quelques années sur la toile, on en trouve sur twitter, facebook, netvibes, gmail etc… Un site totalement en AJAX améliore les temps d’attentes (on ne charge qu’une partie de la page) et améliore donc la navigation de les internautes. Google et les autres moteurs de recherches n’interprètent pas le Javascript, il est impossible donc de référencement du contenu dynamique.
Mais il y a quand même des solutions pour référencer vos sites utilisant du contenu dynamique (comme AJAX, FLASH, Silverlight etc…) que je vais présenter dans ce post :

Vos liens

Vos liens doivent contenir un ‘href’ pour les internautes n’ayant pas de Javascript (et les moteurs de recherche) et un ‘onclick’ pour ceux ayant le Javascript activé. La méthode ‘Onclick’ s’exécute en premier et en ajoutant « return false; » le navigateur n’interprète pas la suite donc le ‘href’.
Ainsi vos liens ressembleront à :

<a href=’accueil.php’ onclick= »include(‘accueil.php’);return false; »>Page d’accueil</a>

Hash URL et Redirection

Il faut créer un hash URL pour les internautes possédant le Javascript, ainsi si ils sont sur la page home l’url ressemblera à : nom-de-domaine.com/#home Cet astuce permettra également aux internautes de naviguer avec les boutons retour et suivant.
Enfin, il faut créer des redirections Javascript de toutes vos pages vers vos ‘URL Hashés’ :

//Si le Hash de nom-de-domaine.com/home.php est vide, on redirige l’utilisateur vers #home

if(document.location.hash.substring(1) ==  »)

document.location.href = ‘http://www.nom-de-domaine.com/#home’;

Utilisez les balises noscript

Si je dois inclure mon formulaire de contact au milieu de ma page en AJAX, il ne faut pas que le header et le footer s’incluent sinon ça me ferait 2 headers et 2 footers. Je ne peux pas non plus retirer le header et le footer de ma page contact, car j’en ai besoin pour mes utilisateurs n’ayant pas le Javascript activé.
La solution réside dans les balises <noscript>, en effet le header et le footer contact.php seront entourés par la balise <noscript> ainsi seul les utilisateurs sans JS et les moteurs de recherches pourront l’interpréter.

Un petit site que j’ai développé il y a quelques temps, qui utilisent ces recommandations  : radio en ligne