Todos los colores que ves en la web están mal. Y la culpa la tiene tu navegador

Captura De Pantalla 2022 04 28 A Las 14 18 06
23 comentarios Facebook Twitter Flipboard E-mail

Esos colores que estás viendo en esa página web no están bien. Las imágenes PNG o los valores hexadecimales que se usan en el código CSS o en las imágenes SVG nos traicionan, pero la culpa no es de ellas, sino de nuestra obsesión por tratar de comprimir los datos.

Para evitar que el tamaño de esos ficheros se dispare solemos usar un algoritmo de compresión con pérdida llamado "8-bit sRGB" por el que se lleva apostando desde 1996, y precisamente el problema es ese.

La compresión mató (un poco) los colores

El propósito del algoritmo es legítimo: representar datos de color usando menos bits de los que sería adecuado para una representación fidedigna. El objetivo era ahorrar datos y hacer nuestras webs —que no paran de crecer en tamaño— algo más ligeras.

Captura De Pantalla 2022 04 28 A Las 14 13 25
La parte interior y exterior del cuadrado gris debería tener el mismo brillo general. Ambas emiten una cantidad media de luz que es la mitad de brillante que el blanco. El renderizado incorrecto del color hace que la parte exterior parezca más oscura.

Lo ideal sería almacenar los valores numéricos reales del brillo que corresponderían a la intensidad de la luz, así que más que un "espacio de color", como algunos lo definen, sRGB es eso, una tecnología de compresión con pérdida.

La realidad es que este algoritmo es engañoso. Los desarrolladores web creen que uno puede sumar y restar colores ofreciendo los números de los colores sRGB a los usuarios, pero esos números no tienen un significado demasiado real: no se pueden coger dos colores, mezclarlos y esperar que obtengamos el color esperado, pero eso es lo que hacen todos los grandes navegadores web.

Lo que realmente deberían hacer es convertir esos valores sRGB a valores lineales RGB, procesarlos y luego volver a convertir el resultado en sRGB si se necesita.

Captura De Pantalla 2022 04 28 A Las 14 15 20

Quienes hacen operaciones de forma directa sobre valores sRGB lo están haciendo mal, y eso provoca que la representación del color en la web no sea la adecuada.

Hay solución, no obstante. El atributo color-interpolation de los ficheros SVG permite resolver el problema, pero curiosamente ningún navegador lo implementa a pesar de que dicho atributo se creó en la especificacion SVG 1.1 de 2003. Han pasado casi dos décadas desde entonces, y los navegadores no hacen correctamente su trabajo.

El organismo W3C está muy al tanto del problema, y de hecho hay propuestas para resolverlo en CSS4, la revisión de este estándar. En ella se propone el uso del espacio de color perceptivo Oklab que hace uso de tres coordenadas y que dispone de diversas implementaciones.

Curiosamente quienes sí lo hacen son nuestras tarjetas gráficas y los desarrolladores de videojuegos. El procesamiento lineal de esos datos RGB es necesario para entornos realistas, y las GPUs modernas son capaces de convertir de forma transparente desde y a sRGB al cargar y renderizar imágenes sin pérdida de rendimiento.

Más información | Web Color Is Still Broken

Comentarios cerrados
Inicio