Imagens pesadas são a causa número um de sites lentos. Neste guia, mostro como uso o Squoosh — ferramenta gratuita do Google — para reduzir o tamanho de imagens em até 80% sem perda visível, melhorando os Core Web Vitals e o ranqueamento no Google.

Por que otimizar imagens importa para SEO

Desde 2021 o Google usa os Core Web Vitals como sinal de ranqueamento. A métrica mais sensível ao peso das imagens é o LCP (Largest Contentful Paint) — o tempo até o maior elemento visível carregar. Em quase todo site, esse elemento é uma imagem de hero.

Resultado prático: sites rápidos rankeiam melhor, convertem mais e gastam menos banda. Otimizar imagens é o ajuste de maior impacto e menor esforço que existe em performance web.

O que é o Squoosh

Squoosh é um compressor de imagens open source feito pelo time do Google Chrome. Roda 100% no navegador (suas imagens nunca saem do seu computador), suporta formatos modernos como WebP e AVIF e mostra um comparador lado a lado entre o original e a versão comprimida.

Passo a passo: comprimindo uma imagem

Abra o Squoosh em squoosh.app e arraste sua imagem para o centro da tela.
Escolha o formato moderno. No painel direito, troque de JPEG/PNG para WebP (compatível com 97% dos navegadores) ou AVIF (mais leve ainda, suporte crescente).
Ajuste a qualidade entre 70 e 80. Use o controle deslizante e observe o comparador antes/depois. Em 95% dos casos não há diferença visível.
Redimensione antes de exportar. Na seção Resize, defina a largura no tamanho real em que a imagem aparece no layout — 1600px para hero, 800px para cards, 400px para avatares. Servir uma foto 4000px num espaço de 800px desperdiça banda.
Baixe e publique. Clique no botão de download no canto inferior direito e substitua o arquivo original.

Quanto dá para economizar

Em projetos reais que entrego, é comum reduzir uma imagem hero de 2,4 MB (JPEG) para 180 KB (WebP qualidade 78) — uma economia de 92% sem que ninguém perceba a diferença a olho nu. Multiplique isso por 15 imagens numa landing page e o LCP cai de 4s para abaixo de 2,5s, dentro da faixa "boa" do Google.

Boas práticas que uso em todo projeto

Sempre WebP para fotos e PNG só quando precisa de transparência sem ruído.
SVG para ícones e logos — escala em qualquer resolução e pesa kilobytes.
Atributos width e height em toda tag <img> para evitar layout shift (CLS).
Lazy loading (loading="lazy") em imagens abaixo da dobra.
Imagem do hero com fetchpriority="high" para acelerar o LCP.

Quer um site que já nasce rápido?

Todos os sites que entrego em parceria com a 2Rs Agência já saem com imagens otimizadas, Core Web Vitals dentro da faixa boa do Google e SEO técnico configurado. Performance não é uma etapa final — é decisão de design desde o primeiro layout.

Veja meu portfólio e serviços

Squoosh: como otimizar imagens para web sem perder qualidade