Por que comprimir imagens
Imagens costumam ser a maior parte do peso de uma página. Uma foto tirada no celular facilmente passa de 3 MB, enquanto a mesma imagem comprimida para o site fica entre 100 e 300 KB sem diferença visível na tela. Página mais leve abre mais rápido, principalmente no celular, e o tempo de carregamento é um dos fatores que o Google considera nas Core Web Vitals.
Esta ferramenta comprime a imagem dentro do seu navegador. O arquivo não é enviado a nenhum servidor, o que permite usá-la com imagens internas ou confidenciais.
Como escolher a qualidade
- 80% a 85%: fotos em destaque, banners e imagens de produto. A diferença para o original é praticamente invisível.
- 70% a 75%: o equilíbrio para a maioria das imagens de site e de blog.
- 50% a 60%: miniaturas e imagens pequenas, onde os defeitos de compressão não aparecem.
- Abaixo de 50%: começam a aparecer blocos e manchas, principalmente em textos, degradês e bordas.
Compare o antes e o depois que a ferramenta mostra antes de baixar. Se notar defeitos, aumente a qualidade.
Formatos: qual usar
- JPG: fotos e imagens com muitas cores e degradês. Não tem transparência.
- PNG: logotipos, ícones, capturas de tela com texto e imagens com fundo transparente. Em fotos, gera arquivos muito maiores que o JPG.
- WebP: formato moderno que costuma ser menor que JPG e PNG com a mesma qualidade, aceito por todos os navegadores atuais.
Nesta ferramenta, arquivos PNG continuam PNG (preservando a transparência), e JPG e WebP são salvos como JPG.
A dimensão importa mais que a compressão
Uma foto de 4000 × 3000 pixels exibida num espaço de 800 pixels de largura carrega 15 vezes mais pixels do que o necessário. Antes de comprimir, redimensione a imagem para o tamanho máximo em que ela vai aparecer (considerando o dobro para telas de alta resolução). Redimensionar e depois comprimir costuma reduzir o arquivo muito mais do que só baixar a qualidade.
Outras dicas para o site
- Defina largura e altura nas tags de imagem para a página não "pular" durante o carregamento.
- Use carregamento sob demanda (
loading="lazy") em imagens que ficam abaixo da primeira tela. - Preencha o texto alternativo (
alt) descrevendo a imagem: ajuda a acessibilidade e a busca de imagens do Google. - Use nomes de arquivo descritivos, como
servidor-rack-datacenter.jpgem vez deIMG_4382.jpg.
Perguntas frequentes
Minhas imagens são enviadas para algum servidor?
Não. Todo o processamento acontece no seu navegador. A imagem não sai do seu computador.
Por que o PNG quase não diminuiu?
O PNG é um formato sem perda: ele preserva cada pixel, então a configuração de qualidade tem pouco efeito. Para fotos, converta para JPG. Para logos e ícones, reduzir as dimensões é o que mais diminui o arquivo.
Comprimir várias vezes a mesma imagem reduz ainda mais?
Reduz pouco e piora a qualidade a cada vez, porque o JPG perde informação em cada compressão. Sempre comprima a partir do arquivo original.
Qual o tamanho ideal de uma imagem para site?
Não há um número fixo, mas como referência: fotos grandes de destaque abaixo de 300 KB, imagens de conteúdo abaixo de 150 KB e miniaturas abaixo de 50 KB.