Les différents formats d'image sur le web

Chaque image possède une extension qui permet de connaitre le format du fichier.
Selon le format, l'image sera plus ou moins lourde. Il est donc important de connaitre les différents formats d'image et de bien les utiliser sur le web.

Les différents formats

Le format JPEG

On reconnaît son format grâce à son extension .jpg ou .jpeg à la fin du nom du fichier de votre image.
Le format JPG est léger mais il ne gère pas la transparence des images. Il ne faut pas trop compresser ce format sinon la qualité peut vite devenir médiocre.
Ce format est idéal pour les photos et les images de grande taille.

Le format PNG-24

L'extension de ce format est .png
Ce format gère la transparence. C'est-à-dire qu'en ce qui concerne les logos il est préférable d'utiliser un format .png qu'un .jpg
Le PNG est plus lourd à charger mais idéal pour les logos, les pictogrammes ou pour des schémas.

Le format PNG-8

L'extension du format est aussi .png
Ce format est moins lourd que le PNG-24, l'image n'est pas pixélisée mais la gestion de la transparence est partielle.
Nous vous conseillons d'utiliser ce format lorsque votre image ne contient pas beaucoup de couleur. Celui-ci convient dans la majorité des cas.

Voici ci-dessous la différence entre une image enregistrée en .jpg et une image enregistrée en .png :

On remarque bien l’arrière plan blanc avec le format en .JPG et la transparence de l’arrière plan en enregistrant l’image en .png.

Le format GIF

Ce format est reconnaissable grâce à son extension .gif
Celui-ci gère les animations et il gère partiellement la transparence.

Cependant, le gif est à utiliser avec modération car il est plus lourd que le PNG-8 pour un rendu identique.

Ce format est à utiliser uniquement pour les animations.

Afin que le gif ne prenne pas de place sur le site, vous pouvez générer un gif directement via le site Giphy.

via GIPHY

Le format SVG

L'extension de ce format : .svg
C’est un format très léger qui gère la transparence. Il est utilisé uniquement pour les images vectorielles (illustrator ou Inkscape).

L'intégration du format est plus complexe que pour une image classique en PNG.

Le format BMP

Ce format est très lourd et long à charger et l'image ne gère pas la transparence. Ce format ne se met jamais sur le web.
En conclusion, vous l'aurez compris, les formats acceptables sur le web sont le format jpg, png et le gif.
Il faut choisir le format de l'image en fonction de son utilisation sur son site. Si c'est une photo, le format d'image .jpg est suffisant. Si vous souhaitez insérer un logo un pictogramme ou un schéma, préférez plutôt utiliser le format .png.