Tous les sites ne sont pas aussi rapides. Tout dépend de ce que contient chaque page. Mais ça n’est pas aussi simple…

Depuis quelques temps, Google a enfourché un nouveau cheval de bataille : il faut que les sites soient rapides à charger si on veut que leur référencement ne soit pas pénalisé. Mais comment calcule-t-on la rapidité de chargement d’une page, d’un site, et comment améliore-t-on cela ?

Le problème est d’autant plus complexe qu’il existe plusieurs techniques différentes pour concevoir un site, qu’on peut mélanger ces techniques… De plus, il faut comparer ce qui est comparable : certains sites — une banque d’images, par exemple — ont besoin d’afficher beaucoup de contenu lourd… donc tout est très relatif.

Calculer la vitesse ?

Honnêtement, ça n’est pas si simple qu’il n’y parait. On pourrait penser qu’il suffit de chronométrer le temps de chargement d’une page… Mais ce temps de chargement peut aussi dépendre de votre vitesse de connexion, ça fausse tout. Il faut donc comparer avec d’autres pages, afin de tout remettre à niveau…

Oui, mais… ça peut aussi dépendre du matériel qu’on utilise pour visualiser la page. Certains éléments se chargement plus ou moins vite suivant qu’on regarde avec Internet Explorer ou Firefox, sans parler des téléphones mobiles… Oh, et certains navigateurs ne prennent pas en compte certaines technologies — Flash est en train de disparaître par exemple —, les robots Google ou Yahoo, par exemple, ne comprennent pas le Javascript. Et on peut charger des éléments très lourds, avec du Javascript…

Et le cache ? En effet, si on a une grosse image de fond sur chaque page, la première page sera longue à charger. Mais pour la seconde, on aura déjà, en cache, l’image de fond qui faisait la majorité du poids… donc les autres pages peuvent être très rapides à charger.

Finalement, calculer la vitesse de chargement d’une page, c’est très subjectif.

Restez humain

Les outils de calcul des moteur de recherche, on a vu pourquoi, ne peuvent pas être fiables à 100%. Quand vous préparez votre site, pensez avant tout aux internautes. Si vous travaillez votre site uniquement pour faire plaisir à Google, vous avez perdu d’avance.

Définissez votre cible principale, moyenne. Voyez quels navigateurs cette cible utilise, quelles vitesses de connexion elle a. Sur un téléphone mobile, ça n’est pas pareil qu’avec une connexion fibre optique… Votre site doit cadrer avec votre cible, et son design — qui va définir le poids des pages — doit coller également. Un public de graphistes aura certainement la patience d’attendre une ou deux secondes de plus si le graphisme du site le justifie, par exemple.

Les techniques

Un site peut être fait en Flash, en HTML, avec beaucoup ou peu d’images… D’une façon générale, moins on a à charger d’éléments, en nombre et en poids, plus le site sera rapide. Ce point est le plus important, mais ce n’est pas le seul. Au niveau de la construction générale, il est clair que plus la page est épurée, plus elle se chargera rapidement.

Les sites en Flash peuvent parfois poser quelques difficultés. Déjà, au niveau référencement, ils auront certainement des problèmes. Mais les animations Flash sont souvent relativement lourdes. À vous de voir si elles sont indispensables ou non. Si elles le sont, tentez autant que possible de les compresser autant que possible.

Minimiser le nombre de requêtes

Dans une page, à chaque fois qu’on appelle une image, à chaque fois qu’on charge une bibliothèque, on exécute une requête au serveur. Plus il y a de requêtes, et plus le serveur met de temps à réagir.

Pour accélérer le chargement de la page, il faut donc minimiser le nombrez de requêtes. Pour les bibliothèques Javascript, par exemple, essayer de tout regrouper dans le même fichier. Pour les images, voyez si vous ne pouvez pas utiliser la techniques des CSS sprites.

Minimiser le poids de chaque élément

Vos images doivent être compressées en PNG, JPEG ou GIF, en respectant au mieux le ratio poids/qualité. Mais on peut aussi minimiser le poids des scripts. En gros, il s’agit d’enlever tous les caractères qui ne servent pas : espaces, sauts de ligne… adieu ! Ça fait autant de caractères en moins à charger.

Certes, mais on perd carrément en lisibilité, au niveau du code… Là aussi, restez humains : certains commentaires de code sont vraiment pratiques. Et laisser quelques saut de ligne ne vous tuera pas. Ne tombez pas non plus dans l’excès.

Au niveau du serveur

Si vous avez la possibilité d’agir au niveau du serveur, là aussi, il y a de gros gains à faire. Le serveur, par exemple, peut compresser les données qu’il envoie. La navigateurs relativement récents — moins de 6-7 ans — sont tous capables de comprendre ce type de données. Pour tout ce qui est script — HTML, CSS, Javascript — le gain de temps de chargement peut être significatif.

Si vous utilisez du PHP, de l’ASP, et un serveur de bases de données, minimisez aussi autant que possible le travail du serveur. Moins il y a de requêtes SQL, par exemple, moins le serveur travaille, et plus il renvoie rapidement la page de résultat. Optimisez votre code.

Les outils

Il existe des outils très utiles pour vous aider à optimiser votre site. En local, je vous conseille Google Page Speed, pour Firefox. Cette extension permet de vérifier la vitesse de chaque page, avec des conseils pour chaque problème détectés.

GTmetrix aussi est un très bon outil. Ce site analyse lui aussi la vitesse d’une ou plusieurs pages, permet aussi de les comparer, et analyse suivant l’algorithme de Yahoo et de Google. Par contre, votre page doit être en ligne…

Au final

Penser optimisation ne peut être qu’une bonne chose. Mais ne perdez pas de vue votre objectif principal : contenter votre visiteur. Les techniques d’optimisation ne doivent pas supplanter les services que vous offrez, et le plaisir de naviguer sur votre site. Faites plaisir, raisonnablement.