Optimiser le poids des images

Source

Designers Ethiques - 6.1. Les images - Mettre en application les bonnes pratiques

Comprendre

 Les images sont le type de ressources le plus utilisé sur le web d’après le rapport des archives http (Report : Page Weight et Report : State of Images). Le poids d’une page moyenne sur desktop était de 2174 Ko sur l’échantillon testé en janvier 2022, et le poids moyen des images transférées pour une page était de 958 Ko. Les images représentent ainsi en moyenne 44% du poids d'une page web en 2022 !

Les photos et images que nous utilisons sont très souvent surdimensionnées. Une photo non redimensionnée, par exemple, a souvent une taille entre 2000 et 4000 pixels de largeur. C'est inutile car elle sera affichée sur une page web sur desktop à environ 700 ou 800 pixels de largeur. Non seulement l’image sera trop lourde, mais le navigateur fera un effort de calcul pour redimensionner l’image.

Il est donc important de les redimensionner !

Mise en œuvre

Pour réduire le poids des images, vous pouvez utiliser les outils suivants :

Choisir le bon format :

  • Pour les photos, utilisez le format .jpeg ou .webp.
  • Pour les images, Préférez les formats vectoriels comme .svg au format .png lorsque cela est possible

Exemple

Image avant optimisation de son poids 

Exportation dans le logiciel et réduction de 84% du poids de l'image.

Après import d'une image dans tiny jpg, on peut observer une réduction considérable de son poids sans forcément altérer la qualité de l'image. 

Image après optimisation de son poids 

Image-compréssée