Les sites web, les échanges au travers des réseaux sociaux ou tout simplement par mails, contiennent de nombreuses images. Quand l’objectif est de présenter des images de bonne qualité tout en respectant la performance de la navigation pour les utilisateurs, le choix de leur format devient un sujet délicat et se doit d’être le résultat d’une équation délicate.

Les formats en présence

Traditionnellement, le plus connu est le format JPEG ou JPG, ou plus récemment le PNG. Ce sont les 2 choix les plus classiques.

Le JPEG permet de jongler avec la compression, quitte à perdre en qualité, tandis que le PNG gère la transparence et dispose d’une compression non destructive plus efficace. Nous reviendrons plus loin sur les possibilités de compression. Il est à noter que Google propose un format alternatif nommé WEBP qui combine les possibilités du JPEG et celles du PNG.

Dans de nombreux cas, le SVG est un format alternatif bien plus efficace car vectoriel, mais limité aux images géométriques pour présenter un intérêt réel en termes de gain de place.

Mais au fait, c’est quoi une image ?

A l’exception du SVG, une image est un ensemble de points, stockés chacun sur 1bit pour une image en noir et blanc, et jusqu’à 32bits pour 4 milliards de couleurs.

Entre ces 2 extrêmes, le format va s’adapter : nous avons tous des écrans couleurs mais 4 milliards est totalement inutile, car aucun œil humain ne peut les percevoir (on estime le nombre de couleurs distinguées par l’homme à 2 millions).
Qui plus est, aucune image ne comporte 2 millions de couleurs. L’image va donc énumérer les différentes couleurs pour créer une palette des couleurs utilisées et ainsi stocker chaque point dans un espace plus raisonnable, usuellement entre 16 et 24 bits.

Mais même comme cela, une image HD classique représente 4 Mo de données donc on peut chercher à gagner un peu de place.

Comprimer les images

Pour ce faire il y a 2 grandes stratégies :

La compression destructive, qui fait l’impasse sur certains pixels, ou qui approxime certaines couleurs pour minimiser la palette ou augmenter la fréquence d’une couleur donnée. L’image peut alors se trouver fortement réduite, mais en fonction du taux de compression elle sera de moins en moins fidèle.

Partons d’une photo originale d’un poids de 41KO :

Une compression JPEG extrême l’amène à 1.5KO, au prix d’une forte dégradation de la qualité :

L’alternative étant d’utiliser des formats de compression non destructifs qui vont calculer la répétition des motifs : par exemple une ligne de 1000 pixels blancs pourra se compresser en indiquant « point blanc répété 1000 fois » plutôt que « point blanc, point blanc … » le tout 1000 fois.

C’est ainsi que le PNG amène l’image à 33 ko :

Ou bien le WEBP qui lui, crée une image de 19Ko sans perte de qualité :

Pourquoi compresser des images ?

Dans un monde où l’on nous vend des téléphones de 6 pouces avec des écrans 4K et « la fibre à la vitesse de la lumière », les images sont de plus en plus imposantes.
Mais on comprend tous que plus la taille est grande, plus l’est aussi l’énergie nécessaire pour le transport et le stockage. Donc, si pour finir une telle qualité est inutile, voilà de quoi réveiller notre conscience écologique quant à l’énergie gaspillée.
Dans le même ordre d’idée, une page web va télécharger une image depuis le serveur dans la taille où celui-ci l’a stockée, et l’afficher dans une taille qu’elle gère et qui peut être infiniment plus petite. La page téléchargera donc une image de grande taille pour l’afficher dans un format réduit, ce qui encore une fois ne présente pas d’intérêt.

Adapter la taille pour stocker et publier les images

Même si aujourd’hui, ce n’est pas à la portée de tous, adapter la taille des images à l’usage qui en sera fait est clairement un devoir, c’est tout autant se prémunir des problèmes techniques qu’éviter de contribuer à l’engorgement d’internet.

Et puis pensez que vous ne perdrez plus en route les utilisateurs qui n’ont pas la nostalgie de l’apparition du visage du président élu le 10 mai 1981, digne d’une animation pilotée par un modem a 14Kb ou d’une image 8K sur une connexion 4G poussive.

 

Olivier Piochaud, Président Directeur Général d’Apsynet

 

 

Newsletter

Categories: Développement & Web