Na maioria dos sites, as imagens são a coisa mais pesada da página, muitas vezes maiores que o HTML, o CSS e o JavaScript somados. Se uma página parece lenta, as imagens são o primeiro lugar para olhar, e as correções costumam ser rápidas.
Três técnicas fazem quase todo o trabalho: redimensionar a imagem para o tamanho em que ela é realmente exibida, comprimi-la e servi-la em um formato moderno. Aplicadas juntas, elas rotineiramente cortam o peso das imagens em 70% ou mais.
Redimensione para o tamanho que você realmente exibe
Esse é o erro mais comum e mais esbanjador. Uma foto recém-saída da câmera pode ter 6000 pixels de largura, mas seu artigo a exibe em uma coluna de 800 pixels. O navegador baixa todos os seis mil pixels e depois joga a maior parte fora ao reduzir a imagem para encaixar.
Servir uma imagem de 6000 pixels em um espaço de 800 pixels pode significar baixar cinco a dez vezes mais dados do que o necessário. A correção é simples: redimensione o arquivo para aproximadamente a largura que ele vai ocupar, mais uma folga para telas de alta densidade.
Uma regra prática:
- Imagem hero de largura total: 1600–2000 px de largura é suficiente.
- Imagem dentro do artigo: 1000–1400 px.
- Miniatura: 300–500 px.
Use o Redimensionador de Imagens para reduzir cada imagem antes de ela chegar à sua página. Ele mantém a proporção travada para nada esticar.
Comprima para eliminar o desperdício
Uma vez que as dimensões estão certas, a compressão remove detalhes que o olho não percebe. Para fotografias, uma qualidade em torno de 75–85% é o ponto ideal: o arquivo despenca enquanto a imagem parece a mesma. Para gráficos planos e capturas de tela salvas como PNG, a redução da contagem de cores (quantização para 256 cores) pode encolher o arquivo a uma fração do tamanho original.
O Compressor de Imagens cuida dos dois. Ele recodifica JPEG e WebP por qualidade, quantiza PNGs e garante que nunca vai produzir um arquivo maior do que o que você começou. Se você tem uma galeria inteira, processe tudo em lote e baixe um ZIP.
Mude para um formato moderno
A escolha de formato sozinha pode reduzir um arquivo pela metade. Veja como as opções comuns se comparam para fotografias.
| Formato | Tamanho típico vs JPEG | Melhor para |
|---|---|---|
| JPEG | Referência | Fallback universal; fotos |
| WebP | ~25–35% menor | Fotos e gráficos; amplo suporte de navegadores |
| AVIF | ~50% menor | Fotos onde o menor tamanho importa |
| PNG | Muito maior para fotos | Logos, ícones, gráficos planos, transparência |
WebP é o padrão seguro em 2026 — todo navegador atual o lê e ele supera o JPEG com folga. AVIF vai ainda menor, mas leva mais tempo para codificar e tem suporte um pouco mais restrito. O Conversor de Imagens permite mirar em AVIF e recorre silenciosamente ao WebP quando o AVIF não é a escolha certa, então você obtém o melhor resultado disponível sem adivinhação.
Uma ressalva: não use PNG para fotografias. O PNG brilha para logos, ícones e qualquer coisa que precise de transparência, mas para uma foto ele pode ser várias vezes maior que um WebP da mesma qualidade.
Junte tudo
Um fluxo confiável para qualquer imagem destinada à web:
- Redimensione para a largura de exibição (mais folga para telas retina).
- Converta para WebP, ou AVIF se quiser o menor arquivo possível.
- Comprima a 75–85% de qualidade para aparar o que sobrou de desperdício.
Faça isso e uma foto de câmera de 5 MB pode virar um WebP de 120 KB que parece idêntico em uma coluna de artigo. Multiplique por uma página inteira e a diferença no tempo de carregamento é dramática.
Tudo roda no seu navegador usando Canvas e WebAssembly, então nada é enviado e as ferramentas continuam funcionando offline após a primeira visita. Isso significa que você pode preparar uma pasta de imagens para o seu site sem entregá-las a nenhum servidor.
Além dos arquivos
Mais dois hábitos ajudam, e não custam nada:
- Carregue de forma preguiçosa as imagens abaixo da dobra com
loading="lazy"para o navegador só buscá-las quando o leitor rolar para perto. - Defina os atributos width e height para o layout não pular enquanto as imagens carregam, o que também ajuda na sua pontuação de Core Web Vitals.
Quer saber exatamente quais imagens estão pesando em uma página? Nosso guia de SEO de imagens cobre a auditoria, e uma verificação de velocidade da página vai listar os recursos mais pesados para você saber onde mirar primeiro.