Formats graphiques Web   


Les formats graphiques actuellement utilisés sur le Web sont:
  • Le format JPEG (Joint Photographic Experts Group - extension des fichiers .jpg ou .jpeg)
  • Le format GIF (Graphics Interchange Format - extension des fichiers .gif)
  • Le format PNG (Portable Network Graphics - extension des fichiers .png)

Le format JPEG:

Le format JPEG est un format de compression très efficace mais avec perte de qualité. Plus l'image est compressée, plus la qualité de l'image diminue. Il convient donc de trouver un compromis permettant un chargement rapide tout en gardant une qualité acceptable. Les logiciels graphiques permettent de régler le facteur de compression qui va de 1 à 99.
Le format JPEG est particulièrement adapté et recommandé pour les images de type Photographies, il peut supporter en effet 16.7 millions de couleurs et donne un bon rendu pour les images nuancées et les dégradés. Le format JPEG ne supporte pas la transparence et ne permet pas de créer des animations.
Le codage standard donne une image qui va s'afficher petit à petit du haut vers le bas au fur et a mesure du chargement.
Le codage progressif est sensé permettre un affichage progressif de l'image, l'image étant flou au début du chargement et devenant de plus en plus précise. Internet Explorer 5.5 pour windows ne semble pas prendre en compte le codage progressif et n'affiche l'image que lorsqu'elle est entièrement chargée.

5466 octets 2506 octets 1147 octets

compression faible

compression moyenne

compression forte
JPEG: La qualité de l'image diminue avec l'augmentation du facteur de compression


Le format GIF:

Le format GIF est un format qui utilise une compression sans perte de qualité.
Les images au format GIF peuvent contenir un maximum de 256 couleurs, ce qui rend ce format peu adapté pour les photographies, les images nuancées et les dégradés. Par contre ce format donne d'excellents résultats pour les images avec un petit nombre de couleurs, les logos, les formes géométriques, boutons etc...
Le format GIF supporte la transparence et il permet également de créer des animations : les GIFs animés.
L'option d'entrelacement permet d'afficher l'image progressivement, l'image étant flou au début du chargement et devenant de plus en plus précise.
Le format GIF fait l'objet d'un brevet détenu par UNISYS.

Le même GIF animé transparent sur 2 fonds différents.
A droite le contour n'est pas net. Pour éviter cela, il peut être utile dans certains cas de créer les GIFs transparents (animés ou non) avec une couleur d'arrière plan qui se rapproche du fond sur lequel ils seront utilisés avant de rendre cette couleur d'arrière plan transparente.


2879 0ctets

243 couleurs utilisées
2232 0ctets

32 couleurs utilisées
901 0ctets

16 couleurs utilisées
Incidence du nombre de couleurs sur le poids et l'apparence des GIFs


Lors de la diminution du nombre de couleurs précédant l'enregistrement des images GIFs, la méthode de diffusion d'erreur (dithering) peut s'avérer intéressante.
Image 16 couleurs. La diminution du nombre de couleurs a été faite sans diffusion d'erreurs.
  Image 16 couleurs. La diminution du nombre de couleurs a été faite avec la méthode de diffusion d'erreur.


Le format PNG:

Le format PNG utilise une compression sans perte de données.
Le PNG supporte comme le GIF une palette indexée jusqu'à 256 couleurs, mais également les niveaux de gris jusqu'à 16 bits et les couleurs réelles jusqu'à 42 bits.
Le PNG supporte la transparence ainsi que 254 niveaux de transparence partielle.
Il possède également une méthode d'entrelacement très performante.
Les fichiers PNG sont généralement plus légers que les GIF, par contre le PNG est moins performant que le JPEG pour la compression des photographies.
Le PNG ne permet pas de créer des animations.
Seul les navigateurs récents reconnaissent le format PNG.
Pour aller plus loin (sites en anglais):
The World Wide Web Consortium www.w3.org/Graphics/PNG/
PNG Home Site www.libpng.org/pub/png/

Si vous voyez le logo PNG ci-dessous votre navigateur supporte ce format.




© 2000-2003 Lookimage-Clairet   Partenaires : Surveiller son poids - Lisser ses cheveux - Obtenir un crédit