JPEG vs PNG vs BMP vs GIF vs SVG

J'aimerais savoir lequel de ces formats nécessite moins de mémoire pour la même qualité de l'image et quelles sont les principales différences entre ces formats.

De quelle différence entre TIFF, GIF, JPG, JPEG, PNG et un fichier BMP?

BMP – Bitmap. Ce fut probablement le premier type de format d'image numérique dont je me souviens. Chaque image sur un ordinateur semblait ces jours être un BMP. Dans Windows XP, le programme Paint enregistre ses images automatiquement dans BMP. Cependant, dans Windows Vista et les images ultérieures sont maintenant enregistrées sur JPEG. BMP est la plate-forme de base pour beaucoup d'autres types de fichiers.

JPG / JPEG – (Joint Photographic Experts Group) Le format Jpeg est utilisé pour des photographies en couleur ou des images avec de nombreux mélanges ou gradients. Ce n'est pas bon avec des bords tranchants et a tendance à les flouer un peu, sauf si elles sont stockées à haute qualité. Ce format est devenu populaire avec l'invention de l'appareil photo numérique. La plupart, sinon tous, les caméras numériques télécharge des photos sur votre ordinateur en tant que fichier Jpeg. De toute évidence, les fabricants d'appareils photo numériques voient la valeur dans des images de haute qualité qui finissent par prendre moins d'espace.

GIF – (Graphics Interchange Format) Le format Gif est le mieux utilisé pour le texte, les dessins en ligne, les captures d'écran, les dessins animés et les animations. Gif est limité à un nombre total de 256 couleurs ou moins, donc les images GIF sont relativement petites. Il est couramment utilisé pour le chargement rapide des pages Web. Il constitue également une grande bannière ou un logo pour votre page Web. Les images animées peuvent également être enregistrées au format GIF comme une séquence d'images statiques. Par exemple, une bannière clignotante serait enregistrée en tant que 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 les logiciels d'image, mais aujourd'hui, c'est le meilleur format d'image à utiliser pour le site. J'utilise .png pour les logos et les captures d'écran. L'une de ses capacités les plus étonnantes est de pouvoir compresser sans perte de pixels les images, bien que la taille comprimée finale varie entre les éditeurs d'images.

TIFF – (Tagged Image File Format) 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 le fichier unique. TIFF peut être compressé, mais il est plutôt sa capacité à stocker des données d'image dans un format sans perte qui rend un fichier TIFF une archive d'image utile, car contrairement aux fichiers JPEG standard, un fichier TIFF utilisant une compression sans perte (ou aucun) peut être édité et re – 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. Ce n'est plus un format de fichier commun à utiliser avec vos photos numériques, car jpeg est de grande qualité et prend moins d'espace.

Dans le style xkcd de lbrandy.com :

Texte alt

Vous devriez connaître quelques facteurs clés …

Tout d'abord, il existe deux types de compression: sans perte et perte de poids .

  • Sans perte signifie que l'image est réduite, mais sans nuire à la qualité.
  • Perte signifie que l'image est rendue (même) plus petite, mais au détriment de la qualité. Si vous avez enregistré une image dans un format Lossy une fois de plus, la qualité de l'image serait de plus en plus grave.

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

  • Indexé signifie que l'image ne peut stocker qu'un nombre limité de couleurs (habituellement 256), contrôlées par l'auteur, dans quelque chose comme une carte de couleur
  • 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 ancien format. Il est sans perte (aucune donnée d'image n'est perdue lors de la sauvegarde), mais il y a peu ou pas de compression, ce qui signifie que la sauvegarde en BMP résulte en des tailles de fichiers TRÈS grandes. Il peut avoir des palettes à la fois indexées et directes, mais c'est une petite consolation. La taille des fichiers est si inutilement importante que personne n'a jamais utilisé ce format.

Bon pour: Rien vraiment. Il n'y a rien sur quoi BMP excelle, ou n'est pas mieux fait par d'autres formats.

BMP vs GIF


GIF – sans perte / indexé uniquement

GIF utilise une compression sans perte, ce qui signifie que vous pouvez enregistrer l'image encore et toujours et ne jamais perdre de données. Les formats de fichiers sont beaucoup plus petits que BMP, car une bonne compression est réellement utilisée, mais elle ne peut que mémoriser une palette indexée. Cela signifie que pour la plupart des cas d'utilisation , il ne peut y avoir qu'un maximum de 256 couleurs différentes dans le fichier. Cela ressemble à une petite quantité, et c'est le cas.

Les images GIF peuvent également être animées et avoir une transparence.

Bon pour: Logos, dessins linéaires et autres images simples qui doivent être petites. Utilisé uniquement pour les sites Web.

GIF vs JPEG


JPEG – Perte / Direct

Les images JPEG ont été conçues pour rendre les 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 Lossy, et l'enregistrement du même fichier entraîne la perte de plus de données avec le temps. Il dispose d'une palette de milliers de couleurs, ce qui est idéal pour les photographies, mais la compression à perte signifie qu'il est mauvais pour les logos et les dessins de lignes: ils ne seront pas seulement flous, mais ces images auront également une taille de fichier plus grande par rapport aux GIF!

Bon pour: Photographies. En outre, les gradients.

JPEG vs GIF


PNG-8 – sans perte / indexé

PNG est un format plus récent, et PNG-8 (la version indexée de PNG) est vraiment un bon remplacement pour les GIF. Malheureusement, il présente quelques inconvénients: tout d'abord, il ne peut pas supporter l'animation comme GIF (peut-être, mais Firefox semble le supporter, contrairement à l'animation GIF qui est prise en charge par tous les navigateurs). Deuxièmement, il existe des problèmes de soutien avec les anciens navigateurs comme IE6. Troisièmement, les logiciels importants comme Photoshop ont une très mauvaise mise en œuvre du format. (Damn you, Adobe!) PNG-8 ne peut stocker que 256 couleurs, comme les GIF.

Bon pour: La principale chose que PNG-8 fait mieux que les GIF est d'avoir un support pour Alpha Transparency.

PNG-8 vs GIF

Remarque importante: Photoshop ne prend pas en charge Alpha Transparency pour les fichiers PNG-8. (Damn you, Photoshop!) Il existe des façons de convertir Photoshop PNG-24 en fichiers PNG-8 tout en conservant leur transparence. Une méthode est PNGQuant , une autre est d'enregistrer vos fichiers avec Fireworks .


PNG-24 – sans perte / direct

PNG-24 est un excellent format qui combine l'encodage sans perte avec la couleur directe (des milliers de couleurs, tout comme JPEG). C'est très bien comme BMP à cet égard, sauf que PNG compresse effectivement les images, ce qui se traduit par des fichiers beaucoup plus petits. Malheureusement, les fichiers PNG-24 seront encore plus grands que les JPEG, les GIF et les PNG-8, donc vous devez toujours considérer si vous souhaitez vraiment en utiliser un.

Même si les PNG-24 permettent des milliers de couleurs pendant leur compression, elles ne sont pas destinées à remplacer les images JPEG. Une photo enregistrée en tant que PNG-24 sera probablement au moins 5 fois supérieure à une image JPEG équivalente, avec très peu d'amélioration de la qualité visible. (Bien sûr, cela peut être un résultat souhaitable si vous n'êtes pas préoccupé par le fichier et souhaitez obtenir l'image la plus performante possible).

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


SVG – sans perte / vecteur

Un type de fichier actuellement en popularité est SVG, ce qui est différent de tout ce qui précède, en ce sens qu'il s'agit d'un format de fichier vectoriel (ce qui précède est tout raster ). Cela signifie qu'il s'agit en fait de lignes et de courbes au lieu de pixels. Lorsque vous agrandissez une image vectorielle, vous voyez toujours une courbe ou une ligne. Lorsque vous agrandissez une image raster, vous verrez des pixels.

Par exemple:

PNG vs SVG

SVG vs PNG

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

De plus, les fichiers SVG sont écrits à l'aide de XML, et peuvent donc être ouverts et édités dans un éditeur de texte, qu'il peut être manipulé à la volée, si vous le souhaitez. Par exemple, vous pouvez utiliser JavaScript pour changer la couleur d'une icône SVG sur un site Web comme vous voudriez du texte (c'est-à-dire pas besoin d'une seconde image).

J'espère que ça vous aide!

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

  • JPEG : couleur jusqu'à 24 bits (éventuellement plus?), Compression variable (généralement élevée), perte, sans 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, faible compression, sans perte, support de transparence, support d'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 de nombreuses couleurs. La profondeur de couleur supplémentaire est principalement pour pouvoir conserver les informations d'un capteur afin que la manipulation d'une photographie comporte plus de données pour travailler. Essayer de représenter une photo en couleur 8 bits entraînera une granulométrie.

Compression

Cela se réfère essentiellement à la taille du fichier final. Plus de compression équivaut à un fichier plus petit. Cependant, JPEG atteint de petites tailles de fichiers en jetant des données. Ceci est appelé compression "à 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 bords à contraste élevé sont peu communs. Comme indiqué dans d'autres réponses, c'est un mauvais choix pour tout autre chose que des photographies.

Alpha / Transparence

Alpha se réfère à la transparence, mais cela implique qu'il y ait plus d'un niveau de transparence. GIF a la capacité de définir des pixels transparents, mais il est opaque ou 100% transparent, et "transparent" s'utilise comme l'une des 256 couleurs. PNG et BMP ont la possibilité 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 PNG puisse avoir jusqu'à 65 536 niveaux. JPEG n'a aucun support pour la transparence.

Animation

Effectivement, de ces formats, seul 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 mises en œuvre dans Flash.

  • Utilisez GIF si l'image a peu de couleurs (comme les icônes). Peut également être utilisé pour des images animées (comme des bannières publicitaires).
  • Utilisez JPG si l'image comporte plusieurs couleurs (comme les photos). JPEG est la même chose.
  • Utilisez BMP si vous souhaitez enregistrer l'image sans compression. Un format de taille beaucoup plus grand!
  • Utilisez PNG si vous souhaitez publier l'image sur le Web et être à jour sur les normes modernes. Avantages: adapté comme remplacement moderne pour GIF et JPG, et est un standard ouvert, et permet une transparence. Inconvénients: Non pris en charge par un logiciel plus ancien, et la taille du fichier peut être supérieure à GIF ou JPG comparables.

Entrez la description de l'image ici


BMP:

  • Ancien format. Aucune perte de données.
  • Non compressé – Stocke la valeur de chaque pixel. Par conséquent, les images des mêmes dimensions ont le même fichier (kilobytes / méga-octets). Par exemple, 800 × 600 images BMP sont toujours de 1,37 MiB comme les fonds d'écran populaires WinXP "Bliss".
  • Transparence / translucidité non prise en charge
  • Non recommandé pour tout

JPG:

  • Compression avec pertes.
  • Le montant de la perte peut être défini, par exemple lors de la création d'un graphique et d'une sauvegarde dans Photoshop.
  • L'enregistrement en qualité supérieure signifie moins de perte de couleurs / profondeur et taille élevée, et vice versa.
  • Transparence / translucidité non prise en charge
  • Recommandé pour les photographies, pas pour les graphiques / les icônes

PNG:

  • Compression sans perte (ouais, le meilleur des deux mots / mondes)
  • Supporte la transparence et la translucidité, les deux sont différents
  • Recommandé pour les graphiques / icônes statiques, pas pour les photographies

GIF:

  • Supporte la transparence mais pas la translucidité
  • Recommandé pour les graphiques / icônes ANIMÉS seulement
  • Peut-être que les photos 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 en longueur d'exécution . Le JPEG utilise la transformée de cosinus discrète . Voir le bloc au fond des articles de Wikipedia pour d'autres algorithmes de compression / encodage.

Guide simple:

  • Pour les photographies, utilisez:
    • Formats bruts spécifiques à la caméra si vous avez un équipement professionnel et souhaitez effectuer beaucoup de post-traitement
    • JPEG sinon (pour la publication de photos sur le Web, vous devrez également convertir les formats bruts en JPEG)
  • Pour toute chose avec des bords tranchants, des lignes fines et peu de couleurs (telles que des captures d'écran ou des logos) utilisent:
    • GIF si vous faites une page Web qui doit supporter des navigateurs très anciens (IE 6 principalement), ou si vous souhaitez faire des animations simples
    • PNG sinon
  • Il n'y a pas de bonnes raisons d'utiliser BMP, sauf si un programme spécifique n'accepte pas d'autres formats.