43 votos

JPEG vs PNG vs BMP vs GIF vs SVG

Me gustaría saber cuál de estos formatos requiere menos memoria para la misma calidad de la imagen, y cuáles son las principales diferencias entre estos formatos.

76voto

paulgreg Puntos 5271

Al estilo de xkcd de lbrandy.com :

alt text

67voto

Cory R. King Puntos 1634

Debe tener en cuenta algunos factores clave...

En primer lugar, hay dos tipos de compresión: Sin pérdidas y Con pérdidas .

  • Sin pérdidas significa que la imagen se hace más pequeña, pero sin perjuicio de la calidad.
  • Con pérdidas significa que la imagen se hace (incluso) más pequeña, pero en detrimento de la calidad. Si guardas una imagen en formato Lossy una y otra vez, la calidad de la imagen empeorará progresivamente.

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

  • Indexado significa que la imagen sólo puede almacenar un número limitado de colores (normalmente 256), controlado por el autor, en algo llamado Mapa de Color
  • Directo significa que puede almacenar muchos miles de colores que no han sido elegidos directamente por el autor

BMP - Sin pérdidas / indexado y directo

Este es un formato antiguo. No tiene pérdidas (no se pierden datos de la imagen al guardarla), pero tampoco hay mucha o ninguna compresión, lo que significa que guardar como BMP da lugar a 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 utiliza realmente este formato.

Es bueno para: En realidad, para nada. No hay nada en lo que BMP destaque, o que no se haga mejor en otros formatos.

BMP vs GIF


GIF - Sin pérdidas / sólo indexado

El GIF utiliza una compresión sin pérdidas, lo que significa que se puede guardar la imagen una y otra vez sin perder ningún dato. El tamaño de los archivos es mucho menor que el de BMP, porque se utiliza una buena compresión, pero sólo puede almacenar una paleta indexada. Esto significa que para la mayoría de los casos de uso En el archivo sólo puede haber un máximo de 256 colores diferentes. Parece una cantidad muy pequeña, y lo es.

Las imágenes GIF también pueden ser animadas y tener transparencia.

Bueno para: Logotipos, dibujos lineales y otras imágenes sencillas que necesitan ser pequeñas. Sólo se utiliza realmente para sitios web.

GIF vs JPEG


JPEG - Con pérdidas / Directo

Las imágenes JPEG se diseñaron para que las imágenes fotográficas detalladas fueran lo más pequeñas posible, eliminando la información que el ojo humano no percibe. Como resultado, es un formato con pérdidas, y guardar el mismo archivo una y otra vez hará que se pierdan más datos con el tiempo. Tiene una paleta de miles de colores, por lo que es ideal para las fotografías, pero la compresión con pérdidas es mala para los logotipos y los dibujos lineales: No sólo se verán borrosos, sino que también tendrán un mayor tamaño de archivo en comparación con los GIF.

Es bueno para: Fotografías. También para los degradados.

JPEG vs GIF


PNG-8 - Sin pérdidas / indexado

PNG es un formato más reciente, y PNG-8 (la versión indexada de PNG) es realmente un buen sustituto de los GIF. Lamentablemente, sin embargo, tiene algunos inconvenientes: En primer lugar, no puede soportar la animación como el GIF (bueno, puede, pero sólo Firefox parece soportarlo, a diferencia de la animación GIF que es soportada por todos los navegadores). En segundo lugar, tiene algunos problemas de compatibilidad con navegadores antiguos como IE6. En tercer lugar, programas importantes como Photoshop tienen una implementación muy pobre del formato. (¡Maldito seas, Adobe!) PNG-8 sólo puede almacenar 256 colores, como los GIF.

Es bueno para: Lo principal que hace PNG-8 mejor que los GIF es tener soporte para la transparencia alfa.

PNG-8 vs GIF

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


PNG-24 - Sin pérdidas / Directo

PNG-24 es un gran formato que combina la codificación sin pérdidas con el color directo (miles de colores, como JPEG). Es muy parecido a BMP en ese sentido, salvo que PNG realmente comprime las imágenes, por lo que resulta en archivos mucho más pequeños. Desgraciadamente, los archivos PNG-24 seguirán siendo mucho más grandes que los JPEG, GIF y PNG-8, por lo que hay que considerar si realmente se quiere utilizar.

Aunque los PNG-24 permiten miles de colores y tienen compresión, no están pensados para sustituir a las imágenes JPEG. Una fotografía guardada como PNG-24 será probablemente al menos 5 veces mayor que una imagen JPEG equivalente, con muy poca mejora en la calidad visible. (Por supuesto, esto puede ser un resultado deseable si no le preocupa el tamaño de los archivos y quiere obtener la mejor calidad de imagen posible).

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


SVG - Sin pérdidas / Vectorial

Un tipo de archivo que actualmente está creciendo en popularidad es SVG, que es diferente a todos los anteriores en que es un vector formato de archivo (los anteriores son todos raster ). Esto significa que en realidad se compone de líneas y curvas en lugar de píxeles. Cuando se amplía una imagen vectorial, se sigue viendo una curva o una línea. Cuando se amplía una imagen rasterizada, se ven píxeles.

Por ejemplo:

PNG vs SVG

SVG vs PNG

Esto significa que SVG es perfecto para los logotipos e iconos que desean mantener la nitidez en las pantallas Retina o en diferentes tamaños.

Además, los archivos SVG se escriben utilizando XML, por lo que pueden abrirse y editarse en un editor de texto, de modo que pueden manipularse sobre la marcha, si se desea. Por ejemplo, puede utilizar JavaScript para cambiar el color de un icono SVG en un sitio web de la misma manera que lo haría con un texto (es decir, sin necesidad de una segunda imagen).

Espero que eso ayude.

54voto

Louis Puntos 121

Desde ¿Cuál es la diferencia entre TIFF, GIF, JPG, JPEG, PNG y un archivo BMP?

BMP - Mapa de bits. Este fue probablemente el primer tipo de formato de imagen digital que puedo recordar. Todas las imágenes en un ordenador parecían ser un BMP en aquellos días. En Windows XP el programa Paint guarda sus imágenes automáticamente en BMP. Sin embargo, en Windows Vista y posteriores las imágenes se guardan ahora en JPEG. BMP es la plataforma base para muchos otros tipos de archivos.

JPG / JPEG - (Joint Photographic Experts Group) El formato Jpeg se utiliza para fotografías en color, o cualquier imagen con muchas mezclas o degradados. No es bueno con los bordes nítidos y tiende a difuminarlos un poco a menos que se almacene a alta calidad. Este formato se popularizó con la invención de la cámara digital. La mayoría de las cámaras digitales, si no todas, descargan las fotos en el ordenador como archivo Jpeg. Obviamente, los fabricantes de cámaras digitales ven el valor de las imágenes de alta calidad que, en última instancia, ocupan menos espacio.

GIF - (Graphics Interchange Format) El formato Gif es el más adecuado para textos, dibujos lineales, capturas de pantalla, dibujos animados y animaciones. El formato Gif está limitado a un número total de 256 colores o menos, por lo que las imágenes Gif son relativamente pequeñas. Se suele utilizar para páginas web de carga rápida. También es un buen banner o logotipo para tu página web. Las imágenes animadas también pueden guardarse en formato GIF como una secuencia de imágenes estáticas. Por ejemplo, un banner intermitente se guardaría como un archivo Gif.

PNG - (Portable Networks Graphic) Este formato sin pérdidas es uno de los mejores formatos de imagen. No siempre fue compatible con todos los navegadores web o software de imagen, pero hoy en día es el mejor formato de imagen para usar en sitios web. Yo uso el .png para logotipos y capturas de pantalla. Una de sus capacidades más sorprendentes es poder comprimir las imágenes sin pérdida (sin pérdida de píxeles), aunque el tamaño final tamaño comprimido varía entre los editores de imágenes.

TIFF - (Tagged Image File Format) Este formato de archivo no se ha actualizado desde 1992 y ahora es propiedad de Adobe. Puede almacenar una imagen y datos (etiquetas) en un solo archivo. TIFF puede comprimirse, pero es más bien su capacidad para almacenar datos de imagen en un formato sin pérdidas lo que hace que un archivo TIFF sea un archivo de imagen útil, porque a diferencia de los archivos JPEG estándar, un archivo TIFF que utiliza la compresión sin pérdidas (o ninguna) puede editarse y volver a guardarse sin perder la calidad de la imagen. Este archivo se utiliza habitualmente para escanear, enviar faxes, procesar textos, etc. Ya no es un formato de archivo común para usar con tus fotos digitales, ya que el jpeg es de gran calidad y ocupa menos espacio.

30voto

Ferruccio Puntos 51508

Las respuestas existentes incluyen muy pocos datos técnicos, así que los incluiré aquí.

  • JPEG Hasta 24 bits de color (¿posiblemente más?), compresión variable (normalmente alta), con pérdidas, sin soporte de alfa
  • PNG Hasta 48 bits de color, compresión moderada, sin pérdidas, soporte alfa
  • BMP Hasta 24 bits de color, muy poca compresión, sin pérdidas, soporte alfa
  • GIF Hasta 8 bits de color, poca compresión, sin pérdidas, soporte de transparencia, soporte de animación

Profundidad de color

  • Color de 8 bits == 256 colores
  • Color de 24 bits == 16.777.216 colores
  • Color de 48 bits == 281.474.976.710.656 colores

La mayoría de los monitores de ordenador funcionan con una profundidad de color de 24 bits. El ojo humano puede distinguir aproximadamente esa cantidad de colores. La profundidad de color adicional es principalmente para poder retener la información de un sensor, de modo que la manipulación de una fotografía tenga más datos con los que trabajar. Tratar de representar una fotografía en color de 8 bits va a dar lugar a una granulación.

Compresión

Esto se refiere básicamente a lo grande que será el archivo final. Una mayor compresión equivale a un archivo más pequeño. Sin embargo, el JPEG consigue tamaños de archivo pequeños desechando datos. Esto se conoce como compresión "con pérdidas", porque nunca se pueden recuperar los datos originales sin comprimir. Su compresión también está optimizada para fotografías en las que los bordes de alto contraste son poco comunes. Como se ha dicho en otras respuestas, es una mala opción para todo lo que no sean fotografías.

Alfa/Transparencia

Alfa se refiere a la transparencia, pero implica que hay más de un nivel de transparencia. El GIF tiene la capacidad de definir píxeles transparentes, pero es opaco o 100% transparente, y "transparente" se utiliza como uno de los 256 colores. PNG y BMP tienen la capacidad de marcar cada píxel como opaco, transparente o parcialmente transparente, como un trozo de vidrio de color. Lo más habitual es que haya 256 niveles de transparencia, aunque PNG puede tener hasta 65.536 niveles. JPEG no tiene soporte para la transparencia.

Animación

Efectivamente, de estos formatos, sólo el GIF tiene soporte para la animación. Existen especificaciones para la animación con PNG (MNG, APNG) y JPEG (MJPEG), pero no están ampliamente soportadas. (APNG funciona en versiones recientes de Firefox y Opera.) En la práctica, la mayoría de las animaciones que se ven en las páginas web están implementadas en Flash.

25voto

lluismontero Puntos 998
  • Utilice GIF si la imagen tiene pocos colores (como los iconos). También puede utilizarse para imágenes animadas (como los banners publicitarios).
  • Utilice JPG si la imagen tiene muchos colores (como las fotos). JPEG es lo mismo.
  • Utilice BMP si desea guardar la imagen sin compresión. El tamaño de los archivos es mucho mayor.
  • Utilice PNG si quiere publicar la imagen en la web y estar al día con los estándares modernos. Ventajas: Es adecuado como sustituto moderno del GIF y el JPG, es un estándar abierto y permite la transparencia. Contras: No es compatible con los programas más antiguos, y el tamaño del archivo puede ser mayor que el de los GIF o JPG comparables.

EnMiMaquinaFunciona.com

EnMiMaquinaFunciona es una comunidad de administradores de sistemas en la que puedes resolver tus problemas y dudas.
Puedes consultar las preguntas de otros sysadmin, hacer tus propias preguntas o resolver las de los demás.

Powered by:

X