Muchos conocemos las características de cada formato y por qué debemos elegir algunos para la alta resolución, otros por su peso y hasta por la compatibilidad de navegadores, les comparto algunas factores para comprender las diferencias de los formatos de imagen y que me comenten sobre qué formato prefieren utilizar y por qué.

GIF y sus 256 colores:

Son las siglas para Graphics Interchange Format. Este formato puede contener hasta 256 colores. Por esta razón, GIF no es un buen formato para guardar fotografías que puedan tener más que esa cantidad de colores, puesto que perderían gravemente su calidad.

Es útil para guardar imágenes que tengan grandes bloques de colores planos como ilustraciones simples o logotipos para alguna compañía. Además, permite preservar la transparencia. El formato GIF usa un algoritmo de compresión LZW. Esta es una de las razones por las que el uso del formato PNG se está volviendo más popular, puesto que este algoritmo estaba patentado y los fabricantes de software que utilizaban imágenes GIF debían pagar regalías a Unisys, la propietaria de los derechos.

Características del formato JPEG:

Son las siglas para Joint Photographic Experts Group, un format utilizado para compartir fotografías y otras imágenes con tonos continuos en la web. Este formato da soporte a los modelos de color CMYK (cyan-magenta-yellow-cyan) y RGB (red-green-blue), además de modelos en escala de grises, lo que amplía por mucho la gama de tonalidades que podemos obtener.

El formato JPEG comprime el tamaño del archivo final utilizando un algoritmo de compresión con pérdida. Es decir, que para representar cierta cantidad de información (en este caso de color), se utiliza una menor cantidad de la misma. En la mayoría de programas para edición de imágenes es posible especificar qué tanta compresión y pérdida de calidad quieres para tu archivo. Lo más probable es que si utilizas la opción de máxima compresión, la imagen resultante sea difícil de reconocer, pero se puede utilizar una configuración que reduzca el tamaño de archivo pero que produzca una imagen relativamente buena.

Transparencias usando PNG:

Son las siglas para Portable Network Graphics, que intenta reunir características de los anteriores formatos. Su desarrollo se basó en GIF, para evitar la pérdida de información al comprimir los archivos y es un formato con creciente popularidad para desarrolladores web.

Sin embargo, a diferencia de GIF, PNG soporta imágenes de 24 bits y permite preservar la transparencia sin asperezas en los bordes. El problema es que algunos navegadores de internet antiguos no permiten visualizar este formato.PNG soporta imágenes RGB, con colores indexados, en escalas de grises y en modo de mapa de bits.

Veamos las diferencias

Utilizaré una imagen para demostrar de forma gráfica las diferencias entre uno y otro formato.

1. Fotografía guardada como GIF de 256 colores. El tamaño de archivo es 71.77K.

Crayones en formato GIF

2. Fotografía guardada como JPEG con un preset de alta calidad. El tamaño es 24.28K.

Crayones en formato JPG (High)

3. Fotografía guardada como PNG8 en un archivo de 62.64K.

Crayones en formato PNG-8

4. Fotografía guardada como PNG24 en un archivo de 211K.

Crayones en formato PNG-24

Entonces, ¿cuál formato es para mí?

Para terminar, podemos concluir lo siguiente sobre el uso de imágenes para la web. Lo que buscamos es un punto medio entre calidad y tamaño de archivo:

  • JPEG nos sirve para manipular y compartir archivos de imagen de tipo fotográfico.
  • GIF o PNG8 serán muy útiles para manipular imágenes con bloques de colores planos.
  • PNG24 nos servirá para imágenes con efectos como brillos y sombras, que también requieran transparencia.

Sobre el uso de formatos existe un interesante debate entre diseñadores y desarrolladores web, algunos prefieren utilizar el formato PNG el cual no tiene restricciones de patentes, está recomendado por el W3C y permite transparencia. Sin embargo, hay quienes aún prefieren el JPG por su popularidad y características ¿qué formato prefieres utilizar?