Pular para o conteúdo
criarmeu.site

7 min de leitura

Core Web Vitals: o que são e como medir no seu site

Core Web Vitals sem tecniquês: o que LCP, INP e CLS medem, os limites que o Google considera bons e como testar o seu site no PageSpeed Insights.

Core Web Vitals são três métricas que o Google usa para medir a experiência real de quem visita o seu site: LCP, que mede quanto tempo o conteúdo principal leva para aparecer; INP, que mede se a página responde rápido quando a pessoa toca ou clica; e CLS, que mede se o layout fica parado enquanto carrega. Para ser considerado bom, segundo o web.dev, o site precisa de LCP de até 2,5 segundos, INP de até 200 milissegundos e CLS de até 0,1. Você mede tudo isso de graça no PageSpeed Insights.

Agora, a versão explicada para quem não é programador.

As três métricas em uma tabela

Métrica O que mede Bom Precisa melhorar Ruim
LCP Carregamento do conteúdo principal até 2,5 s entre 2,5 s e 4 s acima de 4 s
INP Resposta a toques e cliques até 200 ms entre 200 ms e 500 ms acima de 500 ms
CLS Estabilidade visual da página até 0,1 entre 0,1 e 0,25 acima de 0,25

Um detalhe importante: o Google não olha a média. Ele olha o percentil 75 das visitas reais, separando celular e computador. Na prática, isso quer dizer que pelo menos três de cada quatro visitas precisam ter uma boa experiência. Para passar na avaliação, a página precisa estar no “bom” nas três métricas.

LCP: quanto tempo o conteúdo principal leva para aparecer

LCP significa Largest Contentful Paint. É o momento em que o maior elemento visível da tela termina de carregar: normalmente a foto principal, um banner ou o bloco de título.

Para o visitante, é a resposta para a pergunta “já carregou?”. Se a foto de destaque demora, a sensação é de site lento, mesmo que o resto já esteja pronto.

O que costuma piorar o LCP:

  • Imagem principal pesada, sem compressão ou em tamanho maior que a tela
  • Servidor lento para responder, o que depende muito da qualidade da hospedagem
  • Arquivos de código e fontes que travam a exibição da página
  • Imagem de destaque configurada para carregar só depois do resto

INP: o site responde quando você toca?

INP significa Interaction to Next Paint. Ele mede o tempo entre uma interação (tocar em um botão, abrir o menu, selecionar uma opção) e a resposta visual da página.

Sabe quando você toca no menu e nada acontece, aí toca de novo e ele abre e fecha? Isso é INP ruim. No celular, onde o processador é mais modesto, o problema aparece mais.

Por que o FID saiu de cena

Até 2024, a métrica de interatividade era o FID (First Input Delay), que media só o atraso da primeira interação. Em 12 de março de 2024, o INP substituiu o FID como Core Web Vital. A diferença é que o INP considera as interações ao longo de toda a visita, não só a primeira. Se você ler algum material falando em FID, ele está desatualizado.

O que costuma piorar o INP:

  • Excesso de JavaScript, comum em temas prontos cheios de recursos
  • Scripts de terceiros: chats, pop-ups, rastreadores, widgets de redes sociais
  • Animações e efeitos pesados disparados a cada toque

CLS: a página fica parada enquanto carrega?

CLS significa Cumulative Layout Shift. Ele mede quanto o conteúdo “pula” de lugar enquanto a página carrega.

O exemplo clássico: você vai tocar em um link, uma imagem termina de carregar acima dele, o texto desce e você toca em outra coisa. Irritante no mínimo, e às vezes leva a pessoa para onde ela não queria.

O que costuma piorar o CLS:

  • Imagens e vídeos sem dimensões definidas no código
  • Fontes que, ao carregar, mudam o tamanho do texto
  • Anúncios, banners e widgets que aparecem empurrando o conteúdo
  • Avisos que surgem no topo da página depois que ela já apareceu

Como medir no PageSpeed Insights

O PageSpeed Insights é a ferramenta gratuita do Google para isso. O passo a passo:

  1. Acesse a ferramenta e cole o endereço da página que quer testar.
  2. Clique para analisar e espere alguns segundos.
  3. Veja primeiro o resultado para celular, que costuma ser o mais exigente, e depois o de computador.
  4. Confira a avaliação das Core Web Vitals no topo: ela indica se a página passou ou não.
  5. Role até o diagnóstico para ver o que está pesando.

Teste também páginas internas, não só a inicial. Uma página de serviço com uma galeria pesada pode estar bem pior que a home.

Dados de campo e dados de laboratório

O relatório tem duas partes, e entender a diferença evita muita confusão:

  • Dados de campo: vêm de usuários reais do Chrome, reunidos no relatório CrUX ao longo dos últimos 28 dias. É isso que conta para a avaliação das Core Web Vitals.
  • Dados de laboratório: vêm do Lighthouse, que simula uma visita em um ambiente controlado. Servem para diagnosticar problemas e gerar a nota de 0 a 100. A partir de 90 é considerado bom, de 50 a 89 precisa melhorar e abaixo de 50 é ruim.

É comum a nota de laboratório ser baixa e a avaliação de campo passar, ou o contrário. Quando há dados de campo, eles são a referência mais fiel do que seus visitantes vivem.

Quando aparecem “dados insuficientes”

Sites com pouco tráfego muitas vezes não têm visitas suficientes para gerar dados de campo da página. Nesse caso, o PageSpeed mostra os dados do site inteiro, quando existem. Se nem isso houver, você fica só com os dados de laboratório, que continuam úteis para encontrar os gargalos.

Se o seu site já está no Google Search Console, o relatório de Core Web Vitals de lá também agrupa as páginas com problemas parecidos.

Core Web Vitals contam para o Google?

Contam, mas com a dose certa de realismo. Segundo o Google Search Central, as Core Web Vitals são usadas pelos sistemas de classificação, mas não existe um sinal único que decide tudo. O próprio Google diz que sempre procura mostrar o conteúdo mais relevante, mesmo que a experiência da página não seja a ideal, e que resultados bons nos relatórios não garantem as primeiras posições.

Em outras palavras: uma página rápida não compensa um conteúdo fraco. Mas, entre conteúdos parecidos, a experiência pode fazer diferença. E, independentemente do Google, um site lento perde o cliente que já chegou. Se quiser entender o quadro completo, veja o que é SEO e como as peças se encaixam.

Para quem investe em anúncios, a conta fica ainda mais clara. Em uma landing page que recebe tráfego pago, cada visitante que desiste antes de a página carregar é um clique pago que não virou nada.

O que fazer se o seu site foi reprovado

Comece pelo diagnóstico do próprio PageSpeed, que aponta os itens com maior impacto. As correções mais comuns:

  • Otimizar e redimensionar imagens, principalmente a de destaque
  • Remover scripts e plugins que não são essenciais
  • Definir largura e altura de imagens e vídeos
  • Melhorar a hospedagem ou usar uma rede de distribuição de conteúdo

O post sobre como deixar o site mais rápido detalha várias dessas técnicas. Em sites construídos sobre temas muito pesados, porém, as correções têm limite. Nesse caso, a lentidão costuma vir junto com outros erros que afastam clientes do site, e reconstruir sai mais em conta do que remendar.

Quer um site que passa nas Core Web Vitals?

Na criarmeu.site, os sites são construídos do zero com código enxuto e imagens otimizadas, para carregar em menos de 2 segundos. Se o seu site atual foi reprovado no PageSpeed ou simplesmente parece lento, veja como funciona a renovação de site: o domínio continua o mesmo e no seu nome, redirecionamos as páginas antigas e só trocamos quando o novo estiver aprovado por você.

Leia também