Un des points clé pour améliorer la vitesse de chargement d’un site web est l’optimisation des images. En effet, la majeure partie des données qui sont téléchargées par les navigateurs des internautes sont justement des images. Il est donc très important d’optimiser au maximum ce type de fichier. Je vous ai déjà expliqué en détails les deux choses principales pour optimiser les images d’un site WordPress qui sont:

  1. Compresser les images pour diminuer leur poids
  2. Avoir des images responsive en fonction du type et de la taille d’écran

Dans cet article, on va s’intéresser principalement au 1er point (d’ailleurs je vous recommande de lire d’abord cet article avant de continuer ici) et à tous les plugins WordPress qui permettent de compresser des images… et donc de diminuer leur poids. Je vous en avait déjà présenté rapidement 2 plugins d’optimisation des images mais aujourd’hui on va aller beaucoup plus loin et comparer dans le détails les meilleurs plugins de compression d’images WP. Allez c’est parti!

Compresser ses images: quelques infos importantes

Si vous vous êtes déjà un peu renseigné sur ce sujet, vous savez peut-être que vous pouvez compresser vos images sans perte de qualité (“lossless” en anglais) ou avec perte de qualité (“lossy” en anglais). Si vous comprimez vos images uniquement sans perte de qualité, la gain en poids sera faible et donc l’amélioration en performance de votre site aussi. C’est pour ça que la norme en 2020 est d’optimiser ses images avec perte de qualité (lossy)… D’ailleurs si vous testez votre site avec un outils comme GT Metrix ou Google page speed, vous aurez des messages d’avertissement si vos images ne sont pas comprimées avec perte de qualité.

L’idée donc c’est de trouver le bon équilibre entre la qualité visuelle de vos images et leur poids (si vous êtes photographe, vous serez peut-être plus exigeant sur la qualité). Pour compresser vos images, les plugins WP d’optimisation d’images utilisent différents algorithmes afin d’optimiser la qualité des images tout en diminuant leur poids au maximum. En général, ces plugins vous permettent de choisir différents niveaux de compression allant de la meilleure qualité visuelle des images (mais avec un poids plus lourd) jusqu’à des images de moins bonne qualité mais beaucoup plus légères.

L’idée de cet article est donc de comparer le poids et la qualité visuelle de quelques images après avoir été comprimées avec différents plugins WordPress (et différents niveaux de compression). Évidemment, nous comparerons aussi le prix de ces plugins (car non, bien comprimer ses images n’est pas gratuit) ainsi que leur différentes fonctionnalités… Le but étant évidemment de trouver les meilleurs plugins WordPress d’optimisation d’images.

Comparaison des meilleurs plugins d’optimisation d’images pour WordPress

Attaquons tout de suite les choses sérieuses! Voici les différents plugins d’optimisation d’images que nous allons comparer:

Note: Il n’est pas facile de comparer les prix car certain plugins facturent par image optimisée et d’autres en poids d’images optimisées. De plus, à chaque fois que vous uploadez une image dans votre bibliothèque de média, WP va créer entre 6 et 15 images de tailles différentes (voir plus) en fonction de votre thème ou plugins.

 

Pluginsnbr d’installation WPEssai gratuitPrix
EWWW image optimizer800’000 +300 crédits gratuits en vous inscrivant ici (sans CB)0.002$ / image
Shortpixel200’000 +100 crédits gratuits par mois (sans CB)0.001$ / image (dégressif plus vous achetez d’images)
Imagify300’000 +25 Mb d’images gratuites par mois (sans CB)10$ pour 1Gb d’images (dégressif plus vous achetez de Gb)
Resmushit image optimizer100’000 +gratuitgratuit
WP Smush1 million +7 jours d’essai gratuit (avec CB)7$ par mois illimité
Tiny compress images200’000 +500 crédits gratuits par mois (sans CB)0.009$ par image après les 500 premières (0.002$ par image après 10’000)
Kraken40’000 +100 Mb d’images gratuites (sans CB)5$ par mois pour 500Mb (dégressif plus vous achetez de Gb)

Tous ces plugins peuvent être essayé gratuitement avec un quota plus ou moins généreux. Le seul plugin qui vous demandera votre carte CB pour une période d’essai de 7 jours est WP Smush (sans quoi vous n’aurez pas accès à la compression avec perte de qualité qui est le seul type de compression intéressant).

Concernant le prix, j’ai une grosse préférence pour les pricing à l’image plutôt qu’au poids. L’idée d’un plugin d’optimisation d’images est de vous permettre de mettre vos images dans votre bibliothèque de média directement après les avoir retouchée (ou depuis votre appareil photo) et sans avoir besoin de réfléchir à la compression. Par exemple il m’arrive fréquemment d’uploader des images qui font entre 5 et 10Mb et qui sortent directement de mon logiciel de retouche photo. Avec un pricing au poids d’image, je devrais d’abord faire attention à ne pas exporter des images trop lourdes pour ne pas exploser mon quota d’optimisation d’images WP.

Comparaison de la qualité visuelle et du poids des images après compression avec les différents plugins WP

Comme je vous le disait plus haut, l’idée est d’avoir le meilleur rapport qualité / poids d’image possible après compression. Pour qu’on puisse faire un comparaison visuelle, j’ai choisi 3 images différentes (2 images au format jpg et une image au format png) qui font 1600 pxs de large et qui ont déjà été optimisée sans perte de qualité (cad qui ne contiennent plus de métadonnées mais dont les pixels n’ont pas été modifiés).

Note: Un petit rappel important en fonction de si vous lisez cet article sur mobile, tablette ou desktop. Grâce aux attributs srcset et sizes, votre navigateur n’affiche pas la même image en fonction du type et de la taille de votre écran. Ainsi, si vous lisez cet article sur desktop, vous verrez soit l’image de 1600 pxs ou de 1024 pxs de large en fonction de votre navigateur. Si vous êtes sur tablette ou mobile, vous aurez plus de chance d’avoir soit l’image en 1024 pxs ou 768 pxs de large (voir 300pxs de large). C’est pour ça que dans la suite de l’article, je comparerai les différentes optimisations pour plusieurs tailles d’images.

Voici donc les 3 images originales sans perte de qualité:

compression image lossless jpg 1
image 1 au format jpg qui fait 435.3 kb pour 1600pxs de large
compression image lossless jpg 2
image 2 au format jpg qui fait 744.5kb pour 1600px de large
compression image lossless png
une image au format png qui fait 1.9 Mb pour 1600 pxs de large

Donc lorsque je met ces images dans ma bibliothèque de média sans plugin d’optimisation, voici quelques unes des différentes tailles d’images qui sont créées avec leurs poids. Nous allons utiliser ces différentes tailles pour comparer les niveau de compression des plugins.

Imagelargeur de l’image en pxspoids de l’image en Kb
Image jpg 1originale435.3 Kb
1536 pxs117.3 Kb
1024 pxs59.9 Kb
768 pxs36.8 Kb
300 pxs7.9 Kb
Image jpg 2originale744.5 Kb
1536 pxs212.7 Kb
1024 pxs104.5 Kb
768 pxs63 Kb
300 pxs13.2 Kb
Image pngoriginale1.9 Mb
1536 pxs1.9 Mb
1024 pxs929.1 Kb
768 pxs535.1 Kb
300 pxs87.4 Kb

Comparaison de l’image 1 au format JPG avec les différents plugins et types de compression

Pour la 1ère image, voici les résultats obtenu après optimisation avec les différents plugins WordPress.

Plugin et type de compressionlargeur en pxspoids de l’image en Kbréduction en %
EWWW (Pixel Perfect plus)originale429.81.26
1536106.98.87
102455.27.85
76833.88.15
3007.55.06
EWWW (Premium)originale148.565.89
153690.622.76
102446.522.37
76828.921.47
3006.418.99
EWWW (Premium plus)originale150.165.52
153693.120.63
102452.911.69
76830.417.39
3007.55.063
Shortpixel (Glossy)originale158.263.66
153690.422.93
102459.90
76833.88.15
3007.90
Shortpixel (Lossy)originale54.687.46
153648.758.48
102433.643.90
7682142.93
3004.937.97
Imagify (Aggressive)originale167.661.5
153663.645.78
102434.542.40
76821.641.30
3005.530.38
Imagify (Ultra)originale58.486.58
153635.269.99
102421.863.61
76817.751.90
3004.641.77
Resmushit (Regular = 92)originale251.842.15
1536109.56.65
102456.36.01
76834.85.43
3007.55.06
Resmushit (80)originale121.172.18
1536107.48.44
102455.27.85
76834.17.34
3007.37.59
Resmushit (70)originale90.879.14
153693.120.63
102447.520.70
76829.619.57
3006.418.99
WP Smush (Super smush)originale100.376.96
153695.218.84
102448.918.36
76830.417.39
3006.715.19
Tiny compress (default)originale150.165.52
1536101.113.81
102458.22.84
76832.312.23
3008.7-10.13
Kraken (Intelligent lossy)originale139.967.86
153610510.49
102454.29.52
76833.29.78
3006.912.66

Afin de pouvoir comparer visuellement, voici toutes les images comprimées dans une galerie:

 

Comparaison de l’image 2 au format JPG avec les différents plugins et types de compression

Pour la 2ème image, voici les résultats obtenu après optimisation avec les différents plugins WordPress.

Plugin et type de compressionlargeur de l’image en pxspoids de l’image en Kbréduction en %
EWWW (Pixel Perfect plus)originale739.40.69
1536200.85.6
102498.75.55
76859.75.24
30012.46.06
EWWW (Premium)originale305.259
1536172.618.85
102484.918.76
76851.218.73
30010.718.94
EWWW (Premium plus)originale220.970.33
1536143.832.4
102488.415.40
76850.719.52
30012.46.06
Shortpixel (Glossy)originale249.266.53
1536172.119.09
1024104.50
76859.75.24
30013.20
Shortpixel (Lossy)originale92.387.60
153673.165.63
102467.435.50
76841.134.76
3009.726.52
Imagify (Aggressive)originale391.747.39
1536157.326.05
102478.424.98
76847.624.44
30010.718.94
Imagify (Ultra)originale323.456.56
1536212.70
102461.641.05
768630
3009.230.30
Resmushit (Regular = 92)originale428.342.47
1536202.54.8
102499.54.78
76860.24.44
30012.64.55
Resmushit (80)originale237.768.07
15361986.91
102497.56.7
76858.96.51
30012.36.82
Resmushit (70)originale182.175.54
1536171.419.41
102484.419.23
7685119.05
30010.718.94
WP Smush (Super smush)originale206.772.24
1536180.315.23
102488.715.12
76853.614.92
30011.215.15
Tiny compress (default)originale220.970.33
1536149.629.67
102495.88.33
76854.313.81
30014.6-10.61
Kraken (Intelligent lossy)originale490.534.12
1536178.815.94
102489.913.97
76856.110.95
30011.99.85

Et pour comparer visuellement, voici à nouveau toutes les images comprimées dans une galerie:

 

Comparaison de l’image 3 au format PNG avec les différents plugins et types de compression

Pour la 3ème image, voici les résultats obtenu après optimisation avec les différents plugins WordPress. Comme c’est une image au format PNG, j’ai aussi ajouté dans la 1ère colonne si le plugin supporte la conversion automatique en JPG si l’image n’a pas de transparence (auquel cas le PNG est inutile, ce qui est le cas pour cette image). Pour cette image, le gain en poids est énorme si elle est convertie automatiquement en JPG:

Plugin et type de compressionlargeur de l’image en pxspoids de l’image en Kbréduction en %
EWWW (Pixel Perfect plus)
Conversion jpg auto : OUI
originale111.894.06
153699.494.85
102452.794.33
76833.993.66
3008.676.37
EWWW (Premium)
Conversion jpg auto : OUI
originale94.494.99
153684.595.62
102445.295.13
76829.594.49
3007.579.4
EWWW (Premium plus)
Conversion jpg auto : OUI
originale83.295.58
153674.696.13
102442.895.39
7682794.96
3008.676.37
Shortpixel (Glossy)
Conversion jpg auto : OUI
originale121.993.53
153685.695.56
102455.893.99
76833.793.70
3005.884.07
Shortpixel (Lossy)
Conversion jpg auto : OUI
originale45.597.58
153638.897.99
102428.796.91
76821.496
3005.884.071
Imagify (Aggressive)
Conversion jpg auto : NON
originale723.361.59
153619300
10249290
7685350
30036.40
Imagify (Ultra)
Conversion jpg auto : NON
originale426.477.36
153619300
10249290
7685350
30036.40
Resmushit (Regular = 92)
Conversion jpg auto : NON
originale667.864.54
1536594.669.19
1024274.770.43
768161.269.87
30029.319.51
Resmushit (80)
Conversion jpg auto : NON
originale667.864.54
1536594.669.19
1024274.770.43
768161.269.87
30029.319.51
Resmushit (70)
Conversion jpg auto : NON
originale667.864.54
1536594.669.19
1024274.770.43
768161.269.87
30029.319.51
WP Smush (Super smush)
Conversion jpg auto : NON
originale591.668.58
1536526.572.72
1024247.573.36
768145.672.79
30027.524.45
Tiny compress (default)
Conversion jpg auto : NON
originale533.871.65
1536468.875.71
102421776.64
768128.875.93
30024.931.59
Kraken (Intelligent lossy)
Conversion jpg auto : NON
originale536.771.5
1536473.775.46
1024220.576.26
768129.975.72
30025.928.85

Et pour comparer visuellement, voici encore toutes les images comprimées dans une galerie:

 

Classement des plugins WP en fonction du poids et de la qualité visuelle des images après compression

En me basant uniquement sur les 2 premières images (étant donné que tous les plugins ne convertissent pas automatiquement les png aux jpg lorsque c’est nécessaire), voici un petit classement des différents plugins et types de compression en fonction du % de réduction (moyenne des tailles sur les images 1 et 2) et de la qualité visuelle. Évidemment le classement de la qualité visuelle est subjectif et n’est que mon opinion.

PLugins et types de compressionClassement compressionClassement qualité visuelle
EWWW (Pixel Perfect plus)13 (5.4 %)1
EWWW (Premium)5 (28.6 %)7
EWWW (Premium plus)7 (26.4 %)5
Shortpixel (Glossy)11 (18.6 %)3
Shortpixel (Lossy)1 (52.1 %)13
Imagify (Aggressive)3 (36.3 %)6
Imagify (Ultra)2 (44.2 %)12
Resmushit (Regular = 92)11 (12.6 %)2
Resmushit (80)8 (19.8 %)10
Resmushit (70)4 (31.12%)11
WP Smush (Super smush)6 (27.9 %)9
Tiny compress (default)9 (19.6 %)8
Kraken (Intelligent lossy)10 (19.5 %)4

Fonctionnalités supplémentaires des plugins WP de compression d’images

Pour l’instant nous n’avons comparé que l’efficacité de la compression d’image de ces différents plugins WP (c’est le point qui est évidemment le plus important). Mais certain de ces plugins ont évidemment plus de fonctionnalités que d’autres (on l’a déjà bien remarqué rien qu’avec la conversion de png à jpg lorsque c’est nécessaire). Voici une petite liste de fonctionnalités supplémentaires qui pourraient vous être utiles en fonction de vos besoins:

  • La conversion au format WEBP: WEBP est un nouveau format d’images pour le web qui est sensé produire des images au moins 20% plus légères à qualité égale (par rapport aux JPG et PNG). Ce format est supporté par la plupart des navigateurs modernes et pourrait devenir le format de préférence pour les images sur le web. Je ne suis pas encore passé à ce format mais le moment venu, je pourrais le faire facilement avec un de ces plugins wp.
  • Dossiers spéciaux: En général, toutes vos images sont stockée dans le dossiers uploads de WordPress. Mais parfois, certains plugins ou autres les sauvent ailleurs. Dans ces cas précis, il peut être utile de pouvoir définir d’autres dossiers pour optimiser les images qui s’y trouvent.
  • Images responsive et CDN: Comme je vous l’indiquait au début de l’article, le 2ème point important quand on parle d’images sous WordPress, c’est de faire en sorte que la bonne image soit utilisée en fonction de la taille et du type d’écran (le viewport). Pour ce faire, il faut que votre thème mette en place correctement les attributs srcset et sizes (plus de détails dans cet article). Mais comme beaucoup de thème WP ne le font pas, certain de ces plugins proposent une solution intéressante. Vos images sont optimisée et desservies depuis les serveurs de l’outil et surtout à la bonne taille en fonction du viewport de l’internaute qui les demandent. Ces solutions sont en générale plus chères et demanderaient à être testées séparément et comparées à d’autres offres de type CDNs plus généraux.
  • Exclure certaines tailles d’images: Certains thèmes WP créent parfois jusqu’à 15-20 tailles d’images différentes… Souvent, beaucoup de ces tailles d’images sont créées pour des chose très spécifiques que vous n’utilisez pas forcément sur votre site (portfolio, produits woocommerce etc…). Il peut donc être très utile de désactiver la création et/ou l’optimisation de certaines tailles d’images pour économiser de l’espace sur votre serveur et de l’argent (puisque bien optimiser les images n’est pas gratuit).
PluginsConversion WEBPDossiers spéciauxImages responsive / CDNTailles d’images
EWWW image optimizerOUIOUIOUIOUI (optimisation et/ou création)
ShortpixelOUIOUIOUI (en installant un autre plugin)OUI (seulement l’optimisation)
ImagifyOUIOUINONOUI (seulement l’optimisation)
Resmushit image optimizerNONNONNONNON
WP SmushOUIOUIOUINON
Tiny compress imagesNONNONNONOUI (seulement l’optimisation)
KrakenNONNONNONOUI (seulement l’optimisation)

Conclusions et meilleurs plugins d’optimisation d’images WordPress

Pour conclure, je dirais qu’il faut différencier 2 types d’utilisateurs:

  1. Les personnes qui veulent réduire un maximum le poids des images sans trop se soucier de la perte de qualité
  2. Les gens qui veulent le meilleur rapport poids / qualité d’image (dont je fais partie)

Pour les personnes de la 1ère catégorie, je dirais que rien ne bat le plugin Shorpixel et sa compression “lossy”. C’est la compression qui crée les images les plus légères (mais aussi celles de moins bonne qualité à mes yeux) et Shorpixel est aussi le plugin le moins cher de tous (et aussi l’un des plus complet en terme de fonctionnalités). Les deux compressions du plugins Imagify sont aussi intéressantes mais le pricing au poids d’images optimisées me paraît beaucoup moins avantageux que le prix à l’image (à moins que vous ne réduisiez vos images avant de les optimiser, mais ce n’est pas très logique).

Voir le plugin Shortpixel

 

ewww image optimizerEn ce qui me concerne, je fais partie de la 2ème catégorie de personnes et je recherche à avoir le meilleurs rapport poids / qualité d’images. J’ai donc éliminé directement la compression lossy de Shorpixel, Imagify ultra ainsi que resmushit 80 et 70 pour leur qualité d’image trop dégradante à mon goût. Viennent ensuite (par rapport au % de compression) la compression Imagify aggressive et les compressions Premium et Premium plus de EWWW image optimizer. Parce que de mon point de vue le pricing de EWWW est plus avantageux que celui de Imagify et parce que EWWW est le plugins qui a de loin le plus de fonctionnalités (toutes n’ont pas été listées ci-dessus), c’est celui que j’ai choisi d’utiliser sur tous mes sites. Mais si Shortpixel venait à intégrer une compression intermédiaire entre ses algorithmes lossy et glossy, ça pourrait peut-être me faire changer d’avis.

Voir le plugin EWWW image optimizer

 

Même si optimiser ses images WP n’est pas très cher (on doit payer avec EWWW 2$/mois pour nos 2 sites), si vous n’avez pas de budget pour ça, alors la meilleure solution gratuite reste encore d’utiliser le plugin Resmushit avec une qualité d’image qui se situe entre 70 et 80 je dirais.

 

Voilà c’est tout pour cette comparaison détaillée des meilleurs plugins d’optimisation d’images WP. En faisant mes propres recherches, je n’avais pas trouvé d’infos sur le net comparant précisément ces différents outils. J’espère donc que mon article vous sera utile et n’hésitez surtout pas à me poser vos questions en commentaires (et à partager l’article si vous l’avez trouvé utile 😉 )

 

Épingler sur Pinterest

Note: Cet article contient des liens affiliés pour les plugins d’optimisation d’images que je recommande. Si vous souscrivez à un de ces plugins, nous toucherons un petite commission et vous ne paierez pas un centime de plus. De cette façon, vous nous soutiendrez dans la création de ce genre d’articles gratuits et indépendants.

Benoit Luisier

Développeur Web autodidacte et passionné de voyage, je partage avec vous sur Novo-Media mes conseils et astuces sur les côtés plus "techniques" de thématiques comme le développement web, Wordpress, l'optimisation ou encore le SEO. Je suis également le créateur du plugin wordpress de cartographie Novo-Map.

Newsletter: Nos derniers articles dans votre boîte mail

Rejoignez la communauté maintenant et recevez tous nos articles directement dans votre boîte mail! 0% Spam garanti !

Interactions du lecteur

Commentaires

  1. Romain dit

    Salut,

    Beau comparatif, tu n’as pas inclus Optimole, volontaire ou ? Perso j’utilise Imagify depuis pas mal d’années, je trouve que le rapport, compression/rendu est plutôt pas mal, même s’il est vrai qu’utilisant pas mal d’images sur mon site, cela porte un coût non négligeable…

    • Benoit Luisier dit

      Hello Romain,

      Oui le rapport compression / qualité visuelle de Imagify est assez bon mais je n’aime pas du tout leur pricing. Ca me revient bien moins cher d’utiliser EWWW à qualité visuelle égale (à mon avis). EWWW a aussi plus d’options ce qui est un plus appréciable pour moi.

      Et pour Optimole, le prix est tellement cher que je ne l’ai même pas considéré… Ça n’en vaut vraiment pas le coup je pense. Pour moins cher tu peux avoir une offre CDN complète qui optimise tes images et héberge tous les fichiers de ton site sur un réseau de serveurs partout dans le monde… par exemple bunnycdn qui est pas mal –> https://bunnycdn.com/solutions/bunny-optimizer.

  2. Romain dit

    Je vois pour Optimole, et je suis pas vraiment surpris. Pour Imagify, une des raisons que je l’utilise, c’est que j’ai WP Rocket, de la même team, je trouve donc complémentaire d’avoir des plugins codé de la même manière. Je jette un oeil au lien de ce pas. Merci !

Laisser un commentaire

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


Protected by reCAPTCHA / Privacy Policy - Terms of Service