Optimisez vos images pour accélérer WordPress

WordPress est lent? Optimisez vos images pour booster le temps de chargement de votre site. Bonnes pratiques et test du plugin Imagify.

Saviez-vous que les éléments qui sont les plus longs et lourds à charger sur une page ne sont ni vos fichiers CSS ni vos javascripts, mais bien vos fichiers images?

Il en existe de toutes dimensions, de tous poids, de toutes résolutions, de tous formats. Mais sur le web, mieux vaut ne pas laisser la place au hasard quand on parle d’optimisation d’images. Objectif? Booster le temps de chargement de votre site WordPress.

Les bonnes pratiques d’optimisation d’images pour le web

L’idéal est de ne jamais dépasser les 200ko pour les images destinées à être publiées sur le web. En pratique, optez pour du JPEG 80%. Et si vous enregistrez vos images en PNG, préférez le PNG 8 au PNG 24.

Le format JPEG est adapté pour des photos ou des images plus complexes au niveau des nuances de couleurs, tandis que le PNG est à privilégier pour des schémas, des logos et des images simples ou dotées de transparence.

En termes de dimensions, ne vous prenez pas trop la tête et respectez les standards et les ratios recommandés. Le plus important est de prévoir différentes dimensions en fonction du contexte d’affichage: des formats thumbnail, medium et large sont généralement suffisants. Veillez à les spécifier dans l’interface WordPress. Vous pouvez également ajouter des tailles d’images personnalisées dans le fichier functions.php de votre thème avec la fonction add_image_size:

add_image_size( ‘custom-size’, 220, 180 ); 
// 220 pixels wide by 180 pixels tall, soft proportional crop mode

add_image_size( ‘custom-size’, 220, 180, true ); // hard crop mode

add_image_size( ‘custom-size’, 220, 220, array( ‘left’, ‘top’ ) );
// Hard crop left top

 

Niveau résolution, les écrans d’ordinateur ne dépassent pas le 72 dpi, rien ne sert donc d’aller au-delà pour vos images: une image en 300 dpi ne s’affichera pas mieux, mais elle ralentira à coup sûr le temps de chargement de votre page.

Le plugin WordPress Imagify pour compresser ses images

Pour éviter trop de manipulations avec votre logiciel de traitement d’images, la solution sous WordPress c’est Imagify: un service SaaS de la suite WP Rocket, spécialisé en accélération de sites WordPress. Vous pouvez l’utiliser de manière autonome ou l’intégrer via le plugin dédié, Imagify Image Optimizer.

Une extension qui a l’avantage d’automatiser le processus et de compresser à la volée toutes les images que vous chargez sur votre site WordPress. Grâce à la fonction d’optimisation en masse, vous pouvez également traiter rétroactivement toutes les images déjà chargées sur votre site.

Trois puissances de compression s’offrent à vous: mode normal, agressif ou ultra, ce dernier pouvant compresser vos images jusqu’à 50%. C’est ce qu’on appelle “imagifier” ses images!

Imagify Image Optimizer est gratuit jusqu’à 25Mo, ce qui est suffisant pour un petit blog. Si vos besoins excèdent cette limitation, vous avez le choix entre plusieurs offres allant de 5 (1GO) à 70 euros par mois (50GO). Vous pouvez également acheter des crédits si vous ne souhaitez pas souscrire à une formule d’abonnement.

Autres plugins de compression d’images  intéressants: WP Smush Pro et ShortPixel Image Optimizer

Et vous, avez-vous déjà intégré une solution de compression d’images pour votre site? Imagify, ça vous dit? Vous connaissez déjà?