1

La compression d’images : notions de base

Alain Large, documentaliste, lycée Félix Eboué, Cayenne

Les images présentes sur le web sont compressées afin de réduire leur « poids » en terme d’octets, donc leur temps de téléchargement. N’oublions pas en effet que tout le monde n’a pas l’adsl et que ceux qui l’ont doivent parfois partager leur bande passante. Enfin, la place sur les serveurs, aussi grande soit-elle, est limitée. Nous parlerons ici d’images matricielles (appelées aussi images bitmap, mais cette appellation porte à confusion car le mot bitmap peut aussi désigner un format de fichier codé sur 1 bit, cf. infra) c'est-à-dire composées de points (appelés pixels = picture element) disposés sur une grille composant une matrice de points. Points et pixels sont synonymes. Il existe une autre catégorie d’images dites vectorielles , dont nous ne parlerons pas ici. Le poids d’une image matricielle non compressée dépend :

1. Du nombre de pixels qui la composent. Un pixel est la plus petite unité de surface d’une image. Chaque pixel est codé sur 1 octet (= 8 bits) dans le cas d’une image comportant au moins 256 nuances, car 28 = 256.

Explication : Une image comportant deux couleurs (du noir et du blanc, image dite bitmap, d’où l’ambiguïté de ce terme), sera codée sur 1 bit (binary digit) par pixel car 1 bit peut prendre 2 valeurs, notées symboliquement 0 et 1. Deux bits permettront de coder 22 couleurs = 4 couleurs Trois bits : 23 = 8 couleurs Quatre bits : 24 = 16 couleurs … Huit bits (un octet) : 28 = 256 couleurs (plus précisément 256 nuances de gris. Voir plus bas).

- Les images produites par les appareils photo numériques sont généralement stockées sur les cartes mémoires au format JPEG, un format de compression de données que nous étudierons plus loin. Leur dimension (exprimée en nombre de pixels en largeur x nombre de pixels en hauteur) dépend de l’appareil et, sur ceux qui permettent de choisir entre plusieurs dimensions, du choix de l’utilisateur.

Par exemple une image dite en 7 millions de pixels fait 3072 x 2304 pixels, c'est-à-dire exactement 7 077 888 de pixels. - Dans le cas des images scannées , l’utilisateur doit, au moment du scan, choisir la résolution de l’image, exprimée en nombre de points par unité de longueur : x points par pouce (ppp , en Anglais dot per inch = dpi ) ou x points par centimètre .

La résolution est le plus souvent exprimée en points par pouce, car c’est l’unité utilisée traditionnellement par les imprimeurs et les photograveurs.

Il va de soi que plus la résolution choisie sera élevée, plus l’image comportera de points pour une dimension donnée, et plus lourd sera le fichier. Ex. : une image A4 fait 21 x 29,7 cm, soit environ 8,4 x 11,88 pouces = 99,79 pouces carrés. Scannée à 72 dpi, elle comportera 72 x 72 x 99,79 = 517 310 points (en valeur arrondie). A 200 dpi, 200 x 200 x 99,79 = 3 991 600 points.

Au moment de scanner une image on veillera donc à choisir la résolution appropriée :

2

Pour une image devant être mise en ligne (donc destinée à l’affichage écran), on se contentera d’une résolution de 72 dpi, correspondant à la résolution d’un écran standard.

Pour une image destinée à une sortie sur une imprimante domestique,

une résolution de 200 ou 300 dpi sera mieux adaptée, mais on fera attention à la taille du fichier qui devra rester raisonnable. Attention : pour une dimension donnée, le poids du fichier (on dit en fait la taille du fichier) non compressé augmente en fonction du carré de la résolution : quand la résolution est multipliée par 2, la taille est multiplié par 4. Pour le calcul, voir chapitre suivant.

Une image destinée à une impression de qualité professionnelle devra être scannée au moins à 300 dpi.

Scanner une image depuis Paint.net : voir plus bas.

2. Du nombre de couches qui la composent :

o 1 couche si c’est une image en niveaux de gris o 3 couches si c’est une image en RVB (rouge vert bleu = images

destinées à l’affichage sur un écran, ce qui est le cas sur le web) o 4 couches si c’est une image en CMJN (cyan magenta jaune noir =

images destinées à l’impression)

Les images RVB et CMJN sont respectivement des combinaisons de 3 ou 4 images en « niveaux de gris », chacune étant affectée à une couleur fondamentale pour obtenir par synthèse une image composite. Voici par exemple une image en RVB : Elle est la synthèse de 3 couches :

� Une couche rouge dont voici l’affichage en niveaux de gris… …et l’affichage en rouge primaire (sa « vraie » couleur, celle des diodes rouges de l’écran) :

3

� Une couche verte

dont voici l’affichage en niveaux de gris… … et l’affichage en vert, sa « vraie » couleur :

� Une couche bleue dont voici l’affichage en niveaux de gris… … et l’affichage en bleu : L’image RVB sera la synthèse des trois images rouge , verte et bleue . On parle dans ce cas de synthèse additive car les trois sources de lumière s’additionnent. Les diodes de l’écran, en effet, émettent de la lumière. La même image en CMJN sera décomposée ainsi :

� Une couche cyan …dont voici la trame en niveaux de gris. C’est le typon qui sera utilisé par l’imprimeur pour la couleur cyan (il s’agit évidemment ici d’une simulation : le vrai typon est un film finement tramé, impossible à reproduire à cette dimension sur un écran).

4

� Une couche magenta

… dont voici la trame, le typon, en niveaux de gris.

� Une couche jaune

… dont voici la trame en niveaux de gris.

� Et une couche noire pour améliorer les contrastes.

L’image CMJN sera la synthèse des quatre images cyan , magenta , jaune et noire . On parle dans ce cas de synthèse soustractive car les encres soustraient (absorbent) certaines franges de la lumière blanche et réfléchissent les autres.

L’aspect d’une même image en RVB et en CMJN peut, dans certains cas, différer sensiblement. En effet, pour des raisons physiques, les deux ensembles des couleurs additives et des couleurs soustractives ne se recouvrent pas tout à fait : certaines couleurs affichables sur un écran ne sont pas imprimables.

Chaque couche comportant 256 niveaux (256 nuances de « gris »), une image en RVB (ayant donc 3 couches => codage sur 3 octets = 3 x 8 = 24 bits) pourra

5

comporter jusqu’à 2563 couleurs soit 16 777 216 (on dit 16 millions pour abréger). Une image CMJN (4 couches => codage sur 4 octets = 4 x 8 = 32 bits) pourra comporter jusqu’à 2564 couleurs soit 4 294 967 296 (on dit 4 milliards). On obtient ainsi des chiffres dépassant de beaucoup les capacités de discrimination de l’œil humain mais qui ont quand même leur utilité car ils augmentent les possibilités de calcul des programmes de traitement d’image, permettant ainsi notamment de réduire l’effet de « postérisation » induit par des manipulations successives et nombreuses.

Calcul théorique du poids d’une image non compressée :

- une image en niveaux de gris (codée sur 8 bits =1 octet) de 400 x 500 pixels pèse 400 x 500 x 1 (1 seule couche) = 20 000 octets soit 20 ko. - une image en RVB (donc en 24 bits) de 400 x 500 pixels pèse 400 x 500 x 3 (3 couches) = 60 000 octets soit 60 ko. - la même image en CMJN (donc en 32 bits) pèsera 400 x 500 x 4 (4 couches) = 80 000 octets, soit 80 Ko. Rem. : le navigateur de Windows affiche, dans les bulles d’info ou dans les Propriétés des fichiers, des chiffres un peu inférieurs qui ne sont pas tout à fait exacts.

3. Si l’image est compressée , son poids va dépendre en outre du format de fichier sous lequel elle est enregistrée et des options de compression.

Sur le Web, les formats de compression les plus courants sont le JPEG, le GIF et le PNG.

• Le format JPEG

Les images JPEG ont l'extension ".jpg", ".jpeg", ".jpe" ou ".jfif", les quatre notations sont justes. Le mot JPEG veut dire Joint Photographic Expert Group représentant le nom d'un groupe d'experts qui s'est chargé de créer un format de compression pour les images photographiques. L'algorithme de compression JPEG redéfinit les couleurs des pixels en leurs réattribuant une couleur moyenne qui est calculée en fonction des couleurs des pixels voisins.

Source : http://www.buvetteetudiants.com/cours/administrator/html-css/jpeg-jpg-jpe-jfif.php Le format JPEG est adapté aux images comportant plus de 256 couleurs, c'est-à-dire en fait les photographies en couleurs , surtout si elles sont riches en nuances. Mais la compression JPEG induit des pertes de données car elle procède par approximations. A la compression elle calcule, puis recalcule à la décompression, les couleurs s’approchant des couleurs d’origine, en fonction d’un taux de compression choisi par l’utilisateur. Plus le taux est élevé, plus léger sera le fichier mais plus l’image sera dégradée. Voici une image non compressée . Elle fait 300 x 225 pixels, pèse environ 200 ko et mettra dans les 60 secondes à être téléchargée en très bas débit (28 kb/sec).

6

La même, comportant le même nombre de pixels mais très fortement compressée en JPEG : elle ne pèse plus que 6 ko et prendra théoriquement moins de 2 secondes de téléchargement à débit égal…

…mais elle a subi des altérations, comme on peut le voir sur l’image elle-même et mieux encore sur ce détail agrandi.

La même, toujours en JPEG mais en qualité maximum (taux de compression minimum ). Elle pèse 90 Ko.

7

Un détail de la même image : la perte de qualité est minime. La pixellisation est due à l’agrandissement. Pour plus de précisions sur l’algorithme de compression JPEG, les matheux pourront se reporter à ces explications : http://home.nordnet.fr/~jpbaey/tipe/compression_jpeg/principe_de_la_compression_jpeg.htm

• Le format GIF

La compression GIF (Graphic Interchange Format) consiste à réduire l’affichage à 256 couleurs (ou moins), choisies parmi une palette de 16 millions de nuances. Chaque couleur est indexée, c'est-à-dire qu’elle est renvoyée à une palette. Chaque pixel fait ensuite référence à l’une des couleurs de la palette. Les meilleurs programmes de retouche permettent d’utiliser une palette adaptative, composée de couleurs aussi proches que possible de l’original. Mais le risque avec le GIF est de voir apparaître un effet de « postérisation », c'est-à-dire d’aplatissement des couleurs, comme dans cet exemple. L’effet de postérisation (à ne pas confondre avec la pixellisation due à l’agrandissement) est bien visible sur ce détail agrandi.

8

Il existe un moyen de réduire cet effet (généralement indésirable sauf recherche stylistique) grâce à une option offerte par les programmes de retouche : le « dithering » (to dither = hésiter), en bon Français le tramage. Ce procédé fragmente les couleurs pour recréer les tons intermédiaires par mélange optique – technique utilisée déjà au 19e siècle par les peintres pointillistes tels Seurat ou Signac. Voici ce que ça donne… Ci-contre un détail agrandi, à comparer à celui de la page précédente. Le dithering améliore l’image mais on voit bien à travers ces exemples que la compression au format GIF n’est pas des plus adaptée aux photographies en couleurs. Voici un exemple d’image mieux adaptée à la compression GIF car elle ne comporte que des aplats. Ici l’image originale, à un format non compressé pesant 70 Ko. La même en GIF 8 couleurs : elle ne fait plus que 2,4 Ko, sans perte de qualité. Nous allons voir plus loin d’autres exemples. Pour plus de détails sur le format GIF, voir : http://fr.wikipedia.org/wiki/Graphics_Interchange_Format

9

• Le format PNG

Le format PNG (Portable Network Graphics) est un format ouvert développé comme alternative au format GIF, et offrant plusieurs options de compression :

- en 8 bit : résultats identiques au GIF. - en 24 ou 32 bits : compression sans perte sensible de qualité, mais fichiers

plus lourds qu’en 8 bits bien évidement, et qu’en JPEG. Certains anciens navigateurs ne permettent pas d’afficher ce type d’image.

Pour plus de détails : http://fr.wikipedia.org/wiki/Portable_Network_Graphics

• Choix de la compression : JPEG, GIF ou PNG ? - JEPG : nous avons vu les effets d’une forte compression de ce type. Mais le résultat est bon avec un taux de compression judicieusement choisi. - GIF : la réduction de la palette par la compression GIF fait d’elle un procédé tout indiqué pour les graphiques comportant des aplats ou à la rigueur de petits dégradés, et un nombre limité de couleurs.

Voici par exemple une copie d’écran :

Couleurs en nombre limité, en aplats ou en dégradés simples, blancs qui ont tout intérêt à rester blancs, un peu de texte : le genre d’image à compresser en GIF.

- Ci-contre l’original non compressé mesurant 151 x 156 pixels et pesant donc (en RVB) 70 Ko théoriques.

La même compressée en GIF 256 couleurs :

Pratiquement aucune différence à l’œil nu, mais elle ne pèse plus que 8 Ko.

- Pour comparaison, la même image fortement compressée en JPEG :

Elle ne fait que 4 KO mais les blancs sont tachés et les formes dissoutes.

- La même, toujours en JPEG mais moins compressée, à 8 Ko…

C’est aussi bon que le GIF, à poids égal.

10

- La même image en PNG 8 bits. Elle pèse 6,7 Ko.

- PNG : un exemple de photo en PNG 24 bits. Elle fait 200 Ko.

Un détail de la même image : aucune perte visible de qualité. Mais le fichier est plus lourd qu’en JPEG peu compressé, pour une qualité à peu près égale.

11

En conclusion : comment choisir ? Le format JPEG

- Photos en couleurs. On choisira le taux de compression en fonction du poids désiré et de la tolérance aux pertes.

Le format GIF

- Graphiques, logos. - Photos en niveaux de gris. Ne comportant que 256 nuances, elles peuvent sans

inconvénients être compressées en GIF. - Photos contenant des blancs auxquels on veut conserver leur pureté. Par

exemple pour faire un bandeau dans un site web. - Le format GIF autorise en outre les animations (C’est le format, par exemple, des

émoticônes) et la transparence. Le format PNG

- Toutes sortes d’images. Mais il y a des risques de problèmes à l’affichage. Cet inconvénient tend bien sûr à disparaître avec la mise à jour des systèmes et des programmes. Autre inconvénient : la taille d’un fichier compressé en PNG sera supérieure à celle du même fichier en JPEG à qualité sensiblement égale.

- Le PNG 24 bits gère la transparence et la translucidité, utiles pour obtenir certains effets sur le Web.

• Scanner une image depuis Paint.net

Les scanner sont livrés avec une application spécifique, mais dès qu’un scanner est installé sur votre PC, il devient accessible depuis Paint.net. Menu File > acquire > from Scanner or Camera Choisir le périphérique voulu (car il peut y en avoir plusieurs !) La fenêtre de prévisualisation s’affiche. Choisir le type d’image. On peut bien sûr scanner une image couleurs en niveaux de gris, tout dépend du résultat voulu. Par défaut, la résolution est généralement de 100 dpi. On peut la modifier en cliquant sur Adjust the quality of the scanned picture (qui est parfois écrit en Français). Ajuster la résolution si nécessaire puis cliquer sur OK.

12

On revient à la fenêtre précédente. Cliquer sur Preview pour avoir un aperçu. Le cadre de scanning s’adapte automatiquement à l’image, quelles que soient ses dimensions, mais on peut bien sûr rectifier le cadrage à la main. Ici, c’est un timbre poste ! Cliquer sur Scan. Le scan terminé, la fenêtre se referme et l’image scannée apparaît dans votre application Paint.net.

• Réduire et compresser une image dans Paint.net Les programmes de retouche photo permettent, parmi de nombreuses autres fonctions, de compresser les images. Paint.net, téléchargeable sur http://www.dotpdn.com/downloads/pdn.html est gratuit, simple et efficace. L’installation de la version 2.5 nécessite parfois dans un premier temps celle – automatique, qu’on se rassure ! – d’un composant Windows, ce qui peut être assez long mais ne pose pas de problème. Vous avez donc installé Paint.net 2.5.

1. Réduire les dimensions de l’image L’erreur à ne pas commettre (mais souvent commise…) serait de mettre en ligne (ou d’envoyer en fichier joint) l’image telle qu’elle sort de votre appareil photo numérique. En effet, bien qu’au format JPEG – donc compressées – les images stockées dans les appareils peuvent être relativement lourdes, car de grandes dimensions et peu compressées pour leur conserver une certaine qualité. Par exemple, la nature morte illustrant ce texte, dans sa forme originale telle qu’elle fut prise un jour de marché, mesure 3072 x 2304 pixels soit 7 millions de pixels en chiffre arrondi et pèse (en JPEG) au sortir de l’appareil 5,6 Mo. Imaginez que vous mettiez une cinquantaine de photos de cette taille sur un site : celui-ci pèsera près de 300 Mo rien qu’en images ! De plus, comment afficher une photo de cette dimension sur un écran qui a bien des chances de ne pas dépasser les 1024 x 768 pixels ? La première tâche sera de réduire les dimensions de l’image pour la rendre affichable sans obliger votre internaute à utiliser les ascenseurs pour admirer votre œuvre par petits bouts comme dans une longue-vue, après lui avoir infligé une attente variable mais toujours pénible. Menu Image > Redimensionner ou raccourci clavier Ctrl + R

13

La fenêtre qui s’ouvre indique la taille (le « poids ») du fichier. Il s’agit ici d’un fichier non compressé, ce qui explique le chiffre élevé. Conserver l’option de ré échantillonnage Meilleure qualité et laisser coché Conserver les proportions. Sont indiquées ensuite les dimensions originales de l’image en pixels. Pour une image destinée au Web, garder comme résolution 72 pixels/pouce, qui est la résolution de l’écran. Dans le champ Taille de pixel Largeur, entrer la nouvelle taille désirée en pixels, par ex. 500. La hauteur proportionnelle est calculée automatiquement : 375 pixels. Les champs Taille du tirage ne seront utiles que pour un tirage papier. On aura entré dans ce cas dans le champ Résolution un chiffre de 200 à 300 pixels par pouce. Attention toutefois à la taille du fichier final ! On remarquera que la taille du fichier (en haut de la fenêtre) a diminué. Elle est passée de 27 Mo à 732,4 Ko. Cette opération de redimensionnement allège donc déjà considérablement le fichier. Cliquer sur OK. L’image s’affiche à l’écran dans sa nouvelle taille.

2. Enregistrer l’image sous un format compressé Menu Fichier > Enregistrer sous. Donner un nom au fichier et choisir le format en fonction du type d’image et du résultat voulu.

- Enregistrement au format JPEG. Sélectionner le format.

Cliquer sur Enregistrer.

14

La fenêtre de paramétrage s’affiche. Il ne reste plus qu’à choisir avec le curseur le taux de compression en fonction de la qualité (visible dans la fenêtre d’aperçu) et de la taille souhaités. On remarquera qu’en JPEG, on conserve une qualité acceptable jusqu’à un taux de compression d’environ 50.

- Enregistrement au format GIF : peu de différences de paramétrages si ce n’est qu’on peut faire varier le niveau de tramage (le dithering) et le seuil de transparence.

Paint.net ne permet pas de choisir la résolution de 1 à 8 bits, c. à d. le nombre de couleurs, de 2 à 256. Le programme est censé s’adapter.

- Enregistrement au format PNG : pour une photo, cocher Détecter automatiquement.

On cochera 8 bits dans le cas d’un logo ou d’un graphique.

On remarquera dans cet exemple la taille du fichier en PNG : 500 Ko contre 46 Ko en JPEG avec un taux de compression d’environ 50 pour une qualité presque équivalente.