Los colores aparecen de manera diferente en la página web cuando se guarda en sRGB

Creé una página web con una imagen junto al texto, configurada con el mismo color que pensé que había usado para la imagen. Sin embargo, cuando miré la página web en Safari (en Mac), noté que el color real del texto y la imagen eran diferentes (este no era el caso en Chrome o Firefox).

Desde entonces, he leído acerca de cómo debe guardar imágenes web usando el esquema de color sRGB.

Sin embargo, necesito que el color del texto (establecido en un valor HEX por CSS) sea exactamente el mismo que el color de la imagen real que se muestra. Sin embargo, al elegir el color para la imagen, parece que solo veo la gama completa, es decir, no solo los colores sRGB que realmente tengo disponibles.

Luego convierte el color al color sRGB equivalente/disponible.


¿Existe de todos modos en Photoshop (o Pixelmator) para usar solo colores seguros sRGB en la paleta de colores?

¿Está utilizando Safari 6 para Mac? Esta discusión puede ser de su interés: feedback.photoshop.com/photoshop_family/topics/…
+1 por la pregunta y la recompensa. Ya hemos debatido este tema antes: consulte sRBG Photoshop y prueba de selector de color y ¿Qué debo hacer con respecto al perfil de color al diseñar para la web ? Hay una respuesta en todo ese material, pero sería genial tener una respuesta clara y directa sobre la mejor manera de obtener consistencia de color en dispositivos máximos a un costo mínimo de riqueza, etc.

Respuestas (3)

¿De dónde sacas tu valor hexadecimal? ¿Dentro de Photoshop?

¿Ha intentado usar algo como Xscope para obtener el valor hexadecimal de la imagen en el navegador? En lugar de jugar con los espacios de color, esa puede ser la forma más rápida de hacerlo.

Dicho esto, eche un vistazo a este artículo sobre espacios de color y ese cambio de color que está viendo: http://www.gballard.net/psd/saveforwebshift.html

Me temo que estás un poco a merced de los navegadores aquí. Todos los navegadores convierten los colores a su manera. Una constante (la última que revisé) es la gestión de color predeterminada, si está disponible, ignorará los elementos 'sin etiquetar', es decir, CSS/HTML e imágenes sin etiquetar (para algunos navegadores).

Me imagino que lo que está viendo es una imagen con control de color junto al tipo representado directamente en el espacio de su monitor sin compensación. No estoy seguro de que Safari todavía lo haga de esa manera, pero otros navegadores lo harán.

Puede intentar compensar el efecto en su monitor y navegador preferido. Podrías acercarte. Simplemente no espere que nadie más vea lo que ve a menos que tenga un grupo muy reducido de visitantes;)

Aquí hay una lectura relativamente rápida que hace un buen trabajo al explicar el problema, navegador por navegador. Vaya a la sección titulada APOYO A LA GESTIÓN DEL COLOR POR NAVEGADOR. El resto es para gente que no sabe lo que es la gestión del color.

El problema es que su imagen tiene un espacio de color agregado. Si elimina el espacio de color de la imagen, verá que tanto su valor css como los colores de la imagen son exactamente iguales. El fondo es que el CSS de un navegador no tiene un 'espacio de color', por lo que se representa a través de la gestión de color de la pantalla 'tal cual', mientras que para una imagen puede haber algunas coincidencias para satisfacer las necesidades de mostrar el color de la imagen con precisión.

En el pasado, esto era solo un problema con Safari, pero luego otros navegadores comenzaron a admitir espacios de color para las imágenes. Entonces, en el pasado, solo Safari mostraba este problema, hoy en día, más navegadores muestran este problema.