web-dev-qa-db-fra.com

Quelle est la différence entre les images "JPG" / "JPEG" / "PNG" / "BMP" / "GIF" / "TIFF"?

J'ai vu de nombreux types d'extensions d'image, mais je n'ai jamais compris les vraies différences entre eux. Existe-t-il des liens expliquant clairement leurs différences?

Existe-t-il des normes à prendre en compte lors du choix d’un type d’image particulier à utiliser dans une application? Qu'utilisons-nous pour les applications Web?

98
MOZILLA

Oui. Ce sont différents formats de fichier (et leurs extensions de fichier).

Les entrées Wikipedia pour chacun des formats vous donneront pas mal d’informations:

  • JPEG (ou JPG, pour l'extension de fichier; Joint Photographic Experts Group)
  • PNG (Graphiques réseau portables)
  • BMP (bitmap)
  • GIF (format d'échange graphique)
  • TIFF (ou TIF, pour l'extension de fichier; format de fichier d'image marquée)

Les formats d'image peuvent être séparés en trois grandes catégories:

  • la compression avec perte,
  • compression sans perte,
  • non compressé,

Les formats non compressés utilisent la plus grande quantité de données, mais ils sont des représentations exactes de l'image. Les formats bitmap tels que BMP ne sont généralement pas compressés, bien qu'il existe également des fichiers compressés BMP.

Les formats compression avec perte conviennent généralement aux photographies. Il ne convient pas pour les illustrations, les dessins et le texte, car artefacts de compression de la compression de l'image sera remarquable. La compression avec perte, comme son nom l'indique, ne code pas toutes les informations du fichier. Ainsi, une fois récupéré dans une image, ce ne sera pas une représentation exacte de l'original. Cependant, il est capable de compresser les images très efficacement par rapport aux formats sans perte, car il supprime certaines informations. JPEG est un excellent exemple de format de compression avec perte.

Les formats compression sans perte conviennent aux illustrations, aux dessins, au texte et à d’autres supports qui n’auraient pas l’air attrayant une fois compressés avec compression. Comme son nom l'indique, la compression sans perte encodera toutes les informations de l'original. Ainsi, lorsque l'image est décompressée, ce sera une représentation exacte de l'original. Comme il n’ya pas de perte d’informations dans la compression sans perte, la compression avec perte n’est pas aussi élevée que dans la plupart des cas. Les exemples de compression d’image sans perte sont PNG et GIF. (Le format GIF n'autorise que les images 8 bits.)

TIFF et BMP sont tous deux des formats "wrapper", car les données qu’elles contiennent peuvent dépendre de la technique de compression utilisée. Il peut contenir des images compressées et non compressées.

Quand utiliser un certain format de compression d'image dépend vraiment de ce qui est compressé.

Question associée: compression sans scrupule de grandes images pour le Web

86
coobird

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 en altérer la qualité. Perdu 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 .

Avec indexé , cela signifie que l’image ne peut stocker qu’un nombre limité de couleurs (généralement 256) choisies par l’auteur de l’image, avec Direct Cela signifie que vous pouvez stocker plusieurs milliers de couleurs qui n'ont pas été choisies par l'auteur.


BMP - Lossless/Indexed and 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 indexées et directes, 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 BMP excelle ou ne se fait pas mieux avec d'autres formats.

BMP vs GIF


GIF - Sans perte/Indexé uniquement

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 qu'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.

GIF vs JPEG


JPEG - Lossy/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.

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 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!) 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 de prendre en charge Alpha Transparency.

PNG-8 vs GIF

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 consiste à 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, 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, ce qui n'améliorera que très peu 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.

J'espère que ça aide!

74
Chuck Le Butt

Généralement ce sont soit:

Compression sans perte Les algorithmes de compression sans perte réduisent la taille du fichier sans perte de qualité d'image, bien qu'ils ne soient pas compressés dans un fichier aussi petit qu'un fichier de compression avec perte. Lorsque la qualité de l'image est supérieure à la taille du fichier, des algorithmes sans perte sont généralement choisis.

La compression avec perte Les algorithmes de compression avec perte exploitent les limites inhérentes à l'œil humain et éliminent les informations invisibles. La plupart des algorithmes de compression avec perte permettent des niveaux de qualité variables (compression) et, à mesure que ces niveaux augmentent, la taille du fichier est réduite. Aux niveaux de compression les plus élevés, la détérioration de l’image devient perceptible sous le nom "d’artefact de compression". Les images ci-dessous illustrent l'artéfact notable des algorithmes de compression avec perte; sélectionnez la vignette pour afficher la version en taille réelle.

Chaque format est différent comme décrit ci-dessous:

JPEG Les fichiers JPEG (Joint Photographic Experts Group) sont (dans la plupart des cas) un format avec perte; l'extension de nom de fichier DOS est JPG (un autre système d'exploitation peut utiliser JPEG). Presque tous les appareils photo numériques peuvent enregistrer des images au format JPEG, qui prend en charge 8 bits par couleur (rouge, vert, bleu) pour un total de 24 bits, produisant des fichiers relativement petits. Lorsqu'elle n'est pas trop importante, la compression n'altère pas sensiblement la qualité de l'image, mais les fichiers JPEG subissent une dégradation générationnelle lorsqu'ils sont modifiés et sauvegardés à plusieurs reprises. Les images photographiques peuvent être mieux stockées dans un format non JPEG sans perte si elles sont rééditées ou si de petits "artefacts" (défauts causés par l'algorithme de compression JPEG) sont inacceptables. Le format JPEG est également utilisé comme algorithme de compression d'image dans de nombreux fichiers Adobe PDF.

TIFF Le format TIFF (Tagged Image File Format) est un format flexible qui enregistre normalement 8 bits ou 16 bits par couleur (rouge, vert, bleu) pour les totaux 24 bits et 48 bits, respectivement, en utilisant le nom de fichier TIFF ou TIF. La flexibilité du format TIFF est à la fois une bénédiction et une malédiction, car aucun lecteur ne lit chaque type de fichier TIFF. Les TIFF sont sans perte et sans perte; certaines offrent une compression sans perte relativement bonne pour les images à deux niveaux (noir et blanc). Certains appareils photo numériques peuvent enregistrer au format TIFF, en utilisant l'algorithme de compression LZW pour un stockage sans perte. Le format d'image TIFF n'est pas largement pris en charge par les navigateurs Web. Le format TIFF reste largement accepté en tant que norme de fichier photo dans l’imprimerie. Le format TIFF peut gérer des espaces colorimétriques spécifiques à un périphérique, tels que le CMJN défini par un ensemble particulier d'encres de presses à imprimer.

PNG Le format de fichier PNG (Portable Network Graphics) a été créé en tant que successeur libre et open source du GIF. Le format de fichier PNG prend en charge la couleur réelle (16 millions de couleurs), tandis que le format GIF ne prend en charge que 256 couleurs. Le fichier PNG excelle lorsque l’image présente de grandes zones uniformément colorées. Le format PNG sans perte convient mieux à la retouche d'images, et les formats avec perte, tels que JPG, conviennent mieux à la distribution finale des images photographiques, car les fichiers JPG sont plus petits que les fichiers PNG. De nombreux navigateurs plus anciens ne prennent actuellement pas en charge le format de fichier PNG. Cependant, avec Internet Explorer 7, tous les navigateurs Web actuels prennent entièrement en charge le format PNG. Adam7-entrelacement permet une prévisualisation rapide, même lorsque seul un faible pourcentage des données de l'image a été transmis.

GIF Le format GIF (Graphics Interchange Format) est limité à une palette de 8 bits ou à 256 couleurs. Cela rend le format GIF approprié pour stocker des graphiques avec relativement peu de couleurs telles que de simples diagrammes, des formes, des logos et des images de style dessin animé. Le format GIF prend en charge l'animation et est toujours largement utilisé pour fournir des effets d'animation d'image. Il utilise également une compression sans perte qui est plus efficace lorsque de grandes zones ont une seule couleur et inefficace pour les images détaillées ou les images tramées.

BMP Le format de fichier BMP (bitmap Windows) gère les fichiers graphiques dans le système d'exploitation Microsoft Windows. En règle générale, les fichiers BMP ne sont pas compressés et sont donc volumineux. l'avantage est leur simplicité, leur large acceptation et leur utilisation dans les programmes Windows.

Utiliser pour les pages Web/applications Web

Vous trouverez ci-dessous un bref résumé de ces formats d’image lors de leur utilisation avec une page Web/une application.

  • Le format PNG est idéal pour IE6 et les versions ultérieures (un petit correctif CSS sera nécessaire pour que la transparence fonctionne correctement). Idéal pour les illustrations et les photos.
  • JPG est idéal pour les photos en ligne
  • Le format GIF est utile pour les illustrations lorsque vous ne souhaitez pas passer au format PNG.
  • BMP ne doit pas être utilisé en ligne dans les pages Web - gaspille de la bande passante


  • Source: Formats de fichier image

    27
    Luke

    Depuis que d'autres ont couvert les différences, je vais utiliser les usages.

    Le format TIFF est généralement utilisé par les scanners. Cela fait d'énormes fichiers et n'est pas vraiment utilisé dans les applications.

    BMP est décompressé et crée également des fichiers volumineux. De plus, il n'est pas vraiment utilisé dans les applications.

    Auparavant, le format GIF était présent sur le Web, mais il n’était plus aussi populaire qu’il ne prend en charge qu’un nombre limité de couleurs et est breveté.

    JPG/JPEG est principalement utilisé pour tout ce qui concerne la qualité photo, mais pas pour le texte. La compression avec perte utilisée tend à effacer les lignes nettes.

    Le format PNG n’est pas aussi petit que le format JPEG, mais il est sans perte et convient donc aux images avec des lignes nettes. Il est couramment utilisé sur le Web maintenant.

    Personnellement, j'utilise généralement le format PNG partout où je peux. C'est un bon compromis entre JPG et GIF.

    5
    Dana Robinson

    JPG> Groupe mixte d’experts photographiques

    1 images JPG prenant en charge 16 millions de couleurs et mieux adaptées aux photographies et aux graphiques complexes

    2 JPG ne supportent pas la transparence.

    PNG> Portable Network Graphics

    1 Il est utilisé comme alternative au format de fichier GIF lorsque la technologie GIF était protégée par le droit d'auteur et devait être autorisée à être utilisée.

    2 Les fichiers PNG permettent une compression supérieure de 5 à 25% à celle des GIF et dans une gamme de couleurs plus étendue. Les PNG utilisent un entrelacement bidimensionnel, ce qui leur permet de se charger deux fois plus vite que les images GIF. ”

    3 Image comportant beaucoup de couleurs ou nécessitant une transparence variable avancée, le type de fichier préféré est PNG.

    GIF> Graphics Interchange Format

    1 Réduit le nombre de couleurs d'une image à 256.

    2 Les fichiers GIF prennent également en charge la transparence.

    3 Les fichiers GIF ont la capacité unique d’afficher une séquence d’images, similaire aux vidéos, appelée GIF animé.

    4 Si l'image a peu de couleurs et ne nécessite aucun effet de transparence alpha avancé, le format GIF est la solution.

    SVG> Graphiques vectoriels évolutifs

    1 Les SVG sont un standard Web basé sur XML qui décrit à la fois des images statiques et des animations en deux dimensions.

    2 SVG vous permet de créer des graphiques et des animations de très haute qualité qui ne perdent pas en détail lorsque leur taille augmente/diminue.

    2
    Dev

    Ces noms font référence à différentes manières de coder des données d'image pixel (JPG et JPEG sont la même chose, et le format TIFF peut simplement contenir un fichier jpeg avec des métadonnées supplémentaires).

    Ces formats d'image peuvent utiliser différents algorithmes de compression, différentes représentations de couleur, différentes capacités à transporter des données supplémentaires autres que l'image elle-même, etc.

    Pour les applications Web, je dirais que jpeg ou gif est suffisant. Jpeg est utilisé plus souvent en raison de son taux de compression plus élevé, et gif est généralement utilisé pour les animations légères où un flash (ou quelque chose de similaire) est un over kill ou un endroit où un fond transparent est souhaité. Le format PNG peut également être utilisé, mais je n’ai pas beaucoup d’expérience dans ce domaine. BMP et TIFF ne sont probablement pas de bons candidats pour les applications Web.

    1
    PolyThinker

    Qu'est-ce coobird et Gerald a dit.

    De plus, JPEG est le nom du format de fichier. JPG est couramment utilisé comme extension de fichier abrégée pour ce format, car vous deviez disposer d’une extension de fichier de 3 lettres pour les systèmes Windows antérieurs. De même avec TIFF et TIF.

    Les navigateurs Web, pour le moment, affichent uniquement les fichiers JPEG, PNG et GIF. Ce sont donc ceux-ci qui peuvent être affichés sur les pages Web.

    1
    Gnudiff

    Le format PNG prend en charge la transparence alpha-canal.

    Le format TIFF peut avoir des options étendues. Référencement géographique pour GIS applications.

    Je recommande d'utiliser uniquement le format JPEG pour les photographies, jamais pour les images telles que les images clipart, les logos, le texte, les diagrammes, les dessins au trait.

    Favoriser la PNG.

    1
    Roger Nelson

    Les noms nommés sont tous des graphiques raster, mais à côté de cela, n'oubliez pas les graphiques vectoriels de plus en plus importants. Il existe des types compressés et non compressés (plus ou moins), mais ils sont tous sans perte. Les plus importants sont:

    1
    Xn0vv3r

    L'extension de fichier vous indique comment l'image est enregistrée. Certains de ces formats ne font que sauvegarder les bits tels quels, d'autres compressent l'image de différentes manières, y compris les méthodes sans perte et avec perte. Le Web peut vous le dire, même si je sais que certains des patients répondeurs les expliqueront ici.

    Le Web favorise principalement les formats gif, jpg et png. JPEG est identique (ou très proche) à jpg.

    0
    gbarry

    Pour la différence et l'utilisation spécifiées entre les différents formats d'image, vous avez déjà une bonne discussion ci-dessus.

    Cependant, je souhaite ajouter quelque chose au processus global de capture d’une photo et de son stockage.

    Le processus de capture

    Ou vous pouvez dire le processus de construction (comme nous pouvons dessiner ou faire des images avec des ordinateurs maintenant). Si vous prenez une photo avec un appareil photo, vous utilisez déjà de nombreux capteurs (CCD ou CMOS) et algorithmes (filtre de motif Bayer, sous-échantillonnage et quantification, etc.). Il existe également des fonctions telles que Pixel Format et Color Space. Après avoir obtenu les informations de base sur les pixels, il doit exister un moyen de les stocker.

    La structure de base du fichier image

    Pour stocker les informations de pixels d'un fichier, nous avons besoin d'une convention et des algorithmes associés. Pour économiser de l’espace, il existe une compression, mais le problème fondamental est le codage des pixels en octets et le décodage des octets en pixels pour affichage.

    Un fichier image typique peut être constitué de plusieurs parties, essentiellement deux: meta data or file header et pixel data section. Le meta data parle de l'image elle-même, peut-être height et width, file format, etc. Et le pixel data section est le réel section qui traite avec le real picture.

    Stockage et affichage

    Comme nous l'avons dit précédemment, les fichiers sont stockés sur le disque dur et sont en octets/bits. Les fichiers image n'ont donc pas de priorité, mais ils octroient également un flux d'octets. Pour l'affichage, nous devrions peut-être obtenir quelque chose pour savoir comment fonctionne le moniteur. Les moniteurs PC classiques utilisent un modèle RVB pour l'affichage.

    J'espère que cela t'aides:-)

    0
    Lihang Li