Performance Web - Agência MZ

Core Web Vitals: Como Atingir Verde no PageSpeed Insights

Core Web Vitals são três métricas que o Google usa para avaliar a experiência do usuário no seu site: LCP (Largest Contentful Paint), CLS (Cumulative Layout Shift) e INP (Interaction to Next Paint). Atingir verde nas três é fator direto de SEO. Esse guia mostra como conseguir em 2026.

O que são Core Web Vitals (LCP, CLS, INP)

  • LCP (Largest Contentful Paint): tempo até o maior elemento visível carregar. Verde: ≤ 2.5s. Amarelo: 2.5-4s. Vermelho: > 4s.
  • CLS (Cumulative Layout Shift): instabilidade visual durante carregamento. Verde: ≤ 0.1. Amarelo: 0.1-0.25. Vermelho: > 0.25.
  • INP (Interaction to Next Paint): responsividade a cliques/toques. Verde: ≤ 200ms. Amarelo: 200-500ms. Vermelho: > 500ms. Substituiu o FID em março de 2024.

Por que impactam SEO em 2026

Google usa Core Web Vitals como fator de ranqueamento confirmado desde 2021. Sites com métricas vermelhas perdem posição para concorrentes verdes em buscas competitivas. Além disso, sites lentos têm taxa de rejeição 3-5x maior — mesmo subindo nos resultados, perdem o cliente na primeira impressão.

Como medir corretamente (lab vs field data)

PageSpeed Insights mostra duas medidas: field data (dados reais de usuários do Chrome últimos 28 dias — fonte: CrUX) e lab data (simulação ideal). Google ranqueia pelo field. Sites novos ou de baixo tráfego não têm field data — aparecem só com lab.

Otimizar LCP (Largest Contentful Paint)

  • Servir imagem do hero pré-otimizada (WebP/AVIF, dimensões corretas)
  • Usar preload na imagem ou fonte crítica
  • Ativar cache de página (LiteSpeed Cache, WP Rocket)
  • Hospedagem rápida (TTFB < 600ms)
  • Não usar lazy load na imagem hero
  • Servir CSS crítico inline (critical CSS)
  • Reduzir cadeia de requisições antes do LCP
  • Usar CDN (Cloudflare, Bunny)

Otimizar CLS (Cumulative Layout Shift)

  • Definir width e height explícitos em imagens e iframes
  • Reservar espaço para anúncios e widgets externos
  • Carregar fontes com font-display:optional ou swap controlado
  • Evitar inserção dinâmica de conteúdo acima de elementos já visíveis
  • Usar transform/opacity em animações (não top/left/height)

Otimizar INP (Interaction to Next Paint)

  • Reduzir JavaScript executado no carregamento
  • Defer JavaScript não-crítico
  • Quebrar tarefas longas com requestIdleCallback ou setTimeout
  • Usar Web Workers para processamento pesado
  • Minimizar third-party scripts (Google Tag Manager, pixels)
  • Servir JS em chunks menores

Plugins recomendados para WordPress

  • LiteSpeed Cache: gratuito, melhor opção em servidor LiteSpeed
  • WP Rocket: pago, premium, fácil de configurar
  • FlyingPress: pago, foco em Core Web Vitals
  • Perfmatters: pago, otimização avançada (disable scripts por página)
  • Imagify / ShortPixel / DropAvif: otimização de imagens
  • WP-Optimize: limpeza de banco de dados

Perguntas frequentes

Quanto tempo leva para Core Web Vitals melhorar?

Tecnicamente as melhorias surtem efeito imediato. Mas o Google usa dados dos últimos 28 dias, então o field data atualiza gradualmente. Espere 30-45 dias para ver impacto completo no relatório.

Preciso atingir 100/100 no PageSpeed?

Não. Verde em CWV (75+ em mobile, 85+ em desktop) já é suficiente. Buscar 100 muitas vezes traz pouco ganho com muito esforço.

Hospedagem barata impede ter verde?

Geralmente sim. TTFB acima de 800ms já compromete o LCP. Para verde consistente em 2026, hospedagem otimizada para WordPress é praticamente obrigatória.

WPBakery e Elementor atrapalham Core Web Vitals?

Sim, ambos adicionam CSS/JS pesado. Migrar para tema/builder leve (Bricks Builder, Kadence, GeneratePress + GenerateBlocks) costuma resolver 50-70% dos problemas de Core Web Vitals.

Quer Core Web Vitals verde no seu site?

A Agência MZ otimiza sites WordPress para verde em Core Web Vitals. Conheça nosso serviço de SEO que inclui otimização técnica completa, ou fale no WhatsApp.

Posts Similares