La vitesse des sites est désormais un facteur de classement des résultats de recherche Google sur mobile.

Google veut améliorer l’expérience client, notamment sur le plan de la vitesse. Argumentant sur le fait que la moitié des utilisateurs quittent un site s’il met plus de 3 secs à charger sur mobile.

C’était déjà un critère pour les recherches sur ordinateur depuis 2010 et c’est désormais le cas pour les recherches sur mobile depuis juillet 2018.

Leur motivation a été appuyée par les données réelles du rapport sur l’expérience utilisateur Chrome qui montrent que les utilisateurs se soucient vraiment de la rapidité de chargement de leurs pages.

Rapport sur l'expérience utilisateur Chrome

Vous ne le savez peut-être pas, mais Google utilise les informations des personnes qui ont « le rapport statistique sur l’utilisation » activé dans leur navigateur Chrome.

Pas d’inquiétude, il s’agit d'utilisateurs de Chrome qui ont choisi de synchroniser leur historique de navigation, n'ont pas défini de phrase secrète Sync et ont activé le rapport statistique sur l'utilisation. C’est non imposé, mais ce sont des données très intéressantes notamment sur les vitesses de chargement des sites.

Rapport Sur Experience Utilisateur Chrome

Comment améliorer la vitesse de votre site

Dans un premier temps, vous devez tester votre site avec les outils disponibles en ligne :


Les outils vont vous donner les pistes d’amélioration pour gagner en vitesse de chargement.

Mon expérience sur Google PageSpeed Insights

Page Speed Insights

Si vous partez de loin (ex. : moins de 50), les premières choses sont souvent faciles à mettre en place et font monter le score :

  • Activer la compression (htaccess ou configuration serveur)
  • Optimiser la mise en cache (htaccess ou configuration server)
  • Optimiser les images (réduire le poids)

Ensuite, ça se complique :

  • Réduire la taille des ressources JS et CSS : utiliser un système de build (webpack ou gulp) pour n’avoir qu’un seul fichier CSS et un seul fichier JS.
  • Éliminer le code JS qui bloque l’affichage : suffit de passer les balises en mode async (https://www.alsacreations.com/...)
  • Améliorer le temps de réponse serveur : ajouter un système de cache (si votre site est dynamique) et éventuellement augmenter la capacité de votre serveur


Pour finir, les plus difficiles :

  • Éliminer le code CSS qui bloque l’affichage : il faut un css (le critical) pour afficher le site en forme au-dessus de la ligne de flottaison (la zone que l'internaute peut consulter sans avoir à faire défiler la page vers le bas) et tout ce qui s’affiche plus tard dans un autre fichier
  • Afficher en priorité le contenu visible : c’est une correction difficile à faire et à comprendre, car il faut repenser le contenu pour éliminer les éléments bloquants.




Si vous passez beaucoup de temps et que vous travaillez bien, vous allez certainement vous approcher de 100.

Les conseils que je peux donner : le premier, c’est bien évidemment prendre en compte ces critères dès la conception. Et en deuxième, une fois obtenue une note honorable (ex. : 90), ne pas passer trop de temps dessus, car les derniers points sont vraiment énergivores en temps.

Les alternatives au service Google Maps pour un site web
Compresser les images avec jpegoptim et optipng