Solucao para problema de cores com PNG

21 de março de 2007 Design

Por mais que aparentasse ser um caso sem solução, apareceu uma forma de eliminar o problema documentado no artigo “Problema com cores de PNG no Internet Explorer“. Quem explicou a causa do problema e apresentou uma solução foi Vitorio Tadao Kuroda.

O problema:

Um arquivo PNG carrega informações de correção de cores (GAMMA) pra que evite que ocorra distorções de cores nas imagens. Por ironia esse é um dos problemas encontrados na adoção desse formato.
O problema aparece do fato dos browsers tratarem tradicionalmente os valores RGB especificados no CSS (e HTML), GIF e JPEG de maneira idêntica. Já o PNG a informação GAMMA armazenada para usar o valor correto dos valores RGB não coincide com os outros elementos (css, gif, html…) pq nem todos os browsers interpretam essa informação da mesma maneira: alguns a ignoram completamente, enquanto outros aplicam um ajuste de GAMMA arbitrario.

E a solução:

é possível remover esse GAMMA do PNG assim os navegadores exibirão as imagens da mesma maneira que GIF´s JPEG´s … Mas isso não é bem verdade para todos os navegadores (SAFARI 1.3) uma outra alternativa seria tentar alterar valor do gamma offset, neste caso não tem jeito… vc só vai conseguir agradar um dos dois mais problemáticos com png´s (IE ou SAFARI 1.3).
Caso vc queira agradar o Safari 1.3 vai ter q usar o gamma offset de 0.5181347
No caso do IE o valor do gamma offset seria de 0,555555
(o Photoshop´s acima da versao 5.0 salvam o gamma offset com 0,45000)

Depois de tratar a imagem PNG com o TweakPNG (programa também citado pelo Vitorio) e manter as outras duas imagens intactas temos:

E capturas de tela para consagrar o resultado…

Firefox 2.0.0.2

Opera 9.10

Internet Explorer 6

Internet Explorer 7

Agradeçam o Vitorio pela dica.