¿Ocupa más espacio una imagen en color que en blanco y negro?


La respuesta parece obvia, pero cuidado: no siempre lo ocupa.

Yo, que estoy acosumbrado al tratamiento de imágenes, me ha sorprendido leer en algunos sitios que existen extensiones para navegadores de ahorro de ancho de banda (supuestamente para reducir el consumo de datos en planes de pago de conexión a internet) entre cuyas opciones se encuentran, además de compresión de datos, reducción de código (mas que nada eliminar Javascrit y volver a HTML plano..., parece absurdo que mientras los desarrolladores y diseñadores de portales hagan las webs más pesadas, los usuarios tengamos que esforzarnos luego por quitarles esa "basura" que les ponen y aligerarlas...) y demás opciones, la posibilidad de cargar las imágenes en blanco y negro o en tonos de grises.




Pero cuidado, porque el blanco y negro y, sobre todo, algunas gamas de grises, puede tener efectos desastrosos totalmente contrarios y contraproducentes, y puede generar imágenes más pesadas que la original en color.

Y es que para mucha gente le parece de perogrullo que una imagen, sin color, pese (ocupe, para hablar con propiedad) menos. Pero aunque el término lleve a engaño, realmente en los grises la palabra "quitar color" no debería usarse, sino "sustituir", ya que lo que se hace es cambiar el color por una gama de tonalidades grises, y si has ido a clases de arte o de diseño gráfico recordarás que grises no hay dos, ni tres, ni cuatro... ¡Hay infinidad de variaciones!

Lo que haríamos entonces es aumentar, en muchas ocasiones, el tamaño de la imagen, descargándonos más datos que si lo hiciéramos con la original en color y, encima, viéndola en blanco y negro.

Obviamente esto depende del tamaño y el tipo de compresión (jpg, png...), pero por regla general, si te ofrecen convertir las imágenes a blanco y negro de una página web, para ahorrar datos..., desconfía.


La mejor solución sería que los diseñadores web tuvieran todo esto en cuenta, para que luego el usuario no tuviera que lidiar con el problema cargándoselo todo a las espaldas de los internautas. No solo desarrollando sitios más eficientes, haciendo más uso de HTML plano (y no del formato de portal, tan ineficiente y horrible que tanto se lleva ahora, de "scroll infinito"), sino también recurriendo a herramientas de compresión como FileOptimizer, que les permiten aligerar el contenido de los elementos de sus portales webs sin perder en calidad.

Respecto al visitante y usuario de páginas web que use este tipo de soluciones como la mencionada Bandwidth Hero, una alternativa más interesante es pedirle al visualizador (o programa, app o extensión de navegador) que limite el grado de grises a usar. Si elijes ver imágenes limitándoles el grado de grises (o el número de colores) entonces la cosa cambia, porque aquí sí que se logra aligerar bastante el tamaño. Por ejemplo, una imagen con 20 tonos de grises es más que suficiente para, en la mayoría de casos, distinguir su contenido sin muchos problemas. Si hablamos en color, los antiguos teléfonos móviles (e incluso PCs) no pasaban de 256 colores, elegir esa paleta hará que puedas apreciar los colores principales, disfrutar del color, y ahorrarte una enorme cantidad de datos en tu contrato o tarifa de conexión a internet.


En el siguiente listado podéis ver un ejemplo con la misma imagen (para la reducción hemos usado el método Floyd-Steinberg):
- .jpg 16,7 millones: 621 KB
- .jpg escala de grises 256 colores: 228 KB
- .jpg escala de grises 16 colores: 392 KB
- .jpg 2 colores: 553 KB
- .jpg 256 colores: 296 KB
- .jpg 16 colores: 411 KB


Como podemos apreciar, lo más eficiente no es elegir la peor calidad de escala de grises, sino que el tamaño se reduce considerablemente cuando elegimos 256 colores. Paradójicamente, con solo dos colores (blanco y negro) el tamaño aumenta muchísimo, aunque la imagen se vea peor. Lo más eficiente no es volver la imagen en blanco y negro, sino dejarla con los colores pero reduciendo éstos al uso de sólo 256 (8 Bits Por Pixel), con lo que reduciríamos su peso a menos de la mitad sin perder muchos detalles de color.

Como casi todo en informática, lo mejor está en la posibilidad de personalizar las opciones que quieras aplicar según los resultados que quieras obtener y los beneficios que quieras lograr, y en cuestión de imágenes esta máxima funciona también. No lo dejes todo a las opciones "por defecto" de los programas, porque nos podemos encontrar con que, pasando las imágenes a escala de grises, no solo no estaríamos ahorrando datos, sino aumentando su consumo. Y encima, para mayor desgracia viendo las imágenes sin los colores y perdiéndonos buena parte de su atractivo. De manera que grises, sí, pero hasta un límite.


| Redacción: Duraderos.blogspot.com

6 comentarios :

  1. Ocurre que a JPEG no le afecta demasiado la cantidad de colores de la imagen, sino la cercanía de colores distintos, puesto que JPEG siempre trabaja con 24bpp.

    En cambio GIF o PNG, si que son capaces de codificar los datos a 1bpp, 2bpp, etcétera, de manera que reduciendo colores, si que se suele reducir basante el tamaño.

    ResponderEliminar
  2. He puesto jpg porque gif y png me parecen formatos que en web son muy ineficientes, cierto que (sobre todo png) se utiliza cada vez más, pero un buen diseñador web creo que debería descartarlo de mano, si busca la eficiencia. No hablemos ya si quieres ahorrar en datos.

    jpg sin embargo es un formato que da mucho más juego, prueba es que pasándolo por FO logras reducirlo aún más, sin variar la imagen original. Por otro lado, al usar variaciones de grises elegí Floyd–Steinberg por cuestiones de la corrección del color (o en este caso habría que hablar de los tonos), ya que evita la aparición del dithering. No solo es el peso, por tanto, es la calidad muy importante cuando nos ponemos a reducir colores, da igual que trabaje a 24 BPP porque no los vas a ver :D Básicamente lo que verá el lector será sombras de grises.

    Obviamente a nivel interno respecto al funcionamiento de jpg podríamos hablar un mundo, pero creo que entraríamos en demasiados tecnicismos que solo tú, algún pirado como yo, y quizá un aburrido de la vida que pase por casualidad por aquí, entendería :D

    ResponderEliminar
  3. ¡ah, que te refieres al listado! XD No había caído, Guti, perdona. Yo es que puse lo que me ponía el programa, no me di cuenta de mirar la imagen guardada (sí el peso XD). Bueno da igual, para el caso es lo mismo, tampoco creo que varíe mucho que esté en 24 BPP, aunque gracias por la puntualización, quitaré eso para que no lleve a confusión.

    ResponderEliminar
  4. Si. Era eso. Si tienes curiosidad, activa el modo con perdida de JPEG en FileOptimizer, y verás lo que es capaz de reducirlas sin que aprecies menor calidad (aunque haberla, la habrá).

    ResponderEliminar
  5. Creo que en la actualidad, con el internet en su estado actual, el asunto del tamaño de fotos ya no es importante. Claro, hay extremos, como tener que bajar una imagen a miles de megapixeles, pero "en la vida real", en el diario, ya no estan las cosas con en 1995. La única excepción, y es muy extrema, son los paquetes de datos para celular

    ResponderEliminar
  6. Tienes razón que se ha avanzado mucho. Pero mientras que en los 90, una foto eran 40 Kb, hoy una foto son 500 Kb, la cosa también a aumentado.

    En cuanto al peso, es algo que perjudica el SEO también, de ahí Google Page Insights.

    ResponderEliminar