Tag dos arquivos: Adobe Photoshop

Fireworks Vs. Photoshop – Compressão de arquivos

Fireworks Vs. Photoshop – Compressão de arquivos

Postado em 14. nov, 2009 por Chiavegatti.

1

Particularmente sempre trabalhei com o Adobe Fireworks para desenvolver layouts para web, deixando normalmente o Adobe Photoshop como segunda escolha, 95% das minhas atividades estão diretamente relacionadas com desenvolvimento mas sempre gosto de fazer alguma “firula” nos softwares de produção gráfica, estou agora fazendo um esquema de imersão no Adobe inDesign CS4 por questões de produtividade e múltiplas saídas (impressos e online) , mas o Adobe Fireworks sempre supriu plenamente as minhas necessidades de entregar imagens de alta qualidade para exposição no monitor, porém sempre tive dúvidas em relação a compressão do tamanho dos arquivos exportados por ele atráves da opção “Save for web”  em comparação a compactação do Adobe Photoshop usando a mesma opção.

Será o Adobe Photoshop o melhor caminho em termos de compactação e exportação do arquivo para saída web?

Isso vamos descobrir juntos agora. Não vou nem tentar explicar aqui porque o sistema de compressão do Adobe Fireworks demonstra ter um desempenho melhor que o do Adobe Photoshop no quesito compactação. Mas vou provar que a saída do arquivo para publicação através do uso do Adobe Fireworks reduz significativamente o tamanho do arquivo preservando sua qualidade de exposição, com uma breve e simples sequência de testes.

Para testes usei uma ilustração feita no ilustrator e exportada em Jpeg sem nenhuma comprensão. Seria bacana se vocês também fizessem o mesmo teste para confirmar os resultados. Sinta-se a vontade para me enviar os resultados que você obteve no meu twitter @chiavegatti.

A Compressão PNG

Para propósito de testes eu usei uma imagem não comprimida (un-compressed) exportada a partir do Adobe Illustrator. No Adobe Photoshop usei a opção “Save for Web” configurando a imagem para PNG-24 com transparência e o resultado foi um arquivo com 161 Kb. No Abode Fireworks usei a mesma imagem exportada do Adobe Illustrator. No Adobe Fireworks também usei a opção “Save for Web” mas exportando a imagem em formato PNG-32. e o resultado foi um arquivo de 155 KB. Visualmente as duas imagens são iguais (pelo menos para mim). Em termos de tamanho, a imagem exportada com o Adobe Firewors é aproximadamente 6 Kb menor.

Resultados para compressão PNG

A Compressão GIF

Agora eu exportei a imagem em formato Gif com 256 cores, adaptativo, no-dither . Os resultados foram: Adobe Photoshop 58.1 Kb e Adobe Fireworks 56.2 Kb. Ganhei praticamente 2 Kb. exportando através do Adobe Fireworks. Olhando atentamente as imagens desta vez, perceba que elas não estão idênticas como anteriormente. Eu prefiro a imagem exportada pelo Fireworks, ela consegue mater a fidelidade aos detalhes da imagem original.

Resultados para compressão PNG

A Compressão JPG

Para finalizar os testes, vamos ao formato JPG. Eu exportei a imagem no Adobe Photoshop com 60% da qualidade para o formato JPG eo tamanho do arquivo foi de 46.2 KB. Já exportando a imagem no Adobe Fireworks adequei a qualidade para 80% no formato JPG e o resultado foi uma imagem com 41.8 KB. Amabas as imagem estão idênticas, a única diferença é que o Adobe Fireworks gerou um arquivo exportado menor em 4.4 KB que o Adobe Photoshop.

Resultados para compressão PNG

Atenção! O Adobe Fireworks e o Adobe Photoshop possuem uma technologia (algorítimo) de compressão diferente: Uma taxa de compressão de 80% no Fireworks corresponde a uma taxa de compressão de 60% no Adobe Photoshop.

O que é ideal?

O que é ideal? Afinal são poucos Kilobytes de diferença… Bom, realmente são Kilobytes de diferença, mas quantas imagens compõe sua interface? Obviamente a proporção de diferença do tamanho do arquivo está relacionada a dimensão da imagem. Se a Imagem tem 1024 por exemplo a diferença na redução da taxa de compressão será maior do que em um arquivo com dimensão de 640 pixels.  Vamos partir para um cenário mais próximo da realidade…

Imagine que seu site tenha aproximadamente 1000 pageviews por dia. Você tem uma imagem de Background com 220 KB, e exportando no Fireworks conseguiu reduzir 20Kb dessa imagem. Vamos as contas:

1000 * 220 KB = 214 MB por dia! * 30dias = 6.296 GB mês.

Veja só, uma aparentemente inofensiva imagem de 220 KB pode gerar uma carga de tráfego de dados mensal de mais de 6Gb! E estou sendo pessimista imagino que você terá 1000 pageviews por dia. Vamos agora reduzir 20kb na nossa conta.

1000 * 200 KB = 195 MB por dia! * 30dias = 5.712 GB mês.

Resultado da economia: [- 20KB] 19 MB por dia! * 30dias = 584 MB mês.

Conclusões

Se você tem o Adobe Photoshop e o Adobe Fireworks instaldos , realize seus próprios testes. Acredito que você ficará surpreso com os resultados, tenha em mente que arquivos menores não geram só economia de espaço, maior velocidade de carregamento e menor tráfego no servidor, gera economia de dinheiro! Eu sempre usei o Adobe Fireworks para fazer minhas interfaces e exportar as imagens de composição do Layout.

Related Posts with Thumbnails
Share

Continue Lendo

PHVsPjxsaT48c3Ryb25nPndvb19hZHNfcm90YXRlPC9zdHJvbmc+IC0gZmFsc2U8L2xpPjxsaT48c3Ryb25nPndvb19hZF8yNTBfYWRzZW5zZTwvc3Ryb25nPiAtIDxzY3JpcHQgdHlwZT1cInRleHQvamF2YXNjcmlwdFwiPjwhLS0NCmdvb2dsZV9hZF9jbGllbnQgPSBcInB1Yi0zNTE4NDExMjE1MjQzNjQwXCI7DQovKiAyNTB4MjUwLCBjcmlhZG8gMjkvMDkvMDkgKi8NCmdvb2dsZV9hZF9zbG90ID0gXCI1ODgyNDQ1ODE0XCI7DQpnb29nbGVfYWRfd2lkdGggPSAyNTA7DQpnb29nbGVfYWRfaGVpZ2h0ID0gMjUwOw0KLy8tLT4NCjwvc2NyaXB0Pg0KPHNjcmlwdCB0eXBlPVwidGV4dC9qYXZhc2NyaXB0XCINCnNyYz1cImh0dHA6Ly9wYWdlYWQyLmdvb2dsZXN5bmRpY2F0aW9uLmNvbS9wYWdlYWQvc2hvd19hZHMuanNcIj4NCjwvc2NyaXB0PjwvbGk+PGxpPjxzdHJvbmc+d29vX2FkXzI1MF9pbWFnZTwvc3Ryb25nPiAtIGh0dHA6Ly93d3cud29vdGhlbWVzLmNvbS9hZHMvd29vdGhlbWVzLTI1MHgyNTAuZ2lmPC9saT48bGk+PHN0cm9uZz53b29fYWRfMjUwX3VybDwvc3Ryb25nPiAtIGh0dHA6Ly93d3cud29vdGhlbWVzLmNvbTwvbGk+PGxpPjxzdHJvbmc+d29vX2FkX2NvbnRlbnRfYWRzZW5zZTwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX2FkX2NvbnRlbnRfZGlzYWJsZTwvc3Ryb25nPiAtIHRydWU8L2xpPjxsaT48c3Ryb25nPndvb19hZF9jb250ZW50X2ltYWdlPC9zdHJvbmc+IC0gaHR0cDovL3d3dy53b290aGVtZXMuY29tL2Fkcy93b290aGVtZXMtNDY4eDYwLTIuZ2lmPC9saT48bGk+PHN0cm9uZz53b29fYWRfY29udGVudF91cmw8L3N0cm9uZz4gLSBodHRwOi8vd3d3LmNoaWF2ZWdhdHRpLmNvbS5ici9ibG9nLzwvbGk+PGxpPjxzdHJvbmc+d29vX2FkX2ltYWdlXzE8L3N0cm9uZz4gLSBodHRwOi8vd3d3Lndvb3RoZW1lcy5jb20vYWRzL3dvb3RoZW1lcy0xMjV4MTI1LTEuZ2lmPC9saT48bGk+PHN0cm9uZz53b29fYWRfaW1hZ2VfMjwvc3Ryb25nPiAtIGh0dHA6Ly93d3cud29vdGhlbWVzLmNvbS9hZHMvd29vdGhlbWVzLTEyNXgxMjUtMi5naWY8L2xpPjxsaT48c3Ryb25nPndvb19hZF9pbWFnZV8zPC9zdHJvbmc+IC0gaHR0cDovL3d3dy53b290aGVtZXMuY29tL2Fkcy93b290aGVtZXMtMTI1eDEyNS0zLmdpZjwvbGk+PGxpPjxzdHJvbmc+d29vX2FkX2ltYWdlXzQ8L3N0cm9uZz4gLSBodHRwOi8vd3d3Lndvb3RoZW1lcy5jb20vYWRzL3dvb3RoZW1lcy0xMjV4MTI1LTQuZ2lmPC9saT48bGk+PHN0cm9uZz53b29fYWRfaW1hZ2VfNTwvc3Ryb25nPiAtIGh0dHA6Ly93d3cud29vdGhlbWVzLmNvbS9hZHMvd29vdGhlbWVzLTEyNXgxMjUtNC5naWY8L2xpPjxsaT48c3Ryb25nPndvb19hZF9pbWFnZV82PC9zdHJvbmc+IC0gaHR0cDovL3d3dy53b290aGVtZXMuY29tL2Fkcy93b290aGVtZXMtMTI1eDEyNS00LmdpZjwvbGk+PGxpPjxzdHJvbmc+d29vX2FkX3RvcF9hZHNlbnNlPC9zdHJvbmc+IC0gPC9saT48bGk+PHN0cm9uZz53b29fYWRfdG9wX2Rpc2FibGU8L3N0cm9uZz4gLSB0cnVlPC9saT48bGk+PHN0cm9uZz53b29fYWRfdG9wX2ltYWdlPC9zdHJvbmc+IC0gaHR0cDovL3d3dy53b290aGVtZXMuY29tL2Fkcy93b290aGVtZXMtNDY4eDYwLTIuZ2lmPC9saT48bGk+PHN0cm9uZz53b29fYWRfdG9wX3VybDwvc3Ryb25nPiAtIGh0dHA6Ly93d3cuY2hpYXZlZ2F0dGkuY29tLmJyL2Jsb2cvPC9saT48bGk+PHN0cm9uZz53b29fYWRfdXJsXzE8L3N0cm9uZz4gLSBodHRwOi8vd3d3LmNoaWF2ZWdhdHRpLmNvbS5ici9ibG9nLzwvbGk+PGxpPjxzdHJvbmc+d29vX2FkX3VybF8yPC9zdHJvbmc+IC0gaHR0cDovL3d3dy5jaGlhdmVnYXR0aS5jb20uYnIvYmxvZy88L2xpPjxsaT48c3Ryb25nPndvb19hZF91cmxfMzwvc3Ryb25nPiAtIGh0dHA6Ly93d3cuY2hpYXZlZ2F0dGkuY29tLmJyL2Jsb2cvPC9saT48bGk+PHN0cm9uZz53b29fYWRfdXJsXzQ8L3N0cm9uZz4gLSBodHRwOi8vd3d3LmNoaWF2ZWdhdHRpLmNvbS5ici9ibG9nLzwvbGk+PGxpPjxzdHJvbmc+d29vX2FkX3VybF81PC9zdHJvbmc+IC0gaHR0cDovL3d3dy5jaGlhdmVnYXR0aS5jb20uYnIvYmxvZy88L2xpPjxsaT48c3Ryb25nPndvb19hZF91cmxfNjwvc3Ryb25nPiAtIGh0dHA6Ly93d3cuY2hpYXZlZ2F0dGkuY29tLmJyL2Jsb2cvPC9saT48bGk+PHN0cm9uZz53b29fYWx0X3N0eWxlc2hlZXQ8L3N0cm9uZz4gLSBibHVlLmNzczwvbGk+PGxpPjxzdHJvbmc+d29vX2F1dG9faW1nPC9zdHJvbmc+IC0gZmFsc2U8L2xpPjxsaT48c3Ryb25nPndvb19jYXRfZXg8L3N0cm9uZz4gLSA8L2xpPjxsaT48c3Ryb25nPndvb19jb21tZW50X3Bvc3RzPC9zdHJvbmc+IC0gU2VsZWN0IGEgbnVtYmVyOjwvbGk+PGxpPjxzdHJvbmc+d29vX2NvbnRlbnQ8L3N0cm9uZz4gLSBmYWxzZTwvbGk+PGxpPjxzdHJvbmc+d29vX2NvbnRlbnRfYXJjaGl2ZXM8L3N0cm9uZz4gLSBmYWxzZTwvbGk+PGxpPjxzdHJvbmc+d29vX2NvbnRlbnRfZmVhdDwvc3Ryb25nPiAtIGZhbHNlPC9saT48bGk+PHN0cm9uZz53b29fY3VzdG9tX2Zhdmljb248L3N0cm9uZz4gLSAvZmF2aWNvbi9mYXZpY29uLnBuZzwvbGk+PGxpPjxzdHJvbmc+d29vX2ZlYXR1cmVkX3Bvc3RzPC9zdHJvbmc+IC0gMzwvbGk+PGxpPjxzdHJvbmc+d29vX2ZlZWRidXJuZXJfaWQ8L3N0cm9uZz4gLSA8L2xpPjxsaT48c3Ryb25nPndvb19mZWVkYnVybmVyX3VybDwvc3Ryb25nPiAtIGh0dHA6Ly9mZWVkcy5mZWVkYnVybmVyLmNvbS9DaGlhdmVnYXR0aTwvbGk+PGxpPjxzdHJvbmc+d29vX2dvb2dsZV9hbmFseXRpY3M8L3N0cm9uZz4gLSA8c2NyaXB0IHR5cGU9XCJ0ZXh0L2phdmFzY3JpcHRcIj4gDQp2YXIgZ2FKc0hvc3QgPSAoKFwiaHR0cHM6XCIgPT0gZG9jdW1lbnQubG9jYXRpb24ucHJvdG9jb2wpID8gXCJodHRwczovL3NzbC5cIiA6IFwiaHR0cDovL3d3dy5cIik7DQpkb2N1bWVudC53cml0ZSh1bmVzY2FwZShcIiUzQ3NjcmlwdCBzcmM9XCdcIiArIGdhSnNIb3N0ICsgXCJnb29nbGUtYW5hbHl0aWNzLmNvbS9nYS5qc1wnIHR5cGU9XCd0ZXh0L2phdmFzY3JpcHRcJyUzRSUzQy9zY3JpcHQlM0VcIikpOw0KPC9zY3JpcHQ+DQo8c2NyaXB0IHR5cGU9XCJ0ZXh0L2phdmFzY3JpcHRcIj4NCnRyeSB7DQp2YXIgcGFnZVRyYWNrZXIgPSBfZ2F0Ll9nZXRUcmFja2VyKFwiVUEtNjE3NDExMS0xXCIpOw0KcGFnZVRyYWNrZXIuX3RyYWNrUGFnZXZpZXcoKTsNCn0gY2F0Y2goZXJyKSB7fTwvc2NyaXB0PjwvbGk+PGxpPjxzdHJvbmc+d29vX2hvbWVfYXJjPC9zdHJvbmc+IC0gZmFsc2U8L2xpPjxsaT48c3Ryb25nPndvb19ob21lX2xpbms8L3N0cm9uZz4gLSB0cnVlPC9saT48bGk+PHN0cm9uZz53b29faG9tZV9saW5rX2Rlc2M8L3N0cm9uZz4gLSA8L2xpPjxsaT48c3Ryb25nPndvb19ob21lX2xpbmtfdGV4dDwvc3Ryb25nPiAtIEhvbWU8L2xpPjxsaT48c3Ryb25nPndvb19ob21lX3RodW1iX2hlaWdodDwvc3Ryb25nPiAtIDkyPC9saT48bGk+PHN0cm9uZz53b29faG9tZV90aHVtYl93aWR0aDwvc3Ryb25nPiAtIDI0NzwvbGk+PGxpPjxzdHJvbmc+d29vX2ltYWdlX2hlaWdodDwvc3Ryb25nPiAtIDIxMDwvbGk+PGxpPjxzdHJvbmc+d29vX2ltYWdlX3NpbmdsZTwvc3Ryb25nPiAtIGZhbHNlPC9saT48bGk+PHN0cm9uZz53b29faW1hZ2Vfd2lkdGg8L3N0cm9uZz4gLSA1NDA8L2xpPjxsaT48c3Ryb25nPndvb19sb2dvPC9zdHJvbmc+IC0gL2ltYWdlbnMvd3Bsb2dvLnBuZzwvbGk+PGxpPjxzdHJvbmc+d29vX21hbnVhbDwvc3Ryb25nPiAtIGh0dHA6Ly93d3cud29vdGhlbWVzLmNvbS9zdXBwb3J0L3RoZW1lLWRvY3VtZW50YXRpb24vYnVzeS1iZWUvPC9saT48bGk+PHN0cm9uZz53b29fcG9wdWxhcl9wb3N0czwvc3Ryb25nPiAtIDI8L2xpPjxsaT48c3Ryb25nPndvb19yZXNpemU8L3N0cm9uZz4gLSB0cnVlPC9saT48bGk+PHN0cm9uZz53b29fc2hvcnRuYW1lPC9zdHJvbmc+IC0gd29vPC9saT48bGk+PHN0cm9uZz53b29fc2luZ2xlX2hlaWdodDwvc3Ryb25nPiAtIDEyMDwvbGk+PGxpPjxzdHJvbmc+d29vX3NpbmdsZV93aWR0aDwvc3Ryb25nPiAtIDE4MDwvbGk+PGxpPjxzdHJvbmc+d29vX3RhYnM8L3N0cm9uZz4gLSBmYWxzZTwvbGk+PGxpPjxzdHJvbmc+d29vX3RoZW1lbmFtZTwvc3Ryb25nPiAtIEJ1c3kgQmVlPC9saT48bGk+PHN0cm9uZz53b29fdGh1bWJfaGVpZ2h0PC9zdHJvbmc+IC0gODg8L2xpPjxsaT48c3Ryb25nPndvb190aHVtYl93aWR0aDwvc3Ryb25nPiAtIDg4PC9saT48bGk+PHN0cm9uZz53b29fdHdpdHRlcjwvc3Ryb25nPiAtIGNoaWF2ZWdhdHRpPC9saT48bGk+PHN0cm9uZz53b29fdmlkZW9fY2F0ZWdvcnk8L3N0cm9uZz4gLSBTZWxlY3QgYSBjYXRlZ29yeTo8L2xpPjwvdWw+