Muchas personas tienen problemas con el color de sus fotos cuando las publican en línea. Hay varias razones por las que esto podría ser así, pero los culpables más comunes son el espacio de color de la imagen y si el perfil está incrustado o no. Ambas configuraciones de color pueden afectar radicalmente el color del navegador web y el aspecto de sus fotos.
Veamos algunos de los posibles obstáculos más de cerca.
La importancia de incrustar el perfil de color
Siempre que edita sus fotos en un programa de edición como Photoshop, lo hace utilizando un espacio de color de trabajo RGB específico. Para asegurarse de conservar el color que ve cuando está editando, debe incrustar el perfil antes de guardar la imagen.
En términos simples, el perfil ICC es un traductor. Permite que diferentes aplicaciones y dispositivos interpreten el color según lo previsto. Si adquiere el hábito de incrustar perfiles en sus imágenes a medida que las guarda, reducirá las posibilidades de que el color se vea mal en la web o en la impresión.
El rico color de esta imagen ProPhoto RGB se verá bien en muchos navegadores a pesar de no ser sRGB como se recomienda normalmente. Si le parece apagado y sin saturación, será porque lo está viendo en un navegador sin administración de color. Al insertar el perfil, le he dado la mejor oportunidad de verse como se esperaba para la mayoría de las personas. En un monitor de gama amplia, los colores aparecerán un poco más.
Incrustar el perfil en una imagen agrega alrededor de 3-4 kB al tamaño del archivo, por lo que la única vez que tiene sentido excluirlo es cuando está cargando grandes cantidades de fotos en Internet.
Si debe omitir el perfil, asegurarse de que la imagen esté en el espacio de color sRGB limitará cualquier daño resultante. Dos o tres de los navegadores más populares seguirán mostrando el color fielmente porque adivinan automáticamente el perfil correctamente (es decir, sRGB).
Aunque la mayoría de los navegadores han mejorado el manejo del color recientemente, sigue siendo una buena práctica insertar el perfil. No lo deje sin una buena razón.
Debido a que el perfil se ha dejado fuera de esta misma imagen ProPhoto RGB, el brillo y el color se verán terribles en la mayoría de los navegadores y en la mayoría de los monitores. Por el contrario, un perfil faltante para un archivo sRGB sería indetectable para una gran cantidad de personas.
Cómo incrustar el perfil
Incrustar el perfil en imágenes suele ser solo un caso de marcar una casilla al exportar la foto. Si tal opción no existe, el valor predeterminado será el espacio de trabajo predefinido del programa o será sRGB para la salida específica de la web.
Si desea verificar el color de sus imágenes web antes de publicarlas, ábralas directamente en un navegador (preferiblemente uno confiable como Chrome) y vea cómo se comparan con el original en su programa de edición de fotos. Tenga cuidado al subir imágenes a plataformas que eliminen el perfil, aunque estos no suelen ser sitios de galería de fotos.
Incrustar o eliminar perfiles generalmente solo requiere que marques o desmarques una casilla al guardar. Este es el panel "guardar como" en Photoshop.
Conversión a perfil
Puede utilizar "convertir a perfil" en Photoshop para crear una imagen sRGB, que es la opción de espacio de color más segura para la web. Asegúrese de no sobrescribir el archivo original y guárdelo de esta manera, porque los espacios de color más grandes son una mejor opción para impresiones como la impresión por inyección de tinta.
No utilice "asignar perfil" para la conversión de perfil, ya que provoca un cambio de color y no está diseñado para este propósito.
El uso de "asignar perfil" en Photoshop para convertir entre perfiles provocará un cambio de color. El color en la imagen de la derecha de arriba se ha vuelto plano como resultado de asignar un perfil sRGB a una imagen Adobe RGB. Debe utilizar "convertir a perfil" si desea crear una versión sRGB de su foto para la web.
Por qué es importante monitorear la gama
La gestión del color necesita al menos dos perfiles para funcionar (perfil de imagen y perfil de monitor en este caso). Si publica imágenes sin perfiles incrustados, dependerá del navegador del espectador para adivinar el espacio de color correctamente.
Cuando la gestión del color está ausente en el navegador o la aplicación por cualquier motivo, las siguientes afirmaciones son verdaderas:
- Una imagen de Adobe RGB se ve aproximadamente correcta en una pantalla de amplia gama.
- Una imagen de Adobe RGB tiene un color apagado en una pantalla de gama estándar.
- Las imágenes sRGB se ven aproximadamente correctas en una pantalla de gama estándar.
- Una imagen sRGB parece sobresaturada en color en una pantalla de amplia gama.
Tenga en cuenta que una imagen Adobe RGB sin un perfil incrustado parece silenciada en la mayoría de las situaciones y debe evitarse. Los navegadores adivinarán que el espacio de color es sRGB, si es que lo adivinan.
El gráfico anterior muestra la diferencia entre un monitor Dell de gama estándar (contorno de color) y el perfil sRGB (contorno de puntos). Incluso en un monitor de escritorio normal, es muy probable que algunos colores excedan el espacio de color sRGB y se vean demasiado saturados cuando se ven en los navegadores de Microsoft.
En el monitor de arriba, los rojos son los más exagerados en esa situación. Si no ha perfilado su monitor o si la gama de la pantalla está contenida en sRGB, no encontrará esto.
Comportamiento del navegador 2022-2023
Para comprender los perfiles de color, es útil saber cómo se comportan los diferentes navegadores con el color. Probé cinco navegadores para este artículo para darle una idea de qué esperar. No dude en consultar esto si cree que alguna de estas observaciones es incorrecta:
Google Chrome
Chrome es un navegador totalmente administrado por colores que asigna sRGB a cualquier imagen "sin etiquetar" (es decir, aquellas sin perfiles incrustados). Lee todos los perfiles incrustados.
Ópera
Opera es un navegador con gestión de color que asume automáticamente que las fotos son sRGB si falta el perfil. Al igual que Chrome, lee todos los perfiles, incluidos Adobe RGB o ProPhoto RGB.
Firefox Quantum
Puede configurar Firefox para asignar sRGB a cualquier foto sin etiquetar. Lee todos los perfiles de color incrustados.
Si ejecuta dos monitores, Firefox no mantiene la gestión de color completa en ambos. Para obtener un color óptimo, debe marcar el perfil de un monitor y luego seguir con ese monitor. Esto solo se aplica si sus monitores tienen perfiles personalizados.
Microsoft Edge / Internet Explorer
Microsoft Edge tiene una solución a medias para la gestión del color. Lee diferentes perfiles de color y convierte todo a sRGB para su visualización. El principal problema es que no usa el perfil de monitor. Por lo tanto, funciona mejor si su monitor no supera la gama sRGB. De lo contrario, verá colores descarriados.
Safari (para Windows)
Safari puede leer perfiles en imágenes y usa el perfil del monitor (a diferencia de MS Edge o MS IE), pero no asigna un perfil a una imagen si falta una. En esa situación, muestra el color incorrectamente como lo hace Microsoft Edge.
En Photoshop, puede utilizar los colores de prueba “Monitor RGB” para mostrarle cómo se verá la foto en Internet Explorer en su propio monitor. Primero deberá convertir la imagen a sRGB. Si los colores se ven más brillantes que sin pruebas, significa que la gama nativa de su monitor excede el perfil sRGB.
Un segundo experimento consiste en ver los colores de prueba de una imagen Adobe RGB o ProPhoto RGB utilizando “Internet Standard RGB”. Esto le mostrará cómo se ven las fotos en espacios de color más grandes en Internet si omite el perfil.
Elegir sRGB para la Web
La razón por la que sRGB es una opción más segura de espacio de color para la web es que la mayoría de las pantallas o monitores no tienen una amplia gama. Por lo tanto, si el perfil se extravía o se elimina, o si un dispositivo o aplicación no es compatible con la administración del color, el color aún se verá bien. Esto es en lo que confían los navegadores de Microsoft para funcionar.
Si desea que el color de sus fotos se vea "bien" para la audiencia más amplia posible, solo necesita hacer dos cosas:
- Asegúrese de que la imagen esté en un espacio de color sRGB, ya sea utilizándola como su espacio de trabajo o convirtiéndola a sRGB antes de cargarla en la web.
- Incruste el perfil sRGB en la imagen antes de guardar.
"Guardar para Web" de Photoshop le permite convertir a sRGB en el último momento marcando una casilla. Si dejas la casilla sin marcar, la foto se guarda en el espacio de color en el que la editaste. No puedes quitar el perfil con esta casilla de verificación: es puramente para conversión.
Otras opciones: Adobe RGB y ProPhoto RGB
Dado que los navegadores más populares ahora conocen el color, existe la posibilidad de utilizar otros espacios de color en la web. Por ejemplo, podría publicar fotos con un perfil Adobe RGB o ProPhoto RGB incrustado, y aún así quedarían bien para la mayoría de las personas. Para una minoría, se verían mejor.
El color de los monitores de amplia gama suele superar a Adobe RGB en algunos lugares. Por lo tanto, teóricamente existe una razón para publicar fotos en ProPhoto RGB. Sin embargo, esto se compensa con el terrible color que resulta cuando los perfiles faltan o se ignoran. Es de alto riesgo.
Adobe RGB es una perspectiva interesante para la web porque todavía beneficia a los usuarios de monitores de amplia gama. Es importante destacar que no se ve tan mal como ProPhoto RGB cuando las cosas salen mal. Sin embargo, si publica en Adobe RGB, seguirá haciéndolo para una audiencia relativamente pequeña.
Si utiliza estos espacios de color de gama más amplia para la web, definitivamente deber incrustar el perfil. Tan pronto como eso se desvíe, el color de sus fotos parecerá un poco plano para muchas personas. En el caso de ProPhoto RGB, es probable que se vea horrible.
Este diagrama 3D (arriba) muestra el perfil sRGB abarcado por el perfil de un monitor de amplia gama. En particular, notará la amplia gama de cianos y verdes en este último.
La idea de utilizar espacios de color más grandes en la web es atractiva, especialmente si eres un fotógrafo de paisajes para el que estos colores suelen estar truncados. Significa que utilizará más las capacidades de su cámara. Sin embargo, es intrínsecamente más riesgoso y tocarás para una audiencia relativamente pequeña. La opción segura sigue siendo sRGB.
En resumen
Aunque los navegadores modernos son más flexibles, sRGB sigue siendo la opción más segura de espacio de color para la web. Nuevamente, esto se debe a que coincide aproximadamente con la gama de la mayoría de las pantallas electrónicas. El uso de espacios de color más grandes corre el riesgo de agotar el color de las fotos, especialmente en tabletas o teléfonos inteligentes que pueden no tener gestión del color.
Espero que esto haya sido de alguna utilidad. No dude en hacer preguntas si necesita alguna aclaración.