Table des matières
Comment s’explique le message « Diffusez des images aux formats nouvelle génération » de PageSpeed ?
Quand vous analysez votre site avec PageSpeed Insights, il vous dit parfois : « Diffusez des images aux formats nouvelle génération« .
Il ne parle pas de l’horrible génération Z !! 😀
Il parle des formats d’image très modernes, et compacts, que sont .WEBP et .AVIF.
Avant ces formats, on avait les formats d’image JPG ou JPEG (pertinents pour des images hautement détaillées) ou PNG voire GIF (pertinents pour des images vectorielles, en aplats de couleurs).
Ces formats étaient eux-mêmes optimisés… à leur époque :
- GIF est apparu en 1987
- JPEG est sorti en 1992
- PNG en 1996
Les formats modernes sont beaucoup plus récents :
- WEBP : 2010 (créé par Google)
- AVIF : 2018
Et comme on s’en doute, WEBP et AVIF sont aussi beaucoup plus performants. Plus petits. Plus rapides à charger.
Les deux sont très bien supportés par les navigateurs récents.
Le problème, c’est qu’un grand nombre de logiciels qui fabriquent des images, les créent dans les anciens formats.
Quand ces images sont utilisées sur le web, Google leur reproche donc leur format vieillot.
Solution : servir des images aux formats WEBP ou AVIF
La solution consiste évidemment à convertir toutes vos images aux formats Webp ou Avif.
Maintenant, de deux choses l’une.
Convertir à la main
Soit vous avez peu d’images à convertir, et alors vous pouvez le faire à la main.
Cherchez sur un moteur de recherche « conversion jpg webp » ou « conversion png webp », vous verrez qu’il y a plein de solutions gratuites.
Convertir avec un plugin d’optimisation des images
Soit vous avez beaucoup d’images à traiter, et là, ce serait trop long de tout convertir à la main. Dans ce cas, je recommande d’utiliser un plugin d’optimisation des images. Par exemple :
- ShortPixel, que j’utilise sur tous mes sites
- Optimus
- SmushIt!
- EWWW Image Optimizer
- etc
Je préfère ShortPixel parce que non seulement il va tout convertir en .webp ou .avif, mais en plus il peut servir les images depuis son CDN. Ce qui contribue à décharger fortement votre serveur. Conséquence : vos pages se chargent plus vite !
Que faire si le serveur ou WordPress refusent les formats modernes ?
Il arrive que la conversion en webp ou avif soit bloquée par un problème technique. Certains serveurs, ou WordPress lui-même, peuvent ne pas être prêts pour gérer ces formats.
Si vous tombez sur ce problème, voici des pistes pour le résoudre.
Déclarer le type mime au serveur
Pour qu’un serveur sache gérer un type de fichier, il faut qu’il connaisse son « type mime« . Cherchez pas, ça s’appelle comme ça. Il faut donc le lui déclarer.
Pour ça, sous Apache, il faut aller éditer le fichier .htaccess qui se trouve à la racine, dans le dossier où sont hébergés les fichiers de votre site.
Ajoutez-y ceci (attention, si vous faites n’importe quoi ça cassera votre site) :
<IfModule mod_mime.c>
AddType image/webp .webp
AddType image/avif .avif
</IfModule>
Sous Nginx, il faut ajouter ceci à la config :
types {
image/webp webp;
image/avif avif;
}
Déclarer le type mime à WordPress
Si WordPress continue à rechigner, déclarez-lui les types mime.
Pour ça, allez dans le fichier functions.php de votre thème.
Ajoutez-y ce code (là aussi, faites attention, vous pourriez casser le site) :
function enable_custom_image_formats($mime_types) {
$mime_types['webp'] = 'image/webp';
$mime_types['avif'] = 'image/avif';
return $mime_types;
}
add_filter('mime_types', 'enable_custom_image_formats');
Normalement, après ça, vous pourrez télécharger et afficher des images en webp et avif.
Voilà, problème réglé !
(N’omettez pas de bien dimensionner vos images.)
Besoin d’aide ?
Besoin d’aide ? Je peux vous aider à optimiser vos images :
Service d’optimisation des performances
