Comment Optimiser des images et accélerer votre site WordPress

Commentaire

Pourquoi Optimiser Des Images ?

Optimiser des images de son site est primordial puisque les images sont un des éléments essentiels au design d’un site web.

Elles attirent l’attention des visiteurs, permettent de présenter facilement une idée et influencent grandement un point de vue sans avoir à rédiger la moindre parcelle de texte.

Cependant, ajouter des images de bonne qualité, donc de haute résolution, nécessite d’utiliser des fichiers de grande taille.

Le poids de ce genre d’images ne fait que diminuer la vitesse de votre site et diminue en conséquence la qualité d’affichage de vos pages.

Et en sachant que la vitesse d’un site est l’un des critères primordiaux à son référencement :

il devient nécessaire de trouver un équilibre entre l’utilisation de bonnes images tout en préservant la vitesse de votre site.

Cet équilibre est possible grâce à la compression des images qui a pour but d’alléger les fichiers et de décroître leurs poids.

Cet article vous montre les méthodes à utiliser pour réaliser cette tâche et optimiser des images à utiliser dans un site WordPress.

Comprendre Le Poids D’une Image

Pour commencer, vous devez comprendre que le poids d’une image est en relation directe avec sa résolution.

Ce qui veut dire qu’une image de très bonne qualité à forcément un poids plus élevé qu’une image de basse résolution.

Vous pouvez le constater lorsque vous importer des images dans WordPress et cela grâce à l’interface de votre bibliothèque qui vous permet de connaître exactement le poids de chaque fichier :

Comme vous le voyez la 1ère image a un poids de 23 Kilo octets tandis que la 2ème a un poids de 231 Kilo octets ce qui est encombrant pour une image.

Il est donc logique d’avoir des images de moindre qualité avec un poids négligeable et vice versas.

L’idéal serait de trouver un équilibre entre qualité et poids pour optimiser au maximum la vitesse de votre site.

Comment optimiser des images ?

1.Choisir les bonnes images 

Tout d’abord le choix des images est primordial. Il est très important de savoir choisir le format adéquat pour chaque type de fichiers.

Les images JPG et PNG sont les 2 meilleurs choix proposés.

Les images JPG sont idéales pour les motifs et couleurs à haute résolution.

Le format PNG supporte des qualités basses avec moins de couleurs et moins de détails.

Pour des explications plus poussées lisez notre article « Comment utiliser les images » .

Le choix se porte aussi sur la résolution des images et sur leurs dimensions : il est préférable d’utiliser des images qui ne sont pas imposantes.

Le mot « imposant » dans ce cas fait allusion à 3 aspects :

  • Des images à grandes dimensions envahissent l’espace réservé à d’autres images ou à du texte ce qui donne à l’aspect général de la page un certain « désordre » .
  • Le poids des grandes images est toujours important.
  • La plupart des thèmes utilisés par WordPress nécessite des images de même taille qui sont en général de taille moyenne, comme par exemple pour un diaporama ou une extension utilisant plusieurs images à la fois.

2.Compresser vos images avant de les ajouter à votre bibliothèque 

Il existe plusieurs outils capables de réaliser cette tâche, mais le taux de compression diffère selon l’utilisation et selon l’image.

Néanmoins, le but étant de bien équilibrer compression et qualité, qui sont les 2 facteurs principaux pour optimiser des images, il est très facile de choisir quel outil utiliser après en avoir testé la plupart.

Utiliser Des Logiciels Spécialisés

La majorité des éditeurs graphiques intègre un outil de compression d’images pour le web.

Parmi tous ces éditeurs, 2 sortent du lot de par leur taux de compression et par leur simplicité d’utilisation :

  • The Gimp : The Gimp est très efficace et son taux de compression est nettement le meilleur parmi tous les éditeurs spécialisés.

Utiliser des Compresseurs D’Images En Ligne

Pour ceux qui ne veulent pas utiliser ces logiciels mais optent plutôt pour des outils en lignes, voici les meilleurs :

Convert image :

poids image 4

Image optimizer:

poids image 5

Kraken :

poids image 6

Tinypng :

poids image 7

3.Compresser vos images après les avoir ajouter à la bibliothèque 

Une fois les images compressées ajoutées dans votre bibliothèque WordPress il est possible d’effectuer une 2ème compression grâce à des extensions comme WP smush it qui est l’extension à installer pour complètement optimiser des images :

poids image 8

Il existe bien sûr une multitude de Plugin capable de compresser des images :

EWWW Image Optimizer

Imsanity

Kraken.Io

Tester chacune es extensions et évaluer le taux de compression et son impact sur la vitesse de votre site pour vous fixer.

4. Référencez convenablement vos images pour les optimiser dans les moteurs de recherche 

Il est indispensable de bien fournir les informations relatives à chaque image pour un meilleur référencement et une meilleure indexation.

Dans WordPress, lorsque vous accédez à une image de la bibliothèque, remplissez les champs adéquats comme le montre l’image ci-dessous :

 poids image 9

5.Utilisez des extensions de gestion de pages 

Ces extensions ont l’avantage de charger les images d’une page à la demande.

En d’autres termes, l’image ne s’affiche que lorsqu’on y arrive et non en même temps que la page.

Il existe plusieurs extensions de ce genre comme Page builder ou encore Lazy load.

6.Utilisez un CDN (Content Delivery Network) 

Cette technique permet de fournir les ressources que présente votre site (images, vidéos ou autres) en passant par le serveur le plus proche du visiteur.

Par exemple, si un visiteur qui réside au Canada clique sur une image, le service CDN traite cette requête par le plus proche « serveur » du « Canada » .

Ce service est très pratique mais il reste payant et n’est disponible que par quelques hébergeurs.

7. Comment connaitre les images à optimiser sur votre site ?

Il existe plusieurs services capable de mesurer la vitesse de votre site et de déterminer les lacunes à palier.

Ces lacunes incluent les images qui ralentissent votre site et qui nécessitent une compression

Le service Google pagespeed insights est le service le plus fiable pour tester la vitesse de votre site, en plus il vous fournit les ressources optimisées.

En plus d’être gratuit (comme la plupart des services Google), il vous donne en guise de résultat les causes d’une vitesse réduite dont les images à optimiser :

optimiser des images

GTMetrix est lui aussi très performant et vous donne aussi un aperçu complet des images non compressées de votre site.

Conclusion

Optimiser des images pour votre site est un aspect très important qui peut vraiment créer une différence prise en compte par Google.

Il faut vraiment être conscient de l’impact que peut avoir quelques améliorations concernant les images que vous utilisez sur la vitesse de votre site.


Tanguy Bianay

Auteur

Tanguy Bianay

Je suis devenu un mordu de technologie et un passionné de l’informatique dès mes 12 ans. J’ai commencé à bidouiller et à vouloir comprendre ce vaste univers en évoluant très rapidement. Et en seulement peu de temps, on me considérait comme l’expert à appeler en cas de pépin. Et pour couronner le tout, je me suis spécialisé en programmation et en développement Web !

Vous Pensez Quoi De Cet Article?