JPEG vs PNG vs BMP vs GIF vs SVG

J'aimerais savoir lequel de ces formats requiert le moins de mémoire pour une image de même qualité et quelles sont les principales différences entre ces formats.

De Quelle est la différence entre les fichiers TIFF, GIF, JPG, JPEG, PNG et un fichier BMP?

BMP - Bitmap. C’était probablement le premier type de format d’image numérique dont je puisse me souvenir. Chaque image sur un ordinateur semblait être un fichier BMP. Sous Windows XP, le programme Paint enregistre automatiquement les images au format BMP. Cependant, sous Windows Vista et les versions ultérieures, les images sont maintenant enregistrées au format JPEG. BMP est la plate-forme de base de nombreux autres types de fichiers.

JPG / JPEG - (Groupe d'experts photographiques conjoints) Le format Jpeg est utilisé pour les photographies couleur, ou pour toutes les images comportant de nombreux mélanges ou dégradés. Il n’est pas bon avec des bords tranchants et a tendance à les brouiller un peu, sauf s’il est stocké avec une qualité élevée. Ce format est devenu populaire avec l'invention de l'appareil photo numérique. La plupart des appareils photo numériques, sinon tous, téléchargent des photos sur votre ordinateur au format Jpeg. De toute évidence, les fabricants d'appareils photo numériques reconnaissent la valeur des images de haute qualité qui occupent finalement moins de place.

GIF - (Graphics Interchange Format) Le format GIF est mieux utilisé pour le texte, les dessins au trait, les captures d'écran, les dessins animés et les animations. Gif étant limité à 256 couleurs au maximum, les images Gif sont donc relativement petites. Il est couramment utilisé pour le chargement rapide de pages Web. Il fait également une grande bannière ou un logo pour votre page Web. Les images animées peuvent également être enregistrées au format GIF en tant que séquence d'images statiques. Par exemple, une bannière clignotante serait enregistrée dans un fichier GIF.

PNG - (Portable Networks Graphic) Ce format sans perte est l’un des meilleurs formats d’image. Ce n’était pas toujours compatible avec tous les navigateurs Web ou logiciels d’image, mais il s’agit du meilleur format d’image pour les sites Web. J'utilise .png pour les logos et les captures d'écran. Une de ses capacités les plus étonnantes est de pouvoir compresser les images sans perte (sans perte de pixels), bien que la taille de compression finale varie entre les éditeurs d’images.

TIFF - (Format de fichier d'image marqué) Ce format de fichier n'a pas été mis à jour depuis 1992 et appartient maintenant à Adobe. Il peut stocker une image et des données (tags) dans un seul fichier. Le format TIFF peut être compressé, mais c’est plutôt sa capacité à stocker les données d’image dans un format sans perte qui en fait un fichier d’archive d’images très utile, car contrairement aux fichiers JPEG standard, un fichier TIFF utilisant la compression sans perte (ou aucun) peut - enregistré sans perte de qualité d'image. Ce fichier est couramment utilisé pour la numérisation, la télécopie, le traitement de texte, etc. Il n’est plus un format de fichier courant à utiliser avec vos photos numériques, car jpeg est d’une excellente qualité et prend moins d’espace.

Dans le style xkcd de lbrandy.com :

Vous devez être conscient de quelques facteurs clés ...

Premièrement, il existe deux types de compression: Lossless et Lossy .

• Sans perte signifie que l'image est réduite, mais sans nuire à la qualité.
• Perte signifie que l'image est rendue (encore) plus petite, mais au détriment de la qualité. Si vous sauvegardiez une image au format Lossy à plusieurs reprises, la qualité de l’image empirerait progressivement.

Il existe également différentes profondeurs de couleur (palettes): Couleur indexée et Couleur directe .

• Indexé signifie que l'image ne peut stocker qu'un nombre limité de couleurs (généralement 256), contrôlées par l'auteur, dans ce que l'on appelle une carte de couleurs.
• Direct signifie que vous pouvez stocker plusieurs milliers de couleurs qui n'ont pas été directement choisies par l'auteur

BMP - sans perte / indexé et direct

C'est un vieux format. Il est sans perte (aucune donnée d'image n'est perdue lors de la sauvegarde), mais il y a également peu ou pas de compression, ce qui signifie que l'enregistrement en tant que BMP entraîne la création de TRES grandes tailles de fichiers. Il peut avoir des palettes d'indexé et direct, mais c'est une petite consolation. La taille des fichiers est tellement grande que personne n'utilise vraiment ce format.

Bon pour: rien vraiment. Il n'y a rien que BMP excelle, ou ne soit pas mieux fait par d'autres formats.

GIF - sans perte / indexé seulement

Le format GIF utilise une compression sans perte, ce qui signifie que vous pouvez enregistrer l'image à plusieurs reprises et ne jamais perdre de données. La taille des fichiers est beaucoup plus petite que celle du format BMP, car une bonne compression est effectivement utilisée, mais il ne peut stocker qu'une palette indexée. Cela signifie que dans la plupart des cas d'utilisation , il ne peut y avoir qu'un maximum de 256 couleurs différentes dans le fichier. Cela semble être une petite somme, et ça l'est.

Les images GIF peuvent également être animées et transparentes.

Bon pour: Logos, dessins au trait et autres images simples qui doivent être petites. Seulement vraiment utilisé pour les sites Web.

JPEG - Perte / Direct

Les images JPEG ont été conçues pour produire des images photographiques détaillées aussi petites que possible en supprimant les informations que l'œil humain ne remarquera pas. En conséquence, il s'agit d'un format avec perte, et enregistrer le même fichier à plusieurs reprises entraînera la perte de plus de données au fil du temps. Elle offre une palette de milliers de couleurs et convient donc parfaitement aux photographies. Toutefois, la compression avec perte en est un inconvénient pour les logos et les dessins au trait: non seulement elles auront une apparence floue, mais elles auront également une taille de fichier supérieure à celle des GIF!

Bon pour: Photographies. En outre, les gradients.

PNG-8 - sans perte / indexé

PNG est un format plus récent et PNG-8 (la version indexée de PNG) est un bon substitut pour les fichiers GIF. Malheureusement, il présente toutefois quelques inconvénients: Premièrement, il ne peut pas prendre en charge une animation comme le GIF (eh bien, il le peut, mais seul Firefox semble le prendre en charge, contrairement à l’animation GIF qui est prise en charge par tous les navigateurs). Deuxièmement, il a des problèmes de support avec les anciens navigateurs comme IE6. Troisièmement, des logiciels importants comme Photoshop ont une mise en œuvre très médiocre du format. (Bon sang, Adobe!) Le format PNG-8 ne peut stocker que 256 couleurs, comme les GIF.

Bon pour: La principale chose pour laquelle PNG-8 fait mieux que les GIF est le support de la transparence alpha.

Remarque importante: Photoshop ne prend pas en charge la transparence alpha pour les fichiers PNG-8. (Bon sang, Photoshop!) Il existe des moyens de convertir Photoshop PNG-24 en fichiers PNG-8 tout en conservant leur transparence. Une méthode est PNGQuant , une autre consiste à enregistrer vos fichiers avec Fireworks .

PNG-24 - Lossless / Direct

PNG-24 est un excellent format qui associe un codage sans perte à une couleur directe (des milliers de couleurs, tout comme le format JPEG). Cela ressemble beaucoup à BMP à cet égard, sauf que PNG compresse réellement les images, ce qui donne des fichiers beaucoup plus petits. Malheureusement, les fichiers PNG-24 seront toujours beaucoup plus volumineux que les fichiers JPEG, GIF et PNG-8;

Même si les fichiers PNG-24 autorisent des milliers de couleurs avec compression, ils ne sont pas destinés à remplacer les images JPEG. Une photo enregistrée au format PNG-24 sera probablement au moins 5 fois plus grande qu'une image JPEG équivalente, avec une très légère amélioration de la qualité visible. (Bien entendu, cela peut être un résultat souhaitable si vous n'êtes pas préoccupé par la taille du fichier et souhaitez obtenir la meilleure qualité d'image possible.)

Tout comme PNG-8, PNG-24 prend également en charge la transparence alpha.

SVG - sans perte / vecteur

Le type de fichier qui gagne en popularité est SVG, ce qui diffère de tout ce qui précède en ce qu’il s’agit d’un format de fichier vectoriel (les fichiers ci-dessus sont tous raster ). Cela signifie qu'il est composé de lignes et de courbes au lieu de pixels. Lorsque vous zoomez sur une image vectorielle, vous voyez toujours une courbe ou une ligne. Lorsque vous zoomez sur une image raster, vous verrez des pixels.

Par exemple:

Cela signifie que SVG est parfait pour les logos et les icônes pour lesquels vous souhaitez conserver la netteté sur les écrans Retina ou de différentes tailles.

De plus, les fichiers SVG sont écrits en XML et peuvent donc être ouverts et édités dans un éditeur de texte afin de pouvoir être manipulés à la volée, si vous le souhaitez. Par exemple, vous pouvez utiliser JavaScript pour modifier la couleur d'une icône SVG sur un site Web, à la manière d'un texte (c'est-à-dire qu'il n'est pas nécessaire de disposer d'une seconde image).

J'espère que ça aide!

Les réponses existantes incluent très peu de données techniques, je vais donc les inclure ici.

• JPEG : couleurs jusqu'à 24 bits (éventuellement plus?), Compression variable (généralement élevée), avec perte, pas de support alpha
• PNG : couleur jusqu’à 48 bits, compression modérée, sans perte, support alpha
• BMP : couleur jusqu'à 24 bits, très peu de compression, sans perte, support alpha
• GIF : couleur jusqu'à 8 bits, compression réduite, sans perte, prise en charge de la transparence, prise en charge de l'animation

La profondeur de la couleur

• Couleur 8 bits = 256 couleurs
• Couleur 24 bits == 16 777 216 couleurs
• Couleur 48 bits == 281 474 976 710 656 couleurs

La plupart des moniteurs d’ordinateur fonctionnent à une profondeur de couleur de 24 bits. L'œil humain peut distinguer autant de couleurs. La profondeur de couleur supplémentaire consiste principalement à conserver les informations d'un capteur afin que la manipulation d'une photo permette d'utiliser plus de données. Essayer de représenter une photo en couleur 8 bits va donner du grain.

Compression

Cela concerne essentiellement la taille du fichier final. Plus de compression équivaut à un fichier plus petit. Cependant, JPEG permet d’atteindre des fichiers de petite taille en jetant les données. Cette compression est appelée compression "avec perte", car vous ne pouvez jamais récupérer les données non compressées d'origine. Sa compression est également optimisée pour les photographies où les contours très contrastés sont rares. Comme indiqué dans d'autres réponses, c'est un mauvais choix pour autre chose que des photographies.

Alpha / Transparence

Alpha se réfère à la transparence, mais cela implique qu'il y a plus d'un niveau de transparence. Le format GIF permet de définir des pixels transparents, mais il est soit opaque, soit 100% transparent, et "transparent" est utilisé comme l'une des 256 couleurs. Les formats PNG et BMP permettent de marquer chaque pixel comme opaque, transparent ou partiellement transparent, comme un morceau de verre coloré. Le plus souvent, il existe 256 niveaux de transparence, bien que le format PNG puisse en comporter jusqu'à 65 536. JPEG ne prend pas en charge la transparence.

Animation

Effectivement, parmi ces formats, seul le format GIF prend en charge l'animation. Il existe des spécifications pour l'animation avec PNG (MNG, APNG) et JPEG (MJPEG), mais elles ne sont pas largement prises en charge. (APNG fonctionne dans les versions récentes de Firefox et Opera.) En pratique, la plupart des animations que vous voyez sur les pages Web sont implémentées dans Flash.

• Utilisez GIF si l’image a peu de couleurs (comme des icônes). Peut également être utilisé pour des images animées (comme des bannières publicitaires).
• Utilisez JPG si l’image a beaucoup de couleurs (comme les photos). JPEG est la même chose.
• Utilisez BMP si vous souhaitez enregistrer l'image sans compression. Beaucoup plus gros!
• Utilisez PNG si vous souhaitez publier l'image sur le Web et être à jour avec les normes modernes. Avantages: Convient comme remplacement moderne pour les formats GIF et JPG. Il s'agit d'un standard ouvert qui permet la transparence. Inconvénients: non pris en charge par les logiciels plus anciens et la taille du fichier peut être supérieure à celle des fichiers GIF ou JPG comparables.

BMP:

• Vieux format. Aucune perte de données.
• Non compressé - Stocke la valeur de chaque pixel. Par conséquent, les images de mêmes dimensions ont la même taille de fichier (kilooctets / mégaoctets). Par exemple, les images 800 × 600 BMP sont toujours 1,37 Mio comme le papier peint populaire WinXP "Bliss".
• Transparence / translucidité non prise en charge
• Pas recommandé pour rien

JPG:

• La compression avec perte.
• Le montant de la perte peut être défini, par exemple lors de la création d’un graphique et de l’enregistrement dans Photoshop.
• Enregistrer en qualité supérieure signifie moins de perte de couleurs / profondeur et une taille de fichier élevée, et inversement.
• Transparence / translucidité non prise en charge
• Recommandé pour les photographies, pas pour les graphiques / icônes

PNG:

• Compression sans perte (oui, le meilleur des deux mots / mondes)
• Prend en charge la transparence ET la translucidité, les deux sont différents
• Recommandé pour les graphiques / icônes statiques, pas pour les photographies

GIF:

• Prend en charge la transparence mais pas la transparence
• Recommandé pour les graphiques / icônes ANIMATED uniquement
• Peut-être que les photographies en mouvement dans les cadres de Harry Potter sont des GIF: D

BMP utilise des bits bruts avec un petit en-tête ou un codage à la longueur d'exécution . JPEG utilise la transformation en cosinus discrète . Voir le bloc au bas des articles de Wikipedia pour d'autres algorithmes de compression / encodage.

Simple guid:

• Pour les photographies, utilisez:
  • Formats bruts spécifiques à l'appareil photo si vous disposez d'un équipement professionnel et souhaitez effectuer beaucoup de post-traitement
  • JPEG autrement (pour publier des photos sur le Web, vous devrez également convertir les formats bruts au format JPEG)
• Pour tout ce qui a des arêtes vives, des lignes fines et peu de couleurs (comme des captures d'écran ou des logos), utilisez:
  • GIF si vous créez une page Web qui doit prendre en charge de très vieux navigateurs (principalement IE 6) ou si vous souhaitez réaliser des animations simples
  • PNG autrement
• Il n'y a pas de bonne raison d'utiliser BMP, à moins qu'un programme spécifique n'accepte pas d'autres formats.