Performance Web
Optimiser les images pour Google PageSpeed
Repérez les problèmes avec PageSpeed Insights, appliquez une correction ciblée et vérifiez la page publiée sans sacrifier les détails utiles.
Établir un état initial utile
Ouvrez PageSpeed Insights, saisissez l’URL publique de la page à tester et lancez un test pour mobile ou ordinateur.
- Testez l’URL publiée avec son chemin exact.
- Notez mobile ou ordinateur.
- Identifiez l’image citée et son URL actuelle.
- Conservez dimensions et poids avec le rapport.
- Définissez l’amélioration visée : poids, découverte, stabilité ou autre problème.
Choisissez une page représentative avant tout changement global : fiche produit avec galerie habituelle ou article avec couverture typique. Le résultat de l’accueil ne décrit pas automatiquement tous les modèles.

Choisir une correction ciblée
| Problème du rapport | Action |
|---|---|
| Trop de pixels pour la taille affichée | Utilisez une version plus petite qui reste nette. |
| Fichier lourd aux bonnes dimensions | Comparez une compression ou un format moderne accepté. |
| Le contenu bouge à l’arrivée de l’image | Réservez l’espace avant le chargement. |
| L’image principale commence à charger tard | Vérifiez le chargement différé et la découverte de l’image. |
Si l’image livrée dépasse sa surface d’affichage, préparez des variantes adaptées. Si l’encodage pose problème, comparez WebP via JPG vers WebP ou PNG vers WebP.
Si la page bouge à l’apparition de l’image, réservez sa place. Si l’image principale démarre tard, examinez sa découverte. Le guide Core Web Vitals explique ces cas.
Comprendre les deux sources de mesure
PageSpeed Insights combine un test Lighthouse en laboratoire et des données d’utilisateurs réels lorsqu’elles existent. Ces dernières couvrent les 28 jours précédents et peuvent concerner l’ensemble des pages de la même origine web (même protocole, nom d’hôte et port), plutôt que cette seule page. Un petit site peut manquer de données : ce n’est pas un échec du test. Consultez la documentation PageSpeed.
Un nouvel export peut améliorer le prochain test de laboratoire, tandis que les données historiques ne reflètent pas immédiatement la seule version modifiée. Notez la partie comparée pour ne pas confondre progrès immédiat du test et expérience réelle de tous les utilisateurs.
Vérifiez si les données réelles concernent cette URL ou toute l’origine. Une origine regroupe des pages ayant le même protocole, nom d’hôte et port ; ses données ne prouvent pas l’amélioration d’une page produit précise. Séparez les comparaisons en laboratoire de cette vue plus large. Distinguez aussi une économie d’octets estimée d’une amélioration mesurée du LCP : une image plus légère ne s’affiche pas forcément plus tôt.
Confirmer la publication du changement
Publiez le fichier et actualisez sa référence si nécessaire. Contrôlez la requête réelle du navigateur. Un export local seul ne change rien pour les visiteurs. Si l’ancien fichier persiste, examinez cache et variantes générées.
Retestez la même URL et catégorie d’appareil. Répétez si les résultats varient anormalement et comparez le constat précis, pas seulement le score. Évitez de changer hébergement, scripts et toutes les images ensemble si vous voulez identifier ce qui aide.
Savoir passer à d’autres problèmes
Après les images, examinez les blocages restants. Réponse lente, scripts lourds ou rendu tardif peuvent dominer. Compresser davantage dégraderait alors les images sans traiter la cause.
Conservez un relevé de la page, de l’original, du remplacement et du résultat. Il rend la méthode reproductible et aide à repérer une régression après un changement de thème ou de mise en page.
Exemple : transformer un constat en correction
Supposons que le rapport mobile signale une photo produit trop grande. Enregistrez rapport, URL de page, URL d’image et dimensions affichées. Publiez une copie plus petite au même cadrage sur une page test, puis confirmez la requête avant de mesurer. Il s’agit d’une méthode illustrative, pas d’un gain de score mesuré.
Relevez date, catégorie d’appareil, dimensions, poids, LCP, déplacements de mise en page et qualité. Répétez les tests comparables et notez leur dispersion au lieu de comparer le meilleur nouveau résultat au pire ancien. Un fichier réduit sans amélioration du LCP peut indiquer qu’une autre phase domine.
Décider de conserver la modification
Conservez une correction si elle résout le problème identifié sans dégrader détails, texte ou présentation. Une requête toujours tardive invite à examiner découverte et chargement. Un fichier reçu mais invisible invite à vérifier rendu et effets d’apparition. La compression seule ne corrige pas ces délais.
Testez une version optimisée
Choisissez une correction précise à partir du rapport, vérifiez son application sur la page publiée et comparez des tests équivalents. Gardez le changement s’il résout le problème sans dégrader l’image. Essayez WebP si le poids du fichier ou son encodage est en cause.
Convertir JPG en WebPDiagnostiquer une requête d’image lente →