jueves, julio 09, 2009

Gestión correcta de color para internet

Las imágenes mostradas en un navegador, pueden presentar colores muy diferentes si no se gestiona el color correctamente.

Las siguientes fotos son la misma foto mostradas en el navegador sin ninguna gestión de color.

La foto original estaba en el espacio de color ProPhoto y fue convertida a AdobeRGB y a sRGB, y guardada como jpeg sin almacenar el perfil de color.

soniaProPhotosinPerfil
perfil ProPhoto
soniaAdobeRGBsinPerfil
perfil AdobeRGB
soniasRGBsinPerfil
perfil sRGB

Ninguna de las fotos tiene el perfil incrustado, por consiguiente, todos los navegadores la tratan como una imagen sin gestión de color.

Dado que los primeros monitores tenían un peril próximo al sRGB (de hecho el perfil sRGB se definió a partir de los colores que los monitores estándar podían mostrar), la imagen que se ve con los colores correctos es la de perfil sRGB, aunque no tenga el perfil incrustado.

Las otras dos imágenes, que están en espacios de color más amplios, se ven con los colores vahídos e incorrectos, ya que el navegador los interpreta como si fueran sRGB.

Ahora bien, hay navegadores como Safari y Firefox (si se activa, por que inicialmente está deshabilitada) que tienen incorporada gestión de color, leen el perfil incrustado en la imagen y lo convierten des de ese espacio de color al perfil de color del monitor.

Por tanto, en estos navegadores, si las imágenes tienen el perfil correctamente incrustado, los colores se ven correctos en el monitor. Todas las imágenes se verán con colores muy similares, salvo aquéllos colores que el perfil no posee, por ser más estrecho que el original, y que por tanto han sufrido alguna transformación.

Incluso aunque haya colores que en el perfil han sufrido transformaciones porque existían en el original más amplio (como el ProPhoto en este caso), en el monitor puede no apreciarse la diferencia de color, por que el monitor tenga un perfil más estrecho y no sea capaz de mostrar esos colores.

Internet Explorer, es un caso aparte. También puede gestionar el color, pero no lo lee directamente del perfil incrustado en la imagen, si no que el código html para insertar la imagen ha de contener etiquetas especiales que le indican el perfil de color en el que se encuentra la imagen.

Estas etiquetas son como siguen:

<img style="filter: ColorInfo(ColorSpace=NombreFicheroPerfil.icc,intent=1)" src=imagen.jpg>

Para más información al respecto, puedes consultar la página de Hugo Rodríguez Perfiles de color e Internet.

Las tres imágenes de abajo tienen el perfil de color incrustado, y el código ColorInfo de Internet Explorer.

Por tanto deberían de verse con los mismos colores en todos los navegadores, únicamente puede haber alguna pequeña diferencia de color debido a colores existentes en el espacio ProPhoto que no existen el los otros perfiles, y en caso de visualizarse en un monitor de elevada calidad que pueda mostrar dichos colores.

Estas imágenes tienen el color gestionado correctamente, y por tanto has de verlas con colores muy similares, si tu navegador hace gestión de color, tanto en Internet explorer como en el resto.

Si estás utilizando Internet Explorer y las sigues viendo con colores diferentes, como las anteriores, asegúrate de que tienes los ficheros de perfil de color instalados y que tienen el mismo nombre que te indicamos a continuación.

Los ficheros se encuentran en el directorio: “C:\Windows\System32\spool\drivers\color” y tienen los nombres “AdobeRGB1988.icc” , “ProPhoto.icm” y “sRGB Color Space Profile.icm”.

soniaProPhotoPerfilInc
Perfil ProPhoto
soniaAdobeRGBPerfilInc
Perfil AdobeRGB
soniasRGBPerfilInc
Perfil sRGB