WebP, AVIF ou JPEG?
AVIF entrega arquivos 30% menores que WebP para a mesma qualidade. Mas a adoção em iOS antigo ainda exige fallback. Use a tag picture com source AVIF, WebP e JPEG por essa ordem para servir o melhor formato suportado em cada navegador.
Lazy loading nativo
- Use loading="lazy" em todas as imagens abaixo da dobra
- Mantenha eager (ou sem atributo) para a hero
- Combine com fetchpriority="high" no LCP
- Defina width e height para evitar CLS
Responsive images com srcset
Sirva versões diferentes da mesma imagem para diferentes tamanhos de tela. Mobile não precisa baixar a versão 1920px. Use srcset e sizes para o navegador escolher a melhor opção, economizando até 70% de banda em mobile.
CDN de imagens
- Cloudinary, imgix ou Cloudflare Images
- Conversão automática para formato moderno
- Redimensionamento sob demanda
- Cache global próximo ao usuário
Perguntas frequentes
AVIF já é seguro usar em 2026?
Sim, com fallback para WebP. Cobertura passa de 92%.
Lazy loading prejudica SEO?
Não, desde que a hero LCP não esteja lazy.
Posso usar imagens SVG para tudo?
Para ícones e logos, sim. Para fotos, não.
Qual qualidade ideal?
75-85 para WebP/AVIF mantém visual sem peso excessivo.
CDN é obrigatório?
Para sites com tráfego, sim. Pequenos sites podem servir do mesmo servidor.
Conclusão
Imagens otimizadas é a vitória mais rápida em performance. Cada KB economizado se traduz em melhor ranking, mais conversão e usuários mais felizes.