WebP – format d’image nouvelle génération made in Google

Les temps de chargements de vos pages web jouent sur le ressenti perçu par vos visiteurs et constituent un critère de classement pour le référencement naturel.

Google pénalise d’ailleurs les pages qui se chargent trop lentement.

Améliorer la vitesse de votre site c’est potentiellement augmenter votre traffic, votre taux de conversion, …

Compression : Mettez vos images au régime

Des images compressées peuvent améliorer la vitesse de votre site web, d’autant plus qu’elles représentent à elles seules environ la moitié du poids d’une page web.

Dans l’idéal vous pages devraient être au régime sec 2 Mo et pas plus.

En 2010, Google à développé son propre format d’images de nouvelle génération : le WebP, un “standard” libre de droits (sous licence BSD).

Format qu’il utilise aujourd’hui sur ses services (ex. YouTube pour les miniatures de vidéos, …) mais qui a du mal à être adopté.

Le WebP permet aujourd’hui la compression sans perte avec prise en charge :

  • du canal alpha pour assurer la transparence,
  • des données EXIF (informations générées par les capteurs photos)m
  • et la gestion des animations.

Une compression sans perte … visible par l’œil humain

Vérifiez ci-dessous la différence entre JPEG et WebP :


Comme vous pouvez le constater le niveau de détail reste convenable dans les deux cas, le poids est par contre drastiquement réduit.

Selon les tests effectués par Google, avec le format WebP vous pouvez obtenir un poids de fichier jusqu’à 30% inférieur au format JPG ou PNG.

A noter qu’il vous est également possible d’opter pour une compression plus agressive avec perte de qualité.

WebP : une adoption lente

Jusque là, tous les navigateurs web ne le prennent pas officiellement en charge.

Il y a peu, seuls Google Chrome et Opera faisaient office de bons élèves.

Microsoft Edge et Mozilla Firefox vont cependant rapidement adopter ce nouveau standard du géant du web, courant 2019.

Rappelons que Google Chrome est le navigateur web le plus répandu dans le monde avec environ 60% de part de marché.

M.A.J. Firefox 65 est maintenant compatible avec WebP.

M.A.J. Microsoft Edge est également compatible depuis la version d’octobre 2018.

Quand à Safari, aucune information n’est à ce jour dévoilée concernant un possible support.

Vous retrouverez la liste complète des navigateurs web supportés à cette adresse : https://developers.google.com/speed/webp/faq

Pour les navigateurs web récalcitrants il vous faudra bien évidemment conserver la possibilité de diffuser vos images dans les formats classiques (JPG, PNG, …).

WebP : fichiers Media WordPress

Pour information, il vous sera aujourd’hui impossible de charger directement une image au format WebP dans la bibliothèque de média WordPress. Ce dernier étant uniquement compatible avec les formats : JPG, PNG, ICO et GIF.

Il est cependant certain que le support de WebP devrait prochainement arriver sous WordPress.

Imagify : génération d’images WebP

Vous pouvez opter pour des extensions qui se chargeront de créer et diffuser des versions WebP de vos images (ex. Imagify, …).

Pour chaque image compressée par Imagify vous pouvez opter pour la création simultanée d’une version WebP.

Attention ! La compression Imagify est gratuite mais dans la limite de 25 Mo par mois.

WebP : mise en cache WP Rocket

WP Rocket 3.4 assure maintenant la mise en cache des images au format WebP.

Attention ! WP Rocket ne crée pas de fichiers WebP, pour ce faire il vous faudra utiliser un logiciel de compression tel que Imagify.

WebP : bien tester le rendu

Attention les extensions qui diffusent du WebP utilisent souvent un mécanisme de remplacement de la balise <img> par la balise HTML 5 <picture> qui ne fonctionne pas si le code source est généré à la volée (ex. via du Javascript).

Pour ne pas briser le rendu des images de votre site web, n’oubliez pas de réaliser une sauvegarde préalable de votre bibliothèque de médias (fonction qui est d’ailleurs directement intégrée dans l’extension Imagify).

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.