Pregunta ¿Por qué esta imagen PNG se muestra de forma diferente en Chrome y Firefox que en Safari e Internet Explorer?


Mira esta imagen:

Apple or Pear

En Chrome y Firefox se mostrará como una pera. Ahora, intente guardarlo y verlo guardado en su escritorio. Además, intente ver en Safari o Explorador de Internet. Se mostrará como una manzana!

Intente hacer clic en la imagen y moverla. Notarás que aparece la manzana.

¿Por qué pasó esto?


663


origen


si trato de arrastrar la imagen en Firefox solo un poco, la imagen arrastrada transparentemente hará que la forma de la manzana sea un - ajax333221
¿Cómo creaste esta imagen? ¿Puedes dirigirme a un sitio web? - tumchaaditya
Para futuros lectores, esto parece estar solucionado en las versiones actuales de IE. - Kat
Pero aún puedes descargarlo a tu escritorio y ver Apple allí, y verlo en Firefox, Chrome como pera. - Jet


Respuestas:


Ocurre porque algunos navegadores realizan la corrección gamma como se especifica en el archivo de imagen.

Aquí está la imagen sin corregir. Los píxeles "blanco-ish" en la imagen de la manzana contienen la imagen de una pera, almacenada a una intensidad mucho más alta, es decir, muy brillante.

Aquí está la imagen con corrección gamma. Los píxeles "negros" en la imagen de pera contienen la imagen de una manzana, almacenada a una intensidad bastante normal, pero reducida a casi negro con la corrección gamma.

En mi pantalla, puedo ver la pera débilmente entre los píxeles blancos en la primera imagen, pero en la segunda imagen, la manzana es indistinguible de los píxeles negros que la rodean.

(También puede ver bandas de color en la pera corregida gamma, porque la imagen no corregida utiliza un rango mucho más pequeño de los canales de color).

El archivo de imagen PNG contiene un fragmento gAMA que especifica un valor de gamma de archivo de 0.02. Cuando se muestra sin corrección gamma, el espectador ve una manzana con píxeles "blancos" intercalados, que en realidad son la pera en su intensidad original (alta).

Cuando se visualiza con corrección de gamma, el espectador ve una pera corregida por color con píxeles "negros" que en realidad representan la manzana con un valor de gamma mucho más bajo.

Los navegadores que muestran la pera realizan una corrección de gamma en la imagen, mientras que los navegadores que muestran la manzana no realizan la corrección de gamma, sino que simplemente la muestran con sus valores de color literales.


524



Una lectura recomendada sobre el tema: el famoso artículo de Eric Brasseur llamado "Error gamma en la escala de la imagen. - ulidtko
@ulidtko Eso es ahora un 404. Aquí hay un copiar en el archivo web. - Cole Johnson


Esto fue demasiado para hacer un comentario, pero espero que ayude.

Por lo tanto, estoy bastante seguro de que este problema se refiere a la forma en que los navegadores interpretan la información gamma con PNG. Es un problema bastante divertido y trata en primer lugar las ambigüedades de la información gamma.

El artículo La triste historia de PNG Gamma "Correction" proporciona un muy buen resumen de los problemas, remedios y otros hechos divertidos.

Dicho esto, podemos quitar la información gamma de una imagen usando pngcrush

pngcrush -rem gAMA -rem cHRM -rem iCCP -rem sRGB pear.png apple.png

Entonces con la información gamma y sin ella:

pear an apple

Realmente no diría que esta es "la respuesta", pero en todo caso probablemente sea en la dirección correcta. Estoy seguro de que alguien con muchos conocimientos sobre los perfiles de color y demás vendrá acompañado de una respuesta más formal.


227



esas dos imágenes me parecen iguales, parpadeando entre la manzana y la pera como el original en la pregunta. Estoy usando Safari 6.0.2 - Fraser Graham
Tenga en cuenta que los dos últimos elementos del comando proporcionado aquí son los infile y outfile: p.ej. pngcrush -rem gAMA -rem cHRM -rem iCCP -rem sRGB infile.png outfile.png. Más información: hsivonen.fi/png-gamma - fredrivett


Cambiando la gamma (γ) de una imagen consiste en modificar el valor gamma en:

(R ', G', B ') = (Rγ, Gγ, Bγ)

que da el color de píxel de salida (R ', G', B ') mostrado en la pantalla después de aplicar la función gamma a los valores de píxel iniciales (R, G, B) (considerando R, G y B normalizados entre 0 y 1 )

Ahora, tomemos el canal rojo, por ejemplo.
Si R = R0 + R1 , obtendrás
R '= (R0 + R1)γ = R0γ * (1 + R1 / R0)γ

Si R0 es mucho más grande que R1, entonces tienes
(1 + R1 / R0)γ ≈ 1 + γR1 / R0,
asi que R '≈ R0γ + γ


40





No se trata de redondear píxeles y los perfiles de color ICC no son el problema.

Es una imagen trucada, y algunos navegadores muestran PNG sin datos gamma. Para esos navegadores, ves una cosa, y para otros navegadores ves la imagen completa (con la pera oculta en el fondo).

Veo una imagen de truco de manzana / pera, o simplemente veo la pera, dependiendo de si el navegador admite estos datos gamma.


9





así como ocurre, puede ver más detalles en imágenes con una pantalla calibrada adecuada y si el gamma / brillo / contraste es demasiado alto, puede ver que la imagen en la imagen es oculto Más


1