Les formats d’images (partie 4) : le format gif

Voici enfin la suite du guide concernant les formats d’images. Après avoir vu le format jpeg, voyons le format gif. Vous le connaissez certainement comme le type de fichier permettant de faire des animations (quoique aujourd’hui gentiment remplacé par la balise <video> en HTML qui permet de mettre une vraie vidéo en ligne en quelques secondes sur son site). Il cache plus de spécificités que l’animation, cependant. Regardons tout cela de plus près :

Le format gif (Graphics Interchange Format) date de 1987 et a surtout connu sa popularité lors du premier âge du Web. A l’époque, les disquettes (puis plus tard les connexions 56K lentes) empêchaient le transfert de vidéos. Donc, si on voulait passer une petite animation à son collègue ou son voisin, autant la transformer en gif plutôt qu’en vidéo.

Les gifs utilisent donc plusieurs techniques pour conserver de l’espace, chose qu’une vidéo ne fait pas. En premier, il sélectionne une palette de couleur. Un peu comme en peinture ! Quand on a fini son animation et qu’on veut l’exporter, il est normalement possible de dire combien de couleurs on veut garder dans notre image, entre 2 et 256. Reprenons notre image fil rouge en 2 couleurs. Logiquement, si on ne veut que 2 couleurs, il sera en noir et blanc (c’est toujours comme ça en informatique) :

canard2c

Concrètement, j’ai dis à Photoshop de n’utiliser que 2 couleurs dans mon image. C’est ensuite à lui, en utilisant différents algorithmes de palette, de sélectionner ou va le noir et ou va le blanc. Voici l’image en 256 couleurs maintenant, le maximum possible :

canard256cPersonnellement, je ne vois aucune différence (en ne cherchant cependant pas à analyser chaque pixel à la loupe) entre mon image originelle (depuis l’appareil photo) et ce .gif. Cependant, le fichier est volumineux. L’image pèse 1,32Mo alors que la même image en jpeg (qualité 10 sur Photoshop) pèse seulement 689Ko – à peu près la moitié. Eh oui, autant le gif est-il pratique pour le partage, autant devient-il vite volumineux. Ceci n’est pas expliqué en médiamatique, mais si je devais imaginer le pourquoi du comment je dirais que l’algorithme du gif n’a pas évolué depuis bien longtemps, tandis que l’algorithme du jpeg (adapté par chaque programme voulant l’utiliser) est souvent mis à jour et donc devient plus performant. Ceci est certainement dû au fait qu’il était breveté jusqu’en 2004 (seuls les programmes voulant permettre d’enregistrer en .gif devaient payer la licence cependant).

Pour le fun, j’ai réduit les couleurs de mon canard à ce que je jugeais la limite de l’acceptable. Voici donc l’image, au format .gif, avec seulement 60 couleurs :

canard60c… Elle est toujours un peu plus lourde que le .jpeg d’avant.

On passe à la suite ?

Allons-y ! Le format gif gère aussi la transparence. Mais attention, il faut différencier la transparence simple de la transparence par couche alpha. Dans le premier cas, soit un pixel est transparent, soit il ne l’est pas. Dans le deuxième cas, on peut choisir la transparence du pixel (en plus de sa couleur) jusqu’à 100 niveaux – comprendre 100 pourcents. Le gif ne gère que la transparence simple, afin d’économiser encore de la place.

Et enfin, le gif gère l’entrelacement. Le png aussi, mais nous en parlerons dans le prochain article. Une image, rappelons-le, est une grille de pixels. Elle va donc se charger sur notre écran de gauche à droite et de haut en bas, ligne par ligne. L’entrelacement permet de seulement charger une ligne sur deux, puis d’ensuite recommencer pour charger les lignes manquantes. C’est surtout un principe utile aux connexions lentes, afin que le visiteur puisse choisir s’il souhaite continuer à charger l’image ou non.

Du coup, j’utilise le gif ou pas ?

Maintenant que nous sommes dans l’ère 3.0 du Web ou il suffit d’ajouter la balise <video> dans sa page pour automatiquement mettre une vidéo de n’importe quelle durée (et il est possible de la faire passer pour un gif en activant l’autoplay et en retirant les options de contrôle), je ne recommande vraiment plus le gif. D’autant plus que, comme le montre à maintes reprises le site gfycat.com (qui permet de transformer un gif en vidéo HTML5), une vidéo charge plus rapidement, pèse moins, et offre plus de contrôles qu’une image animée gif. Cependant, si vous voulez vous lancer dans l’animation, c’est une bonne manière de commencer, même si je pense que des programmes d’animations dédiés à cela soient plus adaptés (et il en existe des gratuits !).

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée.