Nous savons tous que l’optimisation des images est primordiale, car sans optimisation elles ralentissent énormément la vitesse de chargement de votre site, ce qui va impacter négativement votre référencement. Aujourd’hui je vais vous montrer comme utiliser les images WebP sur wordpress et augmenter ainsi la performance de votre site.
C’est quoi une image WebP ?
WebP est un nouveau format d’images développé par Google, permettant de réduite significativement la taille d’une image pour une qualité similaire à l’image existante.
Quand il s’agit d’utilisation d’images sur le web, certains formats sont souvent utilisés comme les formats JPEG, JPG, PNG et GIF ; chacun de ces derniers a des usages préférentiels, ainsi que des avantages et des inconvénients.
Dans l’objectif de contourner les inconvénients des anciens format utilisés pour le web, L’équipe de performance web chez Google a créé un nouveau format d’image appelé « .WEBP », afin d’obtenir des images de petite taille s’affichant rapidement, avec une qualité similaire aux images originales.
Ce format doit son succès aux deux types de compression « lossy » et « lossless », le premier type « lossy » est un algorithme de compressions avec perte de données mais dont l’avantage est la réduction de la taille de l’image, le deuxième type « lossless » est aussi un algorithme de compression mais sans perte de données c.à.d avec préservation de la qualité. le format WebP combine les avantages de ces deux types de compression pour obtenir des images de qualité similaire mais de plus petite taille.
Le format de mes images, Impacte-t-il les performances de mon site ?
En faisant une petite analyse sur l’outil PageSpeed Insights , vous allez très probablement tomber sur cette suggestion « Diffusez des images au formats nouvelle génération », comme vous voyez sur cette capture.
ce message vous a été affiché parce que vous utilisez un format d’image qui ralentit l’affichage de votre site et par conséquent diminue sa performance.
Pour corriger ça, il faut utiliser des images qui proposent une meilleure compression que les images JPEG et PNG comme le format « WEBP » qui vous permet de créer des images destinées au web ; ainsi vous allez augmenter la vitesse d’affichage de votre site; et améliorer sa performance.
WebP ; est-il supporté par les navigateurs ?
D’après caniuse, la plupart des navigateurs supporte le format « WEBP », soit un taux de support global de 81.39%.
Au moment de la rédaction de cet article ; les navigateurs Edge, Firefox, Chrome, Opera supportent ce nouveau format « WEBP » ; si vous voulez vérifier le support de votre version de navigateur visitez le site caniuse.
Comment utiliser les images WebP sur WordPress
En tant qu’utilisateur wordpress, vous vous demandez surement comment faire pour utiliser des images « WEBP » sur votre site.
Malhereusement, wordpress ne supporte pas les images WebP par défaut, et si vous essayerez d’ajouter une image WebP dans votre article vous allez voir ce message.
Mais (heureusement qu’il y’a un mais) ils existent des plugins (heureusement aussi que les plugins existent), qui vous permetent de convertir vos images au format « WebP » afin de les afficher sur les navigateurs de vos visiteurs.
Parmi ces plugins, nous citons :
ShortPixel Image Optimizer
Short Pixel est un plugin wordpress d’optimisation d’images très efficace et populaire, avec plus de 100.000 installations actives shortPixel est un très bon pour ceux qui tiennent à ce que leurs sites se chargent rapidement.
ShortPixel optimise et compresse vos images et fichiers PDF, pas uniquement ça, il en fait de même avec chaque nouvelle image ajoutée à votre site.
Il suffit juste de l’installer, le configurer, puis l’oublier … il fera son travail discrètement alors que vous bossez sur vos articles.
ShortPixel existe en deux version, gratuite et payante, certains parmi vous peuvent se contenter de la version gratuite, car elle permet d’ajouter 100 images par mois.
Pour des blogs plus gourmands, vous avez 3 plans payants (SHORT, LARGE, XXL) et dont les prix sont très abordables.
J’ai rédigé un article détaillé sur ShortPixel, si vous voulez en savoir plus Cliquez ici.
WebP Express
WebP Express est un plugin gratuit qui vous permet d’utiliser des images au format « WEBP » sur votre site wordpress ; il suffit juste de l’installer et le configurer et tour est joué.
Vous pouvez appliquer la conversion au format « WEBP » sur les images ajoutées, les images du thème, ou même tout le contenu de votre site ; comme vous pouvez convertir toutes les images déjà existantes sur votre site en un seul clic.
WordPress Cache Enabler & Optimus Image Optimizer
Pour utiliser les images « WEBP » sur votre site, ces deux plugins doivent fonctionner en semble, vous allez voir pourquoi dans ce qui suit.
WordPress cache enabler est une extension de mise en cache, qui vous permet d’envoyer des images au format « WEBP » et de les afficher aux navigateurs de vos visiteurs qui supportent ce format.
Optimus image optimiser est une extension qui vous permet de convertir vos images au format « WEBP »; et elle existe en version gratuite et payante.
Quand je vous ai dit que ces deux plugins fonctionnent ensemble, c.à.d qu’ils se complètent, parce que dans un premier temps, Optimus image optimizer va automatiquement créer une version « WEBP » de vos images et les sauvegarde dans votre bibliothèque de médias.
Puis WordPress cache enabler détermine quelle version d’image faut-il envoyer, en fonction de support ou non des navigateurs des visiteurs ; si ce dernier supporte les images du format « WEBP » le plugin va envoyer la version « WEBP » déjà sauvegardée ; sinon il va envoyer la version originale PNG ou JPG par exemple.
Malheureusement la version gratuite d’Optimus ne permet pas de compresser vos images et de les convertir en WEBP, vous obligeant ainsi à s’abonner au plan OPTIMUS HQ ou OPTIMUS HQ PRO à 29 et 149 USD par an respectivement.
Visiter WordPress Cache enabler
Visiter Optimus Image Optimizer
Enfin, parce qu’on parle d’images, je vous invite à découvrir ma sélection de banques d’images libres de droits.
Si cet article vous a été utile n’hésitez pas à le partager avec vos amis et à vous inscrire à notre newsletter pour recevoir tous nos articles … et laissez nous vos avis dans les commentaires.
