Korbi Studio
Fale conosco →
PT ENComing soon
← Blog · Tecnologia

Core Web Vitals: o que são e por que seu site precisa passar

Core Web Vitals são as métricas de experiência do Google que influenciam ranking. Entenda o que mede cada uma e como melhorar seu site na prática.

Miguel Moraes Miguel Moraes · · 6 min de leitura
core web vitals performance seo ux velocidade

Desde 2021, o Google usa métricas de experiência do usuário como fator de rankeamento. Se o seu site é lento, instável ou bloqueia a interação, ele é penalizado nas buscas — mesmo que o conteúdo seja bom. As métricas que medem isso são chamadas de Core Web Vitals.

Entender o que cada uma mede e como melhorar é cada vez mais parte do trabalho de SEO e não pode ser delegado só para "ajustar no final".

O que são Core Web Vitals

Core Web Vitals são três métricas definidas pelo Google para medir a experiência real de quem visita um site. Elas avaliam velocidade, capacidade de resposta e estabilidade visual.

Métrica O que mede Meta
LCP (Largest Contentful Paint) Tempo até o maior elemento visível aparecer ≤ 2,5 segundos
INP (Interaction to Next Paint) Tempo de resposta a qualquer interação ≤ 200ms
CLS (Cumulative Layout Shift) Quanto o layout "pula" durante o carregamento ≤ 0,1

Cada métrica tem três faixas: Bom, Precisa melhorar e Ruim. O Google usa o dado do percentil 75 dos seus visitantes — ou seja, 75% das visitas precisam estar na faixa "Bom" para o site ser considerado aprovado.

LCP: por que seu conteúdo principal demora a aparecer

O LCP mede quanto tempo leva para o maior elemento visível da viewport aparecer. Normalmente é uma imagem hero, um vídeo ou um bloco de texto grande.

As causas mais comuns de LCP ruim:

  1. Imagens sem otimização — JPG de 3MB onde caberia um WebP de 120KB
  2. Fonte bloqueando renderizaçãofont-display: swap não configurado
  3. JavaScript no <head> sem async ou defer — bloqueia o parser HTML
  4. Hosting lento — servidor com TTFB (Time to First Byte) acima de 600ms
  5. Sem cache adequado — cada visita baixa tudo do zero

A correção mais rápida para a maioria dos sites: otimizar a imagem principal e adicionar fetchpriority="high" nela. Essa mudança sozinha pode reduzir o LCP em 30-50% em sites com imagens grandes no hero.

Para sites WordPress, plugins como Imagify ou ShortPixel convertem imagens automaticamente para WebP. Para sites em Astro ou Next.js, a otimização pode ser configurada no próprio framework.

INP: o que acontece quando o usuário clica e nada responde

O INP substituiu o FID (First Input Delay) em março de 2024 e é mais abrangente: mede a latência de todas as interações ao longo da visita, não só a primeira.

Se um usuário clica num botão de menu, expande um FAQ ou envia um formulário e o site demora 500ms para reagir, o INP está ruim — mesmo que o site carregue rápido no início.

Causas comuns de INP alto:

  • JavaScript pesado rodando na thread principal enquanto o usuário tenta interagir
  • Event listeners mal otimizados executando muito trabalho síncrono
  • Third-party scripts (chat, analytics, pixels de remarketing) consumindo CPU sem controle
  • Renderizações desnecessárias em frameworks JavaScript reativos

O INP é geralmente o mais difícil dos três para corrigir porque exige análise de performance do JavaScript — mas ferramentas como o Chrome DevTools Performance profiler tornam o diagnóstico acessível mesmo sem ser especialista.

CLS: quando o botão muda de lugar enquanto você vai clicar

CLS mede deslocamentos de layout inesperados. O caso clássico: você vai clicar num link e um banner aparece acima, empurrando tudo para baixo — você clica no link errado.

Além de ser frustrante, o CLS alto tem um custo mensurável: segundo dados do Google, reduzir o CLS de "ruim" para "bom" pode diminuir a taxa de abandono em até 24%.

Causas mais frequentes:

  1. Imagens sem width e height definidos — o navegador não reserva espaço antes de carregar
  2. Ads e iframes sem dimensões fixas — aparecem e empurram o conteúdo abaixo
  3. Fontes web causando FOUT (Flash of Unstyled Text) — o texto muda de tamanho quando a fonte carrega
  4. Conteúdo injetado dinamicamente acima do conteúdo existente (banners de cookies, notificações)

A correção mais simples: defina width e height em todas as imagens. Isso custa nada e elimina a causa mais comum de CLS alto.

Como medir seus Core Web Vitals

Existem dois tipos de dados: de laboratório e de campo.

Dados de laboratório (simulados):

  • PageSpeed Insights — ferramenta oficial do Google, gratuita
  • Lighthouse no Chrome DevTools — análise local detalhada
  • WebPageTest — diagnóstico avançado com waterfall de carregamento

Dados de campo (usuários reais):

  • Chrome UX Report (CrUX) — dados de usuários Chrome reais, disponível no PageSpeed Insights
  • Search Console → Relatório de Experiência na Página
  • Google Analytics 4 com Web Vitals integration

Dados de campo são o que o Google usa para rankeamento. Dados de laboratório são úteis para diagnóstico, mas um site pode passar no laboratório e falhar em campo (ou vice-versa) dependendo de scripts third-party e variações de rede.

O impacto real no rankeamento e nas conversões

O Google confirma que Core Web Vitals é um sinal de rankeamento desde 2021. Em buscas competitivas onde dois sites têm autoridade similar, a experiência do usuário vira desempate.

Mais importante que o ranking direto: sites com LCP ruim têm taxa de rejeição maior. Estudos do Google mostram que sites que carregam em 1 segundo convertem 3x mais que sites que carregam em 5 segundos. Para landing pages, onde a conversão é o único objetivo, essa diferença é ainda mais impactante.

Por que isso muda com a escolha de plataforma

A plataforma do seu site determina muito do que você pode controlar nos Core Web Vitals. Sites em Astro ou Next.js com renderização estática tendem a ter Core Web Vitals excelentes por padrão. Sites em WordPress com muitos plugins e pagebuilder pesado (Elementor, Divi, WPBakery) tendem a lutar com LCP e INP crônicos.

A escolha de plataforma para seu site afeta diretamente o que é possível alcançar em performance. Não é impossível ter um WordPress rápido — mas exige configuração cuidadosa que a maioria das instalações não tem.

O que priorizar primeiro

Se você está começando do zero com um site existente que precisa melhorar, esta é a ordem de impacto por esforço:

  1. Otimizar e converter imagens para WebP — maior impacto, trabalho moderado
  2. Definir width e height em todas as imagens — resolve a maior parte do CLS, trabalho baixo
  3. Mover scripts third-party para carregar após a página — melhora LCP e INP, trabalho moderado
  4. Configurar font-display: swap nas fontes web — elimina FOUT, trabalho baixo
  5. Revisar plugins e scripts que rodam na thread principal — melhora INP, trabalho alto

Para sites novos: tratar performance como requisito desde o wireframe custa infinitamente menos do que corrigir depois de publicado. Isso significa escolher tecnologias que geram HTML eficiente, otimizar imagens antes de subir, e testar performance a cada milestone do projeto.

Core Web Vitals não são métricas abstratas

São medidas diretas de como o seu site trata quem o visita — e o Google usa esses dados para decidir onde posicioná-lo. Mas independente do rankeamento, um site com Core Web Vitals bons é simplesmente melhor para usar.

Visitantes que têm uma boa experiência voltam. Visitantes que encontram frustração vão embora — e raramente contam por que.

Perguntas frequentes

Core Web Vitals afeta o rankeamento do site no Google? +

Sim. Desde 2021, o Google usa Core Web Vitals como sinal de rankeamento. O peso varia conforme a competitividade da busca, mas em resultados disputados, um site com métricas boas tem vantagem sobre outro com conteúdo similar mas experiência ruim.

Como verificar os Core Web Vitals do meu site? +

Use o PageSpeed Insights (pagespeed.web.dev) para uma análise rápida com dados reais e simulados. Para dados históricos de usuários reais, acesse o Google Search Console em Experiência → Core Web Vitals.

Qual Core Web Vital é mais fácil de melhorar? +

CLS geralmente é o mais rápido de corrigir: basta definir width e height em todas as imagens e evitar conteúdo que aparece dinamicamente acima do fold. LCP e INP exigem mais diagnóstico, mas otimizar imagens e mover scripts third-party para carregamento assíncrono já traz ganhos expressivos.

WordPress pode ter Core Web Vitals bons? +

Pode, mas exige esforço considerável. É preciso um tema leve, evitar pagebuilders pesados, usar cache de página, otimizar imagens e limitar plugins de terceiros. Sites em plataformas modernas como Astro chegam mais facilmente nos limites recomendados.

Core Web Vitals é o mesmo que velocidade de carregamento? +

Não exatamente. Velocidade de carregamento é um conceito amplo. Os Core Web Vitals medem aspectos específicos: LCP mede quando o conteúdo principal aparece, INP mede a resposta às interações e CLS mede a estabilidade visual.