Alléger une galerie de photos

Publier une galerie d’images sur votre site est toujours intéressant, mais votre page doit rester fluide. Si votre page est “trop lourde”, elle mettra du temps à s’afficher et ne sera pas visitée.

Pour gagner en fluidité, il va falloir réduire le “poids” de vos images. Il nous faudra donc intervenir sur 2 facteurs :

• la dimension de l’image ;
• sa compression en jpg.

Ne modifiez pas la résolution, elle n’intervient en aucun cas sur le poids de l’image. Elle n’influence que sur l’impression de l’image. La résolution sera déterminée par votre écran.
La seule caractéristique intrinsèque d’une image est sa définition, c’est-à-dire son nombre de pixels. Sa résolution n’est qu’un paramètre additionnel qui peut être modifié sans rééchantillonnage, donc sans impact sur sa définition.
Une image 720×480 px en 72 dpi s’affiche sur un écran donné exactement de la même manière qu’une image 720×480 px en 300 dpi. Il est donc parfaitement inutile de changer la résolution de son image sans rééchantillonnage.

Pour effectuer ces manipulations, nous allons utiliser Gimp : un logiciel de traitement d’images (comme Photoshop) mais libre, gratuit et multi-plateforme (Windows, Mac, Linux).

Au boulot

Avec GIMP, ouvrons une image (clavier.jpg) qui a pour dimensions 1280x753 px. Elle pèse 762 ko.
Modifions ses dimensions : une largeur de 800 px, la hauteur s’adaptera automatiquement à 533 px afin de garder les proportions. Choisissons “mise à l’échelle”.

Exportons notre nouvelle image (fichier -> exporter vers…) et choisissons un nouveau nom pour ne pas écraser l’original.
Réglons la qualité (qui correspond à la compression) à 80% qui est largement suffisante pour l’affichage d’une page Web et qui allègera la photo.
Notre nouveau fichier pèse alors 96 ko. Quelle économie ! Elle ne représente que 12% du poids initial et pourtant à l’écran, vous aurez du mal à voir la différence.

Voyons le résultat

Les 4 images sont affichées à 100%. Il est impossible de voir la différence de qualité entre ces photos. Or, leur poids est très différent.

Conclusion

Cette règle est également valable pour les images stockées sur votre ordinateur (si vous voulez uniquement les visionner sur votre écran).
L’économie d’espace est appréciable : sur 1 Go, vous pourrez stocker environ 10 000 images en 800x600 px (d’une qualité de 80%) au lieu de 1 300 si vous les gardez dans leur format originel de 1280 px (cette dimension est souvent encore plus grande sur les smartphones et les images peuvent alors peser plusieurs Mo).