Comment diffuser les images aux « formats nouvelle génération » (webp) sur WordPress ?

Les navigateurs prennent désormais en charge des images aux nouveaux formats (comme le .webp), ce qui est une bonne nouvelle pour la vitesse de chargement de nos pages. Car oui, le format webp est plus léger que les anciens formats comme jpeg, png et autres.

Le message de Google « diffuser les images aux formats nouvelle génération » indique que votre site doit afficher des images au format webp. Pour cela, utilisez l’extension WordPress Imagify.

Il existe une autre solution, mais je ne vous la conseille pas.

Pourquoi utiliser une extension WordPress pour charger les images en webp ?

J’ai pour habitude de vous conseiller d’installer un minimum d’extensions sur votre site WordPress, mais celle des images fait partie de la shortlist que je donne pour optimiser son site.

Un plugin WordPress d’optimisation d’images permettra de :

• Compresser le poids des images
• Redimensionner les images à la bonne taille
• Convertir les images déjà présentes sur votre site au format webp
• Afficher le format webp aux navigateurs compatibles

Sans extension, vous auriez dû faire toutes ces étapes manuellement.

Quelles extensions d’optimisations des images sous WordPress ?

La meilleure extension pour optimiser les images sous WordPress et faisant tout ce que je vous ai décrit précédemment est sans conteste Imagify.

Il a une offre gratuit qui est super légère, mais je vous conseille de prendre l’offre payante :

• Vous payez à la consommation, idéal pour la plupart des sites web
• Il y a aussi un forfait de 10€/mois, idéal pour celles et ceux mettant en ligne fréquemment de nouvelles images.

Il existe d’autres plugins qui font aussi cela :

• WebP Express
• ShortPixel Image Optimizer

La méthode manuelle

Si vous êtes un puriste, avez du temps devant vous et souhaitez apprendre; vous pouvez choisir la méthode manuelle.

Pour afficher les images en webp sur votre site, vous allez devoir :

• Pour chacune de vos images, les compresser via un outil en ligne gratuit comme I Love IMG.
• Convertir chacune de vos images en webp avec l’outil gratuit WEBP Converter.

Chaque image webp que vous allez mettre sur votre site doit être uploadé avec le même nom que votre ancienne image à l’ancien format.

Cela va permettre d’afficher l’image à l’ancien format pour les navigateurs pas compatibles et au nouveau format pour ceux qui le sont.

À condition de suivre l’étape suivante.

• Ajouter le code ci-dessous avec votre fichier .htaccess pour permettre au navigateur d’afficher vos images au format webp si il est compatible :

<IfModule mod_rewrite.c>
  RewriteEngine On
  # Vérifie si le navigateur accepte les images WebP
  RewriteCond %{HTTP_ACCEPT} image/webp
  # Vérifie si le fichier .webp correspondant existe
  RewriteCond %{DOCUMENT_ROOT}/$1.webp -f
  # Redirige vers le fichier WebP
  RewriteRule (.+)\.(jpe?g|png)$ $1.webp [T=image/webp,E=accept:1]
</IfModule>
<IfModule mod_headers.c>
  # Ajoute l'en-tête Vary pour indiquer la disponibilité de versions alternatives
  Header append Vary Accept env=REDIRECT_accept
</IfModule>

Et c’est tout !

Si vous rencontrez des difficultés pour une ou plusieurs étapes, contactez moi en commentaires ci-dessous.