Compresión de Imágenes

El uso adecuado de la compresión de imágenes puede marcar una gran diferencia en la apariencia y el tamaño de sus archivos para web. Sin embargo, la compresión es un tema a menudo mal entendido, en parte porque hay una falta real de conocimiento sobre el uso de los diferentes tipos de compresión. Si no entiendes qué tipo de compresión usar para diferentes tipos de imágenes, lo más probable es que obtengas uno de dos resultados: o bien imágenes que no se ven tan bien como deberían, o tamaño de los archivos de imagen más grandes de lo necesario.
A continuación se muestra todo lo que necesita saber acerca de compresión de imagen en relación con el diseño web.

1. Compresión “Sin pérdida” vs. “Con pérdida”

Muchas personas piensan que sólo debe utilizar formatos de imagen que utilizan compresión sin pérdidas. Mientras que la compresión sin pérdida es adecuada para muchos tipos de imágenes, no es necesaria para otras. Básicamente, en la compresión de imágenes sin pérdidas, todos los datos del archivo original se conservan. En la compresión con pérdida, por otra parte, se eliminan algunos datos del archivo original y se guarda la imagen con un tamaño de archivo reducido. Depende de tí, como diseñador, decidir que cantidad de datos se eliminarán al establecer la tasa de compresión de imagen.

Compresión sin pérdida

Existen distintos métodos de compresión sin pérdidas. Está la compresión RLE o run-length encoding (utilizada para los archivos BMP), la cual toma secuencias de datos (datos de elementos consecutivos con valores idénticos) y los almacena en un valor único más su recuento. Es el más adecuado para gráficos sencillos, donde hay largas tiradas de idénticos elementos de datos.

DEFLATE (desinflar) es otro método de compresión sin pérdida de datos utilizados para imágenes PNG. Utiliza una combinación del algoritmo LZ77 y Huffman. Además de ser utilizado para las imágenes PNG, que también se usa en la compresión ZIP y gzip.

Lempel-Ziv-Welch (LZW) es un algoritmo de compresión sin pérdida que realiza un análisis limitado de datos. Se utiliza en archivos con formato GIF y algunos TIFF.

Compresión con Pérdida

Hay una serie de métodos de compresión con pérdidas, algunos de los cuales se pueden combinar con métodos sin pérdidas para crear archivos con tamaños más pequeños. Un método consiste en reducir el espacio de color de la imagen a los colores más comunes dentro de la misma imagen. Esto se utiliza a menudo en imágenes con formato GIF y, a veces en imágenes PNG para dar lugar a archivos más pequeños. Cuando se utiliza en el tipo correcto de imágenes y es combinado con tramado, puede dar lugar a imágenes casi idénticas a los originales.

Transform encoding es el tipo de codificación utilizado para imágenes JPEG. En las imágenes, la transformación de codificación promedia el color en pequeños bloques de la imagen utilizando una transformación discreta del coseno (DCT) para crear una imagen que tiene colores muy inferior a la original.

Submuestreo de croma es otro tipo de compresión con pérdida que tiene en cuenta que el ojo humano percibe los cambios en el brillo de forma más pronunciada que los cambios de color, y se aprovecha de ésta por gravedad o promedio de algún croma (color), manteniendo la información de luminancia (brillo).Es comúnmente usada en los esquemas de codificación de vídeo y de imágenes JPEG.

 

2. Diferentes Tipos de archivo

A los efectos de este artículo, sólo vamos a centrarnos en tres tipos de archivos, los más comunes en diseño web: PNG, JPEG y GIF. Si bien existen otros formatos de imagen que se aprovechan de compresión (TIFF, PCX, TGA, etc), es poco probable que los utilices para trabajos de diseño digital.

GIF

GIF siglas de Graphics Interchange Format, es un formato de imagen de mapa de bits introducido en 1987 por CompuServe. Soporta hasta 8 bits por píxel, lo que significa que una imagen puede tener hasta 256 diferentes colores RGB.Una de las mayores ventajas del formato GIF es que permite imágenes animadas, algo que ninguno de los otros formatos mencionados permiten.

JPEG

JPEG (Joint Photographic Experts Group) es un formato de imagen que utiliza la compresión con pérdida para crear archivos más pequeños. Una de las grandes ventajas de JPEG es que permite al diseñador ajustar la cantidad de compresión utilizada. Esto resulta en una mejor calidad de imagen cuando se utiliza correctamente, mientras que también resulta en un menor tamaño del archivo. Debido a que JPEG utiliza compresión con pérdida, las imágenes guardadas en este formato son propensas a distorsionarse, pixelarse y a formar halos extraños alrededor de determinados sectores de la imagen. Estas son más comunes en las áreas de una imagen donde hay un fuerte contraste entre los colores. Generally, the more contrast in an image, the higher quality the image needs to be saved at to result in a decent-looking final image. Generalmente, cuanto más contraste hay en una imagen, necesita ser guardada con mayor calidad lo que va a traducirse en un buen aspecto final.

PNG

PNG (Portable Network Graphics) es otro formato de imagen de mapa de bits que utiliza la compresión sin pérdida de datos y fue creado para reemplazar el formato de imagen GIF. El formato PNG no fue soportado por Internet Explorer por mucho tiempo, lo que hacía su uso menos frecuente que los formatos GIF y JPEG, aunque ahora ya es soportado correctamente por los navegadores más importantes. Los archivos PNG soportan la paleta de colores (entre  24-bit RGB o 32-bit RGBA), escala de grises, espacios de color RGBA y RGB. Una de las mayores ventajas del PNG es que soporta un número de opciones de transparencia, incluida la transparencia de canal alfa.

 

3. La elección de un formato de archivo

Cada uno de los formatos de archivo especificado anteriormente son apropiados para los diferentes tipos de imágenes. Elegir el formato adecuado resulta en imágenes de mayor calidad y tamaños de archivo más pequeño. Elegir el formato incorrecto significa que sus imágenes no será de tan alta calidad, como podrían ser y que su tamaño sea mayor de lo necesario.

Para gráficos simples, como logos o dibujos de líneas, GIF a menudo funciona mejor. Debido a la limitada paleta de colores de GIF, los gráficos con degradaciones o cambios sutiles de color a menudo terminan posterizados. Si bien esto se puede superar en cierta medida mediante el uso de interpolación de colores, a menudo es mejor utilizar un formato de archivo diferente.

Para fotos o imágenes con degradaciones donde GIF es inadecuado, el formato JPEG puede ser mejor. JPEG funciona muy bien para las fotos con los cambios sutiles en color y sin fuertes contrastes. En las zonas con un fuerte contraste, es más probable que haya distorsión (un halo multi-color alrededor de la zona). Para evitar esto hay que ajustar el nivel de compresión del JPEG antes de guardarlo.

Para las imágenes con alto contraste, sobre todo las fotos, ilustraciones con grandes cantidades de degradaciones de color o contraste, el formato PNG es mejor. Es también la mejor opción para imágenes transparentes, sobre todo aquellas que necesitan una transparencia parcial. Los archivos PNG son a menudo más grande que los JPEG, aunque depende de la imagen exacta. Los archivos PNG no tienen pérdida, es decir, toda la calidad original de la imagen permanece intacta.

Aquí hay una descripción de los tipos de archivos que funcionan mejor para cada tipo de imagen:

GIF

• Si se requiere la animación.
• Los dibujos y gráficos simples.

JPEG

• Fotos, especialmente sin un alto contraste.
• Capturas de pantalla, sobre todo de películas, juegos o contenido similar.

PNG

• Línea de arte, ilustraciones.
• Fotos con alto contraste.
• La transparencia, especialmente la transparencia del canal alfa.
• Capturas de pantalla de aplicaciones o diagramas detallados.

Y aquí está un resumen de los formatos que se debe evitar usar para cada tipo de imagen:

GIF

• Las imágenes con gradientes.
• Fotos.

JPEG

• Las imágenes con alto contraste.
• Las imágenes detalladas, especialmente en los diagramas.
• Los gráficos simples (el tamaño de los archivos son más grandes).

PNG

• Fotos con bajo contraste (tamaños de archivos son más grandes).

4. La Compresión de imagen en Diseño para Imprenta

Aunque la mayor parte de este artículo se ha centrado en la compresión de imágenes en el diseño web, vale la pena mencionar el efecto que la compresión puede tener en la impresión. En su mayor parte, la compresión de imágenes con pérdida debe evitarse por completo en el diseño para imprenta. Los gráficos impresos son mucho menos tolerantes a los defectos y baja calidad de imagen que los gráficos en pantalla. Guardar un archivo JPEG en calidad media podría verse muy bien en su monitor, cuando se imprime, incluso en una impresora de inyección de tinta, la pérdida de calidad es notable.

For print design, using file types with lossless compression is preferable. TIFF (Tagged Image File Format) es a menudo el formato de archivo preferido si la compresión es necesaria, ya que da opciones para una serie de métodos de compresión sin pérdidas (incluyendo LZW mencionado anteriormente). Una vez más, dependiendo de la imagen y el tipo de impresión, a menudo es mejor utilizar un tipo de archivo sin compresión. Consulte con su impresor acerca del formato que que ellos prefieran.