Como comprimir imagens para deixar o site mais rápido

Por Thiago · Atualizado em 25 de setembro de 2026 · 3 min de leitura

Na maioria dos sites, as imagens são a maior parte do que o visitante baixa. Imagens pesadas deixam as páginas lentas, e páginas lentas perdem visitantes e ficam pior no Google. Felizmente, o peso das imagens também é a coisa mais fácil de resolver.

Por que o tamanho das imagens importa

• Visitantes desistem de páginas lentas, principalmente no celular com dados móveis.
• O Google mede a experiência na página. As Core Web Vitals incluem o "Largest Contentful Paint", o tempo até o conteúdo principal (muitas vezes uma imagem) aparecer.
• Hospedagem e tráfego custam mais a cada megabyte entregue.

Passo 1: use as dimensões certas

Esse é o passo mais esquecido e muitas vezes o que mais economiza. Uma foto direto do celular pode ter 4000 pixels de largura, mas a coluna do seu blog pode ter 800. O navegador baixa os 4000 pixels e depois joga a maior parte fora.

Como regra prática, exporte as imagens com cerca do dobro da largura em que aparecem, para ficarem nítidas em telas de alta resolução. Para uma imagem de destaque na largura toda, isso costuma dar de 2000 a 2400 pixels. Para uma imagem dentro do texto, de 1200 a 1600 pixels. Para miniaturas, poucas centenas de pixels. Use a nossa ferramenta Redimensionar imagem (ou qualquer editor de fotos) antes de comprimir.

Passo 2: use o formato certo

Todos os navegadores atuais aceitam WEBP, então para um site ele costuma ser o melhor padrão. Use JPG para WEBP e PNG para WEBP. Para mais detalhes, veja WEBP, PNG ou JPG.

Passo 3: comprima

A compressão remove dados que não vão fazer falta. O compressor de imagens mantém cada imagem no formato e na resolução originais e aplica ajustes mais fortes e inteligentes:

• JPG: recodificado com MozJPEG em qualidade 72, um codificador feito especialmente para gerar JPGs menores com a mesma qualidade visual.
• PNG: reduzido a uma paleta otimizada de até 256 cores (a técnica usada por ferramentas como o pngquant) com compressão máxima. Prints e artes costumam diminuir muito.
• WEBP: recodificado em qualidade 70, e WEBPs animados mantêm a animação.
• Sem surpresas: se a imagem já está bem otimizada e o resultado não ficaria menor, você recebe o original de volta.

A imagem também é girada do jeito que aparece no celular, e o resultado sai no mesmo formato enviado, pronto para colocar no site.

Conferindo o resultado

Compare sempre o antes e o depois no tamanho em que a imagem realmente aparece. Olhe áreas com detalhes finos (cabelo, texto, folhas) e degradês suaves (céu). Se aparecerem blocos ou faixas, use um ajuste mais leve ou o original naquela imagem específica. Compressão forte quase nunca é perceptível em miniaturas e imagens de fundo, então dá para ser mais agressivo nelas.

Além da compressão

• Carregamento tardio: adicione loading="lazy" às imagens mais abaixo na página para elas só carregarem quando o visitante rolar até lá.
• Atributos de largura e altura: defina em toda imagem para a página não pular enquanto carrega.
• Texto alternativo descritivo: ajuda quem usa leitores de tela e ajuda os buscadores a entenderem a imagem.
• Nomes de arquivo descritivos: "tenis-corrida-vermelho.webp" diz mais que "IMG_4821.webp".