Mais
×

Como otimizar imagens PNG para a Web no Photoshop CS4

Atualizado em 13 abril, 2018

Ao otimizar imagens para a Web, cada imagem deve ser tratada individualmente para existir um bom equilíbrio entre qualidade e tamanho de arquivo. O Adobe Photoshop CS4 utiliza duas variações de PNG. A PNG-24, que é capaz de conter muitas cores e PNG-8, que gera arquivos muito menores. Isso quer dizer que imagens PNG-8 carregam mais rápido, mas não contêm toda a gama de cores que as imagens salvas em PNG-24. O Photoshop CS4 tem a opção "Salvar para Web e Dispositivos" que facilita a otimização de imagens para Web.

Instruções

  1. Abra uma imagem no Adobe Photoshop CS4.

  2. Clique no menu "Arquivo" e selecione "Salvar para a Web e Dispositivos".

  3. Amplie ou diminua a visualização da imagem clicando no menu drop-down, no canto inferior esquerdo da janela. Você pode digitar uma porcentagem ou selecionar uma das sugeridas nesse menu.

  4. Selecione "PNG-24" como tipo de arquivo no menu drop-down do lado direito da janela.

  5. Selecione a aba "Impressão 4-up" acima da visualização. Isso muda a janela de visualização, tornando possível visualizar a imagem original, a mesma salva em PNG-24 e em outros dois formatos, lado a lado.

  6. Configure o arquivo PNG-24 com as opções existentes no lado direito da janela, comparando a qualidade da imagem à original e prestando atenção ao tamanho do arquivo.

  7. Clique em uma das janelas da visualização que não seja da imagem original ou da PNG-24. Mude o formato dela para PNG-,8 no menu drop-down.

  8. Configure o arquivo PNG-8 com as opções no lado direito da janela, comparando a qualidade da imagem à original e à do arquivo PNG-24, e prestando atenção ao tamanho do arquivo.

  9. Selecione "Perceptivo" para dar prioridade às cores que o olho humano é mais sensível.

  10. Selecione "Seletivo" para usar uma gama maior do que a da opção "Perceptivo".

  11. Selecione "Adaptativo" para dar preferência às cores mais usadas na imagem.

  12. Selecione "Personalizado" para modificar a paleta de cores manualmente na tabela de cores.

  13. Selecione "Transparência" para manter pixels transparentes na imagem. Clique "Fosco" para substituir os pixels transparentes por uma cor, depois escolha a cor que deseja usar.

  14. Selecione a imagem que tenha o menor tamanho ao mesmo tempo em que é mais fiel à imagem original.

Cite this Article A tool to create a citation to reference this article Cite this Article