#1 Réduire le nombre des requêtes http
Une requête http sera envoyée pour chaque élément de votre page. Logiquement, plus vous avez d’éléments (images, scripts, Flash…), plus votre page sera lente à charger. Selon Yahoo, 80% du temps de chargement est imputable au téléchargement des différentes parties de la page. Vous devez donc rationaliser le nombre d’éléments par page, préférer le CSS à l’image dans la mesure du possible et placer les scripts en fin de page.
#2 Réduire le temps de réponse des serveurs
Vous devez viser un temps de réponse inférieur à 200 ms à ce niveau. Nous vous conseillons d’utiliser une solution de monitoring des applications web. Voici quelques pistes :
Yslow : ce logiciel mesure le temps de réponse de vos pages et vous propose des solutions adaptées pour le réduire autant que possible ; PageSpeed Tools de Google : pour mettre en lumière les meilleures actions à entreprendre afin d’améliorer les performances de votre site et ensuite les automatiser.
#3 Activer la compression
Aujourd’hui, près de 90 % des navigateurs supportent le format Gzip qui compresse les pages. Toujours selon Yahoo, la compression en Gzip réduit le temps de chargement de 70%. Configurez votre serveur pour activer la compression :
Apache : utilisez mod_deflate ; Nginx : utilisez HttpGzipModule ; ISS : utilisez Configure http Compression.
#4 Activer la mise en cache du navigateur
À chaque fois que vous vous rendez sur un site, des données seront stockées dans le cache pour gagner en temps de chargement lors de votre prochaine visite. Le temps de sauvegarde sur la mémoire cache dépend de ce que le code de votre site autorise. Ainsi, étendez le temps de sauvegarde à une semaine au minimum (et à un an au maximum). Pour les ressources tierces comme les publicités, une petite journée suffira.
#5 « Minifier » les ressources
Alors bien sûr, le WYSIWYG facilite grandement la construction des pages. Toutefois, cela peut se répercuter sur la propreté du code. Pour le nettoyer, Google recommande :
PageSpeed Insights pour minifier le HTML. Cette extension chrome vous aidera à optimiser la vitesse de chargement sans toucher à l’affichage ; YUI Compressor ou CSSmin.js pour minifier le CSS ; Closure Composure, JSMin, YUI Compressor pour minifier JavaScript.
#6 Optimiser les images
L’optimisation des images répond au triptyque suivant :
Taille : une image plus grande que nécessaire entrainera un temps de chargement supplémentaire et surtout inutile (une image plus large que votre site n’a pas de sens) ; Format : JPEG est la meilleure option (le format PNG est aussi acceptable). Attention aux GIFS démesurés ! Attribut Source : le code HTML d’une image comprend la mention :
"">. Veillez à ne pas laisser l’attribut vide, sous peine d’un ralentissement conséquent aux requêtes émises par le navigateur vers le répertoire de l’image.