Como otimizar imagens JPEG para a Web - dummies

Ter imagens atraentes em seu site é uma das melhores maneiras de atrair entusiastas de iPhone e iPad conscientes da imagem. O formato JPEG é a melhor opção para otimizar imagens de tons contínuos, como fotografias e imagens com muitas cores ou gradientes.

Quando você otimiza um JPEG, você pode reduzir o tamanho do arquivo aplicando a compressão. Quanto mais compressão, menor a imagem, mas se você comprimir a imagem demais, a imagem pode parecer terrível. O truque é encontrar o equilíbrio certo.

Se você tiver uma fotografia digital ou outra imagem que deseja preparar para a web, siga estas etapas para otimizar e salvá-lo no Photoshop (no Photoshop Elements ou no Fireworks, o processo é similar, embora o as etapas específicas podem variar):

1 Com a imagem aberta no Photoshop, escolha Arquivo → Salvar para Web e Dispositivos (ou Arquivo → Salvar para Web).

A caixa de diálogo Salvar para Web e Dispositivos aparece.

2 No canto superior esquerdo da caixa de diálogo, escolha 2-Up ou 4-Up para exibir várias versões da mesma imagem para facilitar a comparação lado-a-lado.

A configuração 2-Up permite visualizar a imagem original na parte superior e uma pré-visualização da mesma imagem que aparecerá com as configurações especificadas na parte inferior (se você estiver trabalhando com uma imagem vertical, as pré-visualizações aparecem lado a lado). A opção 4-Up, como o nome indica, exibe quatro versões diferentes para comparação.

Imagens dos artistas Amy Baur e Brian Boldon, do inplainsight art.

3 No lado direito da janela, apenas sob Preset, clique na seta pequena para abrir a lista suspensa Otimizado de formato de arquivo e escolha JPEG.

O formato JPEG é a melhor opção para otimizar imagens de tons contínuos, como fotografias e imagens com muitas cores ou gradientes.

4Sele a qualidade da compressão.

Use as opções predefinidas Baixa, Média, Alta, Muito alta ou Máxima na lista suspensa. Ou use o controle deslizante logo abaixo do campo Qualidade para fazer ajustes mais precisos. Reduzir a qualidade reduz o tamanho do arquivo e faz o download da imagem mais rapidamente, mas se você baixar este número demais, a imagem parecerá desfocada e manchada.

O Photoshop usa uma escala de compressão de 0 a 100 para JPEGs nesta janela de diálogo, com 0 a qualidade mais baixa possível (a maior quantidade de compressão e o menor tamanho de arquivo) e 100 a qualidade mais alta possível (a menor quantidade de compressão e o maior tamanho de arquivo). Baixo, Médio e Alto representam valores de compressão de 10, 30 e 60, respectivamente.

5Specifique outras configurações conforme desejado (a qualidade da compressão e o formato do arquivo são as configurações mais importantes).

Por exemplo, você pode selecionar a caixa de seleção Progressivo para exibir a imagem progressivamente em um navegador da Web; ou seja, para exibi-lo primeiro em uma resolução baixa e, em seguida, em resoluções progressivamente mais elevadas à medida que o download avança. (Alguns navegadores não suportam JPEG progressivos.)

6Clique em Salvar.

A caixa de diálogo Salvar otimizado como é aberta.

7Introduza um nome para a imagem e guarde-a na pasta de imagens na pasta do seu site.

O Photoshop economiza a imagem otimizada como uma cópia do original e deixa o original aberto na área de trabalho principal do Photoshop.

Repita essas etapas para cada imagem que você deseja otimizar como um JPEG.

Na parte inferior da pré-visualização da imagem na caixa de diálogo Salvar para Web e Dispositivos, o Photoshop inclui uma estimativa do tempo necessário para que a imagem seja baixada na velocidade de conexão especificada. À medida que você ajusta as configurações de compressão, o tamanho da imagem muda e a estimativa de download será ajustada automaticamente.

Você pode alterar a velocidade de conexão usada para fazer esse cálculo clicando na pequena seta à direita da velocidade de conexão e usando a lista suspensa para selecionar outra opção, como 256 Kbps para a velocidade do modem a cabo. Use esta estimativa como guia para ajudá-lo a decidir o quanto você deve otimizar cada imagem.