¿Cuál es la diferencia entre la imagen “JPG” / “JPEG” / “PNG” / “BMP” / “GIF” / “TIFF”?

102

He visto muchos tipos de extensiones de imagen pero nunca he entendido las diferencias reales entre ellas. ¿Hay enlaces que expliquen claramente sus diferencias?

¿Hay estándares a considerar al elegir un tipo particular de imagen para usar en una aplicación? ¿Qué usamos para las aplicaciones web?

MOZILLA
fuente
Alguien con una mejor reputación que yo debería revisar estas respuestas y consolidarlas.
Dana Robinson
Aquí está su respuesta: stackoverflow.com/questions/2336522/…
Chuck Le Butt
Esa pregunta está cerrada y podría terminar eliminada. La misma respuesta está a continuación y debe aceptarse como respuesta OMI.
Toxalot

Respuestas:

91

Si. Son diferentes formatos de archivo (y sus extensiones de archivo).

Las entradas de Wikipedia para cada uno de los formatos le darán bastante información:

  • JPEG (o JPG, para la extensión del archivo; Joint Photographic Experts Group)
  • PNG (gráficos de red portátiles)
  • BMP (mapa de bits)
  • GIF (formato de intercambio de gráficos)
  • TIFF (o TIF, para la extensión del archivo; formato de archivo de imagen con etiquetas)

Los formatos de imagen se pueden dividir en tres categorías amplias:

  • compresión con pérdida,
  • compresión sin perdidas,
  • descomprimido

Los formatos no comprimidos ocupan la mayor cantidad de datos, pero son representaciones exactas de la imagen. Los formatos de mapa de bits como BMP generalmente no están comprimidos, aunque también hay archivos BMP comprimidos.

Los formatos de compresión con pérdida son generalmente adecuados para fotografías. No es adecuado para ilustraciones, dibujos y texto, ya que se destacarán los artefactos de compresión al comprimir la imagen. La compresión con pérdida, como su nombre lo indica, no codifica toda la información del archivo, por lo que cuando se recupera en una imagen, no será una representación exacta del original. Sin embargo, es capaz de comprimir imágenes de manera muy efectiva en comparación con los formatos sin pérdida, ya que descarta cierta información. Un excelente ejemplo de formato de compresión con pérdida es JPEG.

Los formatos de compresión sin pérdida son adecuados para ilustraciones, dibujos, texto y otro material que no se vería bien cuando se comprime con compresión con pérdida. Como su nombre lo indica, la compresión sin pérdida codificará toda la información del original, por lo que cuando la imagen se descomprima, será una representación exacta del original. Como no hay pérdida de información en la compresión sin pérdida, no se puede lograr una compresión tan alta como la compresión con pérdida, en la mayoría de los casos. Ejemplos de compresión de imágenes sin pérdida son PNG y GIF. (GIF solo permite imágenes de 8 bits).

TIFF y BMP son formatos "envoltorios", ya que los datos que contienen pueden depender de la técnica de compresión que se utilice. Puede contener imágenes comprimidas y sin comprimir.

El momento de utilizar un determinado formato de compresión de imagen depende realmente de lo que se esté comprimiendo.

Pregunta relacionada: Comprimir sin piedad imágenes grandes para la web

coobird
fuente
No creo que BMP sea un formato 'contenedor' en la forma en que lo es TIFF (o PDF es para eso), ni que se pueda comprimir (quiero decir, puede ZIP, pero no contiene datos comprimidos ).
ChrisW
2
@ChrisW: BMP permite comprimir el contenido del archivo. Acabo de echar un vistazo a la página de Wikipedia a la que hice referencia y es compatible con RLE, PNG y JPEG. (No sabía que admitía contenido PNG y JPEG, ¡aprendí algo nuevo!)
coobird
2
BMP generalmente sufre el mismo problema que WAV, ambos nunca están estandarizados y, por lo tanto, se abusa de casi todo lo que se le ocurra.
Jasper Bekkers
3
@PhilWhittington Estás confundiendo el objeto de mapa de bits con el formato de archivo. La clase de mapa de bits guarda en muchos formatos diferentes, incluidos BMP, TIFF y PNG, pero guarda desde un objeto de mapa de bits (es decir, los datos de píxeles sin procesar). No existe un PNG dentro de un archivo BMP.
Chuck Le Butt
1
@Monk msdn.microsoft.com/en-us/library/windows/desktop/… y busque "biCompression". Esta estructura C se almacena byte por byte en un archivo BMP, por lo que los archivos BMP también pueden admitir esos tipos de compresión. El hecho de que nadie los use no significa que no sean válidos.
user253751
78

Debe tener en cuenta algunos factores clave ...

Primero, hay dos tipos de compresión: Lossless y Lossy .

Sin pérdida significa que la imagen se hace más pequeña, pero sin detrimento de la calidad. Con pérdida significa que la imagen se hace (incluso) más pequeña, pero en detrimento de la calidad. Si guarda una imagen en un formato con pérdida una y otra vez, la calidad de la imagen empeorará progresivamente.

También hay diferentes profundidades de color (paletas): color indexado y color directo .

Con Indexado significa que la imagen solo puede almacenar un número limitado de colores (generalmente 256) que son elegidos por el autor de la imagen, con Direct significa que puede almacenar muchos miles de colores que no han sido elegidos por el autor.


BMP : sin pérdidas / indexado y directo

Este es un formato antiguo. No tiene pérdida (no se pierden datos de imagen al guardar), pero también hay poca o ninguna compresión, lo que significa que guardar como BMP da como resultado tamaños de archivo MUY grandes. Puede tener paletas tanto indexadas como directas, pero eso es un pequeño consuelo. Los tamaños de los archivos son tan innecesariamente grandes que nadie usa realmente este formato.

Bueno para: Nada realmente. No hay nada en lo que BMP se destaque, o no lo hagan mejor otros formatos.

BMP vs GIF


GIF - Sin pérdida / Solo indexado

GIF utiliza compresión sin pérdida, lo que significa que puede guardar la imagen una y otra vez y nunca perder ningún dato. Los tamaños de archivo son mucho más pequeños que BMP, porque en realidad se usa una buena compresión, pero solo puede almacenar una paleta indexada. Esto significa que solo puede haber un máximo de 256 colores diferentes en el archivo. Eso suena como una cantidad bastante pequeña, y lo es.

Las imágenes GIF también se pueden animar y tener transparencia.

Bueno para: logotipos, dibujos lineales y otras imágenes simples que deben ser pequeñas. Solo se usa realmente para sitios web.

GIF vs JPEG


JPEG : con pérdida / directo

Las imágenes JPEG se diseñaron para hacer que las imágenes fotográficas detalladas sean lo más pequeñas posible al eliminar información que el ojo humano no notará. Como resultado, es un formato con pérdida y, al guardar el mismo archivo una y otra vez, se perderán más datos con el tiempo. Tiene una paleta de miles de colores y, por lo tanto, es ideal para fotografías, pero la compresión con pérdida significa que es mala para los logotipos y los dibujos de líneas: no solo se verán borrosos, sino que estas imágenes también tendrán un tamaño de archivo más grande en comparación con los GIF.

Bueno para: fotografías. Además, degradados.

JPEG vs GIF


PNG-8 - Sin pérdida / indexado

PNG es un formato más nuevo y PNG-8 (la versión indexada de PNG) es realmente un buen reemplazo para los GIF. Lamentablemente, sin embargo, tiene algunos inconvenientes: en primer lugar, no puede admitir animaciones como GIF (bueno, puede, pero solo Firefox parece admitirlo, a diferencia de la animación GIF que es compatible con todos los navegadores). En segundo lugar, tiene algunos problemas de soporte con navegadores más antiguos como IE6. En tercer lugar, software importante como Photoshop tiene una implementación muy pobre del formato. (¡Maldito seas, Adobe!) PNG-8 solo puede almacenar 256 colores, como GIF.

Bueno para: Lo principal en lo que PNG-8 hace mejor que los GIF es tener soporte para Transparencia Alfa.

PNG-8 frente a GIF

Nota importante: Photoshop no admite la transparencia alfa para archivos PNG-8. (¡Maldito seas, Photoshop!) Sin embargo, existen formas de convertir archivos PNG-24 a PNG-8 de Photoshop conservando su transparencia. Un método es PNGQuant , otro es guardar sus archivos con Fireworks .


PNG-24 - Sin pérdidas / Directo

PNG-24 es un gran formato que combina la codificación sin pérdida con el color directo (miles de colores, como JPEG). Es muy parecido a BMP en ese sentido, excepto que PNG en realidad comprime imágenes, por lo que da como resultado archivos mucho más pequeños. Desafortunadamente, los archivos PNG-24 seguirán siendo mucho más grandes que los archivos JPEG, GIF y PNG-8, por lo que aún debe considerar si realmente desea usar uno.

Aunque los PNG-24 permiten miles de colores mientras tienen compresión, no están destinados a reemplazar las imágenes JPEG. Una fotografía guardada como PNG-24 probablemente será al menos 5 veces más grande que una imagen JPEG equivalente, lo que mejora muy poco la calidad visible. (Por supuesto, este puede ser un resultado deseable si no le preocupa y desea obtener la mejor calidad de imagen posible).

Al igual que PNG-8, PNG-24 también admite transparencia alfa.

¡Espero que eso ayude!

Chuck Le Butt
fuente
8
+1 Lo único que falta para que sea una respuesta completa a la pregunta de OP es una mención para JPG (extensión de archivo común para JPEG) y una sección para TIFF.
Toxalot
2
También mencionaré que la compresión PNG es buena en situaciones inesperadas. Por ejemplo, los degradados son altamente comprimibles con PNG.
Henry Merriam
27

Generalmente estos son:

Compresión sin pérdida Los algoritmos de compresión sin pérdida reducen el tamaño del archivo sin perder calidad de imagen, aunque no se comprimen en un archivo tan pequeño como un archivo de compresión con pérdida. Cuando la calidad de la imagen se valora por encima del tamaño del archivo, normalmente se eligen algoritmos sin pérdida.

Compresión con pérdida Los algoritmos de compresión con pérdida aprovechan las limitaciones inherentes del ojo humano y descartan la información invisible. La mayoría de los algoritmos de compresión con pérdida permiten niveles de calidad variables (compresión) y, a medida que estos niveles aumentan, el tamaño del archivo se reduce. En los niveles de compresión más altos, el deterioro de la imagen se vuelve notable como "artefactos de compresión". Las imágenes a continuación demuestran el artefacto notable de los algoritmos de compresión con pérdida; seleccione la imagen en miniatura para ver la versión en tamaño completo.

Cada formato es diferente como se describe a continuación:

JPEG Los archivos JPEG (Joint Photographic Experts Group) son (en la mayoría de los casos) un formato con pérdida; la extensión del nombre de archivo de DOS es JPG (otros sistemas operativos pueden usar JPEG). Casi todas las cámaras digitales pueden guardar imágenes en formato JPEG, que admite 8 bits por color (rojo, verde, azul) para un total de 24 bits, lo que produce archivos relativamente pequeños. Cuando no es demasiado grande, la compresión no disminuye notablemente la calidad de la imagen, pero los archivos JPEG sufren degradación generacional cuando se editan y guardan repetidamente. Las imágenes fotográficas pueden almacenarse mejor en un formato que no sea JPEG sin pérdidas si se vuelven a editar o si los pequeños "artefactos" (imperfecciones causadas por el algoritmo de compresión de JPEG) son inaceptables. El formato JPEG también se utiliza como algoritmo de compresión de imágenes en muchos archivos PDF de Adobe.

TIFF El TIFF (Tagged Image File Format) es un formato flexible que normalmente guarda 8 bits o 16 bits por color (rojo, verde, azul) para totales de 24 bits y 48 bits, respectivamente, utilizando los nombres de archivo TIFF o TIF. . La flexibilidad de TIFF es tanto una bendición como una maldición, porque ningún lector lee todos los tipos de archivos TIFF. Los TIFF tienen pérdidas y no tienen pérdidas; algunos ofrecen una compresión sin pérdidas relativamente buena para imágenes de dos niveles (blanco y negro). Algunas cámaras digitales pueden guardar en formato TIFF, utilizando el algoritmo de compresión LZW para un almacenamiento sin pérdidas. El formato de imagen TIFF no es ampliamente compatible con los navegadores web. TIFF sigue siendo ampliamente aceptado como estándar de archivo de fotografías en el negocio de la impresión. El TIFF puede manejar espacios de color específicos del dispositivo, como el CMYK definido por un conjunto particular de tintas de imprenta.

PNG El formato de archivo PNG (Portable Network Graphics) se creó como el sucesor de código abierto gratuito del GIF. El formato de archivo PNG admite truecolor (16 millones de colores), mientras que el GIF solo admite 256 colores. El archivo PNG se destaca cuando la imagen tiene áreas grandes de color uniforme. El formato PNG sin pérdida es el más adecuado para editar imágenes, y los formatos con pérdida, como JPG, son los mejores para la distribución final de imágenes fotográficas, porque los archivos JPG son más pequeños que los archivos PNG. Actualmente, muchos navegadores antiguos no admiten el formato de archivo PNG; sin embargo, con Internet Explorer 7, todos los navegadores web actuales admiten el formato PNG. El entrelazado Adam7 permite una vista previa temprana, incluso cuando solo se ha transmitido un pequeño porcentaje de los datos de la imagen.

GIF GIF (Formato de intercambio de gráficos) está limitado a una paleta de 8 bits o 256 colores. Esto hace que el formato GIF sea adecuado para almacenar gráficos con relativamente pocos colores, como diagramas simples, formas, logotipos e imágenes de estilo de dibujos animados. El formato GIF admite animación y todavía se usa ampliamente para proporcionar efectos de animación de imágenes. También utiliza una compresión sin pérdidas que es más eficaz cuando grandes áreas tienen un solo color e ineficaz para imágenes detalladas o difuminadas.

BMP El formato de archivo BMP (mapa de bits de Windows) maneja archivos gráficos dentro del sistema operativo Microsoft Windows. Normalmente, los archivos BMP no están comprimidos, por lo que son grandes; la ventaja es su simplicidad, amplia aceptación y uso en programas de Windows.

Uso para páginas web / aplicaciones web

El siguiente es un breve resumen de estos formatos de imagen cuando los usa con una página web / aplicación.

  • PNG es excelente para IE6 y versiones posteriores (requerirá un pequeño parche CSS para que la transparencia funcione bien). Ideal para ilustraciones y fotografías.
  • JPG es ideal para fotos en línea
  • GIF es bueno para ilustraciones cuando no desea pasar a PNG
  • BMP no debe usarse en línea en páginas web: desperdicia ancho de banda


  • Fuente: formatos de archivo de imagen

    Luke
    fuente
    5

    Dado que otros han cubierto las diferencias, apuntaré a los usos.

    Los escáneres suelen utilizar TIFF. Crea archivos enormes y no se usa realmente en aplicaciones.

    BMP no está comprimido y también crea archivos enormes. Tampoco se usa realmente en aplicaciones.

    GIF solía estar en toda la web, pero ha caído en desgracia ya que solo admite un número limitado de colores y está patentado.

    JPG / JPEG se usa principalmente para cualquier cosa que tenga calidad fotográfica, aunque no para texto. La compresión con pérdida utilizada tiende a estropear las líneas nítidas.

    PNG no es tan pequeño como JPEG pero no tiene pérdidas, por lo que es bueno para imágenes con líneas nítidas. Es de uso común en la web ahora.

    Personalmente, suelo utilizar PNG en todos los lugares que puedo. Es un buen compromiso entre JPG y GIF.

    Dana Robinson
    fuente
    BMP se puede comprimir con RLE ... Eso no es mucho, pero es efectivo en imágenes simples. También es un formato propietario (Microsoft).
    PhiLho
    4
    La patente GIF expiró en 2004.
    Dour High Arch
    1
    TIFF es muy popular entre las personas que necesitan calidad sin pérdidas (artistas). También es excelente para comprimir imágenes monocromas, por lo que es uno de los formatos más populares para software de escaneo de documentos / fax digital.
    Vilx-
    1
    En la última especificación, BMP también permite que los contenidos estén comprimidos en PNG o JPEG.
    Vilx-
    2

    JPG> Grupo conjunto de expertos en fotografía

    1 Las imágenes JPG admiten 16 millones de colores y son las más adecuadas para fotografías y gráficos complejos

    2 JPG no admiten transparencia.

    PNG> Gráficos de red portátiles

    1 Se utiliza como alternativa al formato de archivo GIF cuando la tecnología GIF tenía derechos de autor y requería permiso para su uso.

    2 Los PNG permiten una compresión de 5 a 25 por ciento mayor que los GIF y con una gama más amplia de colores. Los PNG utilizan entrelazado bidimensional, lo que hace que se carguen dos veces más rápido que las imágenes GIF ".

    3 Imagen que tiene muchos colores o requiere transparencia variable avanzada, PNG es el tipo de archivo preferido.

    GIF> Formato de intercambio de gráficos

    1 Reduce el número de colores de una imagen a 256.

    2 GIF también admiten transparencia.

    3 Los GIF tienen la capacidad única de mostrar una secuencia de imágenes, similar a los videos, llamada GIF animado.

    4 Si la imagen tiene pocos colores y no requiere ningún efecto de transparencia alfa avanzado, GIF es el camino a seguir.

    SVG> Gráficos vectoriales escalables

    1 Los SVG son un estándar web basado en XML que describe tanto imágenes estáticas como animaciones en dos dimensiones.

    2 SVG te permite crear gráficos y animaciones de muy alta calidad que no pierden detalle a medida que su tamaño aumenta / disminuye.

    Dev
    fuente
    1

    Estos nombres se refieren a diferentes formas de codificar datos de imágenes de píxeles (JPG y JPEG son lo mismo, y TIFF puede incluir un jpeg con algunos metadatos adicionales).

    Estos formatos de imagen pueden utilizar diferentes algoritmos de compresión, diferentes representaciones de color, diferentes capacidades para transportar datos adicionales distintos de la imagen en sí, etc.

    Para las aplicaciones web, diría que jpeg o gif es lo suficientemente bueno. Jpeg se usa con más frecuencia debido a su mayor relación de compresión, y gif se usa típicamente para animaciones livianas donde un flash (o algo similar) es una muerte excesiva, o lugares donde se desea un fondo transparente. También se puede usar PNG, pero no tengo mucha experiencia con eso. BMP y TIFF probablemente no sean buenos candidatos para aplicaciones web.

    PolyThinker
    fuente
    1

    Lo que dijeron Coobird y Gerald.

    Además, JPEG es el nombre del formato de archivo. JPG es la extensión de archivo abreviada de uso común para este formato, ya que necesitaba tener una extensión de archivo de 3 letras para los sistemas Windows anteriores. Lo mismo ocurre con TIFF y TIF.

    Los navegadores web en este momento solo muestran archivos JPEG, PNG y GIF, por lo que esos son los que se pueden mostrar en las páginas web.

    Gnudiff
    fuente
    El soporte del navegador no se limita a JPEG, PNG y GIF: formatos como BMP, ICO, SVG y XBM, entre otros, son compatibles de forma nativa en muchos navegadores.
    scronide
    Bastante justo, debería haber dicho que JPEG, GIF y PNG son los formatos que son compatibles con la mayoría de los navegadores.
    Gnudiff
    1

    PNG admite transparencia de canal alfa.

    TIFF puede tener opciones extendidas, es decir, referencia geográfica para aplicaciones GIS .

    Recomiendo usar solo JPEG para fotografías, nunca para imágenes como imágenes prediseñadas, logotipos, texto, diagramas, arte lineal.

    Favorecer PNG.

    Roger Nelson
    fuente
    1

    Los nombrados son todos gráficos rasterizados, pero además de eso, no olvides los cada vez más importantes gráficos vectoriales. Hay tipos comprimidos y sin comprimir (de una forma más o menos), pero todos son sin pérdidas. Los más importantes son:

    Xn0vv3r
    fuente
    0

    La extensión del archivo le dice cómo se guarda la imagen. Algunos de esos formatos simplemente guardan los bits tal como están, algunos comprimen la imagen de diferentes maneras, incluidos los métodos sin pérdida y con pérdida. La Web puede decírselo, aunque sé que algunos de los pacientes que respondieron los describirán aquí.

    La web prefiere gif, jpg y png, principalmente. JPEG es igual (o muy parecido) a jpg.

    gbarry
    fuente
    0

    Para la diferencia especificada y el uso entre los diferentes formatos de imagen, tenga una buena discusión arriba.

    Sin embargo, quiero agregar algo para el proceso general de capturar una imagen y almacenarla.

    El proceso de captura

    O puede decir el proceso de construcción (como ahora podemos dibujar o hacer imágenes con computadoras). Si toma una fotografía con una cámara, ya está utilizando muchos sensores (CCD o CMOS) y algoritmos (filtro de patrón Bayer, submuestreo y cuantificación, etc.). También hay cosas como Pixel Formaty Color Space. Después de obtener la información básica de píxeles, debe haber una forma de almacenarlos.

    La estructura básica del archivo de imagen

    Para almacenar la información de píxeles en un archivo, necesitamos una convención y algoritmos relacionados. Para ahorrar espacio, hay compresión, pero básicamente el problema es codificar los píxeles en bytes y decodificar los bytes en píxeles para su visualización.

    Un archivo de imagen típico puede constar de varias partes, básicamente dos: meta data or file headery pixel data section. El meta datahabla acerca de la imagen en sí, tal vez heighty width, file format, etc, y el pixel data sectiones el verdadero sectionque se ocupa de la real picture.

    Almacenamiento y visualización

    Como dijimos anteriormente, los archivos se almacenan en el disco duro y están en bytes / bits. Por lo tanto, los archivos de imagen no tienen prioridad, sino también el flujo de bytes. Para mostrar, tal vez deberíamos obtener algo para saber cómo funciona el monitor. Los monitores de PC típicos utilizan el modelo RGB para la visualización.

    Espero que esto ayude:-)

    Lihang Li
    fuente