Como as imagens afetam os Core Web Vitals - e como corrigir
Imagens são responsáveis pela maioria das falhas de LCP (Largest Contentful Paint). Se seus Core Web Vitals estão vermelhos, suas imagens provavelmente são a razão. Veja exatamente como corrigir.
Experimente agora - grátis, sem cadastro.
Smart Compress Images →Imagens e LCP (Largest Contentful Paint)
LCP mede quando o maior elemento visível termina de carregar. Para a maioria das páginas, é uma imagem. Google quer LCP abaixo de 2,5 segundos.
- Use WebP/AVIF: 25-50% arquivos menores = download mais rápido. Converter agora.
- Redimensione: Sirva o tamanho certo para o container. Redimensionar aqui.
- Pré-carregue imagens hero:
<link rel="preload" as="image" href="hero.webp"> - Use um CDN: Sirva imagens de servidores edge próximos aos usuários.
- Defina fetchpriority:
<img fetchpriority="high">para imagens acima da dobra.
Imagens e CLS (Cumulative Layout Shift)
CLS mede movimentos inesperados de layout. Imagens sem dimensões fazem a página pular quando carregam.
- Sempre defina width e height:
<img width="800" height="600"> - Use aspect-ratio CSS:
aspect-ratio: 16/9;como alternativa moderna - Evite lazy loading acima da dobra: Não adicione
loading="lazy"na sua imagem hero
A checklist rápida
- Smart Compress todas as imagens
- Redimensionar para as dimensões reais de exibição
- Adicionar atributos width/height a todas as tags
<img> - Pré-carregar sua imagem LCP
- Lazy load tudo abaixo da dobra
- Re-testar no PageSpeed Insights
FAQ
O que é um bom score LCP?
Abaixo de 2,5 segundos é "Bom" (verde). 2,5-4 segundos é "Precisa melhorar" (amarelo). Acima de 4 segundos é "Ruim" (vermelho). Otimização de imagens sozinha pode frequentemente mover você de vermelho para verde.
Devo fazer lazy load de todas as imagens?
Não! Não faça lazy load de imagens acima da dobra (especialmente sua imagem hero/LCP). Só faça lazy load de imagens inicialmente fora da tela. Excesso de lazy loading na verdade prejudica o LCP.
Pronto? 100% grátis, roda no seu navegador.
Smart Compress Images →