Abraços a todos.

Evandro Araujo.

Esse tipo de utilidade já existem em programas que trabalham com PNG. Photoshop (save for web), Fireworks (aba optimize).

Particularmente o Fireworks salva junto com os PNG´s, informações de camadas, como se fossem os PSD´s do Photoshop. Quando os PNG´s são exportados ocorre um RASTERIZE nas camadas (só vai exportar 1 camada) seguindo as opções escolhidas na aba OPTIMIZE (em outras palavras: vai achatar a imagem). Se alguem utiliza os Png´s não otimizados sem intenção de fornecer a imagem fonte, tá fazendo cáca (isso é coisa de estagiário).

O photoshop já ABRE o PNG rasterizado, não tem opção pra manter essas informações.Quem usa o photoshop, sabe q se abrir um arquivo do PNG do fireworks e salva-lo, estará descartando as informações do Fireworks (Vai ter designer querendo seu pescoço. Corre estagiário, mas corre muuuito).

Vitorio Tadao Kuroda

No exemplo acima o erro é tão visível que pequenas alterações na qualidade da imagem não modificam a interpretação, e também o exemplo real está disponível para quem quiser ver com os próprios olhos.

Mas obrigado pela participação e pela dica do programa, sem dúvidas vou procurar conhecê-lo melhor.

Abraço

Existem explicações matemáticas de por quê isto acontece, analisando o algoritmo do JPG (que baseia-se em expansão em séries)… Mas, na prática, pode-se saber que o JPG comprime muito bem imagens com transições suaves, imagens com uma quantidade muito grande de cores… Bem, resumidamente, fotos (e refiro-me a fotos “do mundo real”). Para imagens com muitas cores sólidas e transições abruptas de cor (como é o caso, em geral, de screenshots), o formato JPG deixa a imagem mais feia, às vezes com cores um pouco alteradas, e adiciona muito ruído (noise) próximo às áreas de transição abrupta de cor (faça um zoom nos screenshots que você vai perceber isso).

O formato mais adequado para screenshots, na minha opinião, é o PNG. Mas, se os screenshots falam de “bug” no PNG, é estranho usá-lo para o próprio screenshot. Por outro lado, o JPG vai adicionar ruído indesejado, tornando uma análise melhor das cores inviável. GIF, sem dúvida, está fora de questão, pois suporta apenas uma paleta com 256 cores.

Por fim, vou aproveitar e sugerir mais uma ferramenta para trabalhar com PNGs: optipng é um programa que analisa o arquivo PNG e tenta recodificá-lo para torná-lo menor, mas mantendo todos os pixels intactos (ou seja, não muda a qualidade nem muda as cores, só tenta mudar a forma como salva isso tudo). Esse programa é uma versão melhorada do pngcrush

Nunca usei a versão para windows, mas deve funcionar por linha-de-comando, digitando isto: optipng -o7 arquivo.png (é melhor ler a documentação para saber do que ele é capaz)

Este programa não vai mexer nos meta-dados do PNG (ele não vai remover coisas como gamma ou comentários) e, portanto, não “serve” para resolver o problema descrito neste blog. Por outro lado, algumas vezes a economia de tamanho pode ser bastante generosa. (acho que o Photoshop não exporta PNGs muito bem, mas posso estar enganado)

Obrigado pela ajuda, você terá os devidos créditos =]

aqui esta o mesmo exemplo:
http://www.id3d.com.br/tweakPNG/

Talvez eu possa ter feito algo errado, se possível seria interessante que você pegasse os arquivos utilizados nesse experimento e tentasse a correção você mesmo.

Uma solução concreta e documentada seria muito bem vinda.

Realizarei o mesmo experimento novamente, mas desta vez aplicando as correções citadas, e é claro, documentarei tudo aqui no blog.

Obrigado pela participação.

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.

O problema era bastante visível com o PHOTOSHOP 5.0
Isso mesmo meu caro… seu amigo photoshop dobrava o valor do gamma e deixava o png mais escuro, logo isso foi corrigido na versão 5.5.
Tá ai uma dica pra quem tá usando uma versão antiga do photoshop e tá se deparando com o problema.
“-Tá mas e daí… to usando o photoshop cs2 e o problema continua.”
OK… mas ai já não é problema no photoshop.

Pra tentar resolver…

é 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)

Na boa…
eu fico com a primeira solução…
tem muita gente usando o IEca (é muito leigo pra um planeta só)

apaga a informação gamma dos PNG´s e manda os usários do SAFARI 1.3 pra merda (foi mal tio Jobs).

“-vai embora sem ajudar?”
Opa…
pra quem quiser remover o gamma das imagens png´s
TweakPNG (sim é FREE) http://entropymine.com/jason/tweakpng/

É assim q usa…
usa o TweakPNG pra abrir a imagem (Não Kra! isso não é um visualizador), irão aparecer as informações do PNG. Procura o “gamma” clica com o botao direito e delete a informação, ai é so salva e pronto.

Pro corajoso q vai ficar editando o gamma offset:
-Larga mão de ser besta e cria uma Action logo na primeira vez.