Accélérez votre site avec Google PageSpeed Insight : guide simple et concret

Pourquoi la rapidité de chargement d’une page web compte ?

Les bénéfices pour l’expérience client et les conversions

Un plus pour le SEO

La question de l’impact de la vitesse de chargement d’une page / d’un site sur son classement dans Google est un vieux serpent de mer. A la question “la rapidité de chargement est-elle un critère de classement” (“ranking factor” en anglais), la réponse est : “Non, la vitesse est au mieux un signal léger“.

Les porte-paroles de Google (John Mueller, Gary Illyes) ont clarifié le poids de la vitesse dans l’algorithme lors de plusieurs interventions en 2025 (notamment dans les Office Hours et podcasts). En clair, il faut voir la question de la vitesse comme une question binaire. Un site très lent peut être pénalisé, mais un site “ultra-rapide” ne recevra pas de bonus de classement significatif par rapport à un site “suffisamment rapide”.

En 2021, John Mueller précisait déjà que la vitesse est davantage “un juge de paix”, et que sans contenu de qualité, la vitesse ne peut pas propulser une page dans le haut des SERP (cf. article seoroundtable.com). C’est pourquoi nous, consultants SEO 410 Gone, dont je fais partie, insistons auprès de nos clients lors d’audit SEO sur l’importance de ne pas céder à l’obsession du score “100/100” aux Core Web Vitals (CWV).

Mais voilà ce qu’il faut retenir : la vitesse/le score Core Web Vitals reste un signal de qualité important pour l’expérience utilisateur globale. Et nous savons aujourd’hui que Google répercute les signaux UX aussi bien positifs que négatifs sur le classement. C’est donc un facteur de classement indirect !

Core Web Vitals, c’est quoi exactement ?

Mieux comprendre les métriques Core Web Vitals

Ce qu’il faut retenir du score de performance

Comment lire un rapport PageSpeed Insights en 2 minutes ? La méthode 410 :

Etape 1. Analyser les métriques essentielles

Notre objectif lors de cette première étape est d’identifier rapidement les élèments les plus bloquants. ⚠️Important : analyser toujours en priorités les métriques “mobile” ! Toute optimisation pour mobile sera dans tous les cas bénéfiques sur un écran plus grand !

Métriques CWV moyenne ou mauvaise	Pourquoi c’est important	Les solutions
LCP	Sur une fiche produit d’une boutique par exemple, si l’image s’affiche trop lentement, c’est un frein majeur à l’expérience utilisateur. Identifiez-le en allant dans le rapport détaillé “Insights”. Dans la majorité des cas, il s’agit d’une image trop lourde.	Il est possible d’optimiser le chargement de l’élèment LCP. ⚠️ Le lazyloading ou chargement différé ne doit pas s’appliquer à cet élèment.
CLS	Avez-vous remarqué un bloc ou un élèment qui change de place au fil du chargement de la page ? Cela fait parti des choses les plus frustrantes pour un internaute. Dans le même temps, il peut être très difficile de répèrer la source du problème.	Collaborez avec un développeur ou un consultant SEO aguerri qui saura repèrer le problème de décalage d’affichage.
TTFB	Un mauvais TTFB est le signe d’une page qui répond trop lentement. C’est d’ailleurs une des métriques les plus importantes.	La première des solutions est d’opter pour un hébérgement plus rapide. L’autre solution la plus simple à mettre en place est l’installation d’une solution de mise en cache.

Etape 2. Repérer les opportunités d’optimisation

Les optimisations faciles (classées par impact)

Images & média : le plus gros levier (et le plus simple)

Régulièrement, lors de la livraison d’audit technique SEO, j’ai l’habitude de dire à mes clients : “optimiser les images d’un site c’est faire déjà plus de la moitié du chemin en matière de web performance !”

Améliorer la vitesse de chargement des images est à la fois très facile et très efficace ! Encore faut-il adapoter les bons réflexes pour ne pas retomber dans ses travers. Exemple de mauvais réflexe : uploader l’image d’un produit au format JPG ou PNG et à la taille originale. Résultat : l’image sera souvent trop lourde et ses dimensions dépassent largement la taille d’affichage sur la page web.

Pour les images, voici une méthodologie très facile à suivre pour économiser jusqu’à 80% du poids de l’image :

• Retailler les images : à moins d’avoir de très bonnes raisons de le faire, il faut si possible éviter de télécharger des images aux dimensions trop importantes. Même s’il est souvent difficile de déterminer la taille d’image appropriée, la meilleure des solutions est de retailler les images avec des dimensions “passe partout”. Ex : 1200 x 800 pixels. Pour retailler vos images, utilisez un éditeur tel que Photoshop, Affinity ou Pixlr.
• Opter pour des images compressées au format WEBP ou AVIFF : le simple fait de passer d’un format JPG à WEBP permet de réduire par 3 le poids d’une image ! Imaginez donc le gain de temps sur une page chargeant une vingtaine d’images ! Le gros avantage de ces nouveaux formats est qu’ils réduisent considérablement le poids d’une image tout en offrant un affichage quasi-identique à l’oeil nu sur des petites et moyennes résolutions.
• Mettre en place le lazyloading : c’est ce qu’on appelle le “chargement différé”. Le principe est bête comme chou mais redoutable : au lieu de charger les 50 images d’une page d’un seul coup dès l’arrivée de l’internaute, le navigateur ne charge que celles qui sont visibles à l’écran. Les autres se chargent au fur et à mesure que l’utilisateur “scrolle” (descend) dans la page.
• Précharger l’image LCP : c’est le petit “coup de boost” technique qui permet souvent de gagner les précieuses millisecondes manquantes. C’est également une erreur courante que nous identifions lors des audits techniques SEO lors de la mise en place du chargement différé. En effet, le chargement différé doit surtout être activé pour les images situées en-dessous de la ligne de flotaison. Le pré-chargement de l’image LCP c’est l’inverse : il se concentre souvent sur les images situées au-dessus de cette ligne.

Autre optimisation puissante : définir des dimensions explicites pour les images et leurs containers. C’est le remède miracle contre les sauts de page intempestifs (le fameux CLS). Sans ces indications, le navigateur ne peut pas deviner la place que l’image va prendre avant de l’avoir totalement téléchargée.

• Le problème : Le navigateur affiche le texte, puis, une fois l’image arrivée, il “pousse” brutalement tout le contenu vers le bas pour l’insérer. C’est très frustrant pour l’utilisateur qui était en train de lire ou s’apprêtait à cliquer.
• La solution : Indiquez toujours les attributs width et height dans le code HTML de l’image. Cela permet au navigateur de calculer le ratio (aspect-ratio) et de réserver un espace vide de la bonne taille avant même l’affichage de l’image. Le design reste parfaitement stable pendant le chargement.

Polices de caractères

Après les images, les fichiers de police (fonts) sont souvent les éléments les plus bloquants pour le chargement d’une page. Une police mal optimisée peut empêcher l’affichage du texte pendant plusieurs secondes, laissant l’utilisateur face à un écran vide.

Voici les 4 leviers essentiels pour optimiser la typographie sans sacrifier le design :

• Héberger les polices localement (Self-hosting) : C’est une erreur fréquente de continuer à appeler les polices depuis les serveurs de Google Fonts ou Adobe. Cela oblige le navigateur à effectuer des requêtes DNS supplémentaires et à ouvrir des connexions vers des domaines tiers, ce qui perd du temps. La solution : Téléchargez les fichiers de police et placez-les directement sur votre propre serveur. Cela réduit la latence et vous donne le contrôle total sur la mise en cache.
• Privilégier le format WOFF2 : oubliez les vieux formats TTF, EOT ou SVG qui sont lourds et obsolètes.
• Ne charger que le strict nécessaire (Subsetting) : une famille de police contient souvent des dizaines de graisses (Thin, Light, Medium, Bold, Black…) et des caractères pour toutes les langues (cyrillique, grec, etc.). Charger tout le paquet est inutilement lourd.
• Activer font-display: swap : avez-vous déjà remarqué ces textes qui restent invisibles pendant quelques secondes avant d’apparaître soudainement ? C’est l’effet “FOIT” (Flash of Invisible Text), et c’est désastreux pour l’expérience utilisateur.

La mise en cache

Si l’optimisation des images et des polices accélère la première visite, la mise en cache est ce qui rend la seconde visite quasi instantanée. Le principe est d’autoriser le navigateur de l’internaute à conserver une copie des fichiers statiques (logo, styles, scripts) sur son disque dur ou son téléphone pour ne pas avoir à les retélécharger à chaque changement de page.

Un CMS (comme WordPress ou Magento) doit “construire” la page à chaque visite : il interroge la base de données, exécute du code PHP, et assemble le tout. C’est long et gourmand en ressources. Le “Page Caching” permet de prendre une photo de cette page une fois construite (HTML) et de servir cette photo directement aux visiteurs suivants. Le serveur ne travaille plus, il ne fait que livrer.

Voici l’ajout idéal pour compléter la partie technique. Il est important de distinguer le cache navigateur (chez l’utilisateur, vu précédemment) du cache CMS/Serveur (chez vous).

C’est souvent la mesure la plus efficace pour réduire le TTFB (temps de réponse serveur).

Les solutions de cache navigateur, CMS et serveur

Un CMS (comme WordPress ou Magento) doit “construire” la page à chaque visite : il interroge la base de données, exécute du code PHP, et assemble le tout. C’est long et gourmand en ressources. Le “Page Caching” permet de prendre une photo de cette page une fois construite (HTML) et de servir cette photo directement aux visiteurs suivants. Le serveur ne travaille plus, il ne fait que livrer.

Voici les recommandations spécifiques selon votre plateforme :

• WordPress : WP Rocket est le module payant référence sur WP. Il gère le cache, mais aussi la minification, le lazyloading et le préchargement en quelques clics. W3 Total Cache ou WP Super Cache sont également des alternatives gratuites efficaces. Les hébergements WordPress (Kinsta, Hostinger, WP Engine) intégrent également de plus en plus souvent des solutions de cache côté serveur.
• Prestashop : nativement plus lourd que WordPress, PrestaShop nécessite une gestion fine du cache pour ne pas ralentir le tunnel d’achat. Les réglages natifs permettent d’activer Cache Smarty et les modules tiers offrent un vrai cache complet. L’utilisation de modules comme Page Cache Ultimate (JPresta) est souvent nécessaire pour obtenir des temps de chargement compétitifs.
• Magento : un CMS très puissant mais notoirement lourd. Varnish Cache est LA solution de cache la plus puissante. Oubliez le cache fichiers standard. Magento est conçu pour fonctionner avec Varnish, un accélérateur HTTP qui stocke les pages en mémoire RAM. C’est une configuration serveur (à voir avec votre hébergeur/infogéreur) indispensable pour passer sous la barre des 500ms de TTFB.