Core Web Vitals: o que são e como melhorar seu site
Core Web Vitals são três métricas do Google que avaliam a experiência real de quem visita um site. Elas medem a velocidade de carregamento, a resposta a cliques e toques e a estabilidade visual da página. Para melhorar os resultados, é preciso medir com dados reais, encontrar o gargalo de cada métrica e corrigir a causa técnica.
Pontos principais sobre Core Web Vitals
- As Core Web Vitals são três métricas: LCP, INP e CLS.
- As metas são LCP de até 2,5 segundos, INP abaixo de 200 milissegundos e CLS abaixo de 0,1.
- A avaliação considera o 75º percentil das visitas, separado entre celular e computador.
- Dados de campo mostram a experiência real, e testes de laboratório ajudam no diagnóstico.
- Bons resultados melhoram o site, mas não garantem posição no Google.
O que são as Core Web Vitals?
As Core Web Vitals são o conjunto principal de métricas da iniciativa Web Vitals, criada pelo Google. O objetivo é resumir a qualidade da experiência em poucos indicadores. Assim, gestores e desenvolvedores conseguem priorizar o que realmente afeta o visitante.
Cada métrica representa uma parte diferente da experiência de quem acessa a página. O LCP (Largest Contentful Paint, ou maior exibição de conteúdo) mede o carregamento. O INP (Interaction to Next Paint, ou interação até a próxima exibição) mede a rapidez de resposta. O CLS (Cumulative Layout Shift, ou mudança cumulativa de layout) mede a estabilidade visual.
O conjunto de métricas pode mudar com o tempo, à medida que o Google aprimora a forma de medir a experiência. Segundo o guia Web Vitals publicado no web.dev, o INP substituiu a antiga métrica FID (First Input Delay) em 2024. Por isso, relatórios e tutoriais antigos podem citar indicadores que não fazem mais parte do conjunto principal.
Quais são as metas de LCP, INP e CLS?
As metas indicam o limite de uma experiência considerada boa. A tabela a seguir resume o que cada métrica mede e quais problemas costumam afetá-la.
| Métrica | O que mede | Meta | Causas frequentes |
|---|---|---|---|
| LCP | Carregamento do maior conteúdo visível | Até 2,5 segundos | Servidor lento e imagem principal pesada. |
| INP | Tempo de resposta a cliques, toques e teclas | Abaixo de 200 milissegundos | JavaScript excessivo, tarefas longas e scripts de terceiros que ocupam o navegador. |
| CLS | Deslocamentos inesperados do layout durante a leitura | Abaixo de 0,1 | Imagens sem dimensões, banners inseridos depois do carregamento e troca de fontes. |
O web.dev recomenda avaliar essas metas no 75º percentil dos carregamentos de página. Na prática, pelo menos 75% das visitas precisam atingir o limite. A análise deve separar celulares e computadores, porque os resultados costumam variar entre esses dispositivos.
Como medir as Core Web Vitals do seu site?
A medição mais confiável usa dados de campo, coletados de usuários reais. Testes de laboratório complementam essa visão e ajudam a encontrar a causa de um problema. As principais ferramentas gratuitas do Google cumprem papéis diferentes nesse processo.
- Relatório Core Web Vitals do Google Search Console: agrupa URLs com desempenho semelhante, com base em dados reais.
- PageSpeed Insights: mostra dados de campo, quando disponíveis, e um diagnóstico de laboratório.
- Chrome DevTools: permite analisar o carregamento e as interações durante o desenvolvimento.
- Lighthouse: simula o carregamento, mas não mede o INP, porque não há interação real.
No Lighthouse, a métrica TBT (Total Blocking Time, ou tempo total de bloqueio) serve como indicador aproximado do INP. Páginas com pouco tráfego podem não ter dados de campo suficientes nessas ferramentas. A documentação do Google Search Central sobre Core Web Vitals reúne os guias oficiais de medição e otimização.
Como melhorar cada métrica na prática?
Cada métrica tem causas próprias e exige um tipo diferente de investigação técnica. Por isso, a correção começa pelo diagnóstico da página com pior resultado, e não por uma lista genérica de ajustes.
Como melhorar o LCP
O LCP depende do servidor, do tamanho do elemento principal e da ordem de carregamento. Em muitos sites, esse elemento é a imagem de destaque da primeira dobra.
- Comprima e redimensione a imagem principal, preferindo formatos como WebP ou AVIF.
- Não aplique carregamento tardio, o lazy loading, à imagem que aparece no topo.
- Reduza o tempo de resposta do servidor com cache e hospedagem adequada.
- Remova CSS e JavaScript que bloqueiam a exibição inicial sem necessidade.
Como melhorar o INP
O INP piora quando o navegador está ocupado executando código no momento da interação. Scripts de chat, pixels de publicidade e ferramentas de rastreamento podem somar tarefas longas.
- Remova bibliotecas, plugins e códigos que não são mais usados pelo site.
- Divida tarefas longas de JavaScript em partes menores, liberando o navegador para responder.
- Revise periodicamente os scripts instalados no Google Tag Manager.
- Carregue widgets de terceiros, como chats e mapas, apenas quando forem necessários.
Como reduzir o CLS
O CLS aumenta quando elementos mudam de lugar enquanto a pessoa lê ou tenta clicar. O problema costuma aparecer em avisos de cookies, anúncios e imagens sem dimensões declaradas.
- Defina largura e altura em imagens, vídeos e iframes.
- Reserve espaço fixo para banners, anúncios e incorporações antes de eles carregarem.
- Evite inserir conteúdo acima de um texto que já foi exibido.
- Configure o carregamento de fontes para reduzir mudanças bruscas no texto.
Exemplo hipotético: diagnóstico de uma landing page lenta
Considere uma landing page com LCP de 4 segundos no celular. O relatório de campo indica o problema, mas não explica a causa. Um diagnóstico organizado poderia seguir estas etapas:
- Confirmar no PageSpeed Insights qual elemento é o LCP da página.
- Verificar se esse elemento é uma imagem grande sem compressão.
- Checar se a imagem recebeu lazy loading por engano no código do tema.
- Medir o tempo de resposta do servidor na primeira requisição.
- Aplicar uma correção por vez e acompanhar os dados de campo nas semanas seguintes.
Esse método evita mudanças simultâneas que dificultam saber qual ajuste funcionou. Os dados de campo também levam tempo para refletir as melhorias, pois dependem de novas visitas.
As Core Web Vitals garantem uma boa posição no Google?
Não há essa garantia. O Google recomenda atingir boas métricas e afirma que isso se alinha ao que seus sistemas de classificação buscam recompensar. Mesmo assim, nenhuma métrica técnica substitui um conteúdo relevante para a pesquisa.
Uma página rápida com conteúdo fraco dificilmente atende à intenção do usuário. Por outro lado, uma página útil e lenta pode perder visitantes antes de mostrar seu valor. O melhor caminho combina conteúdo de qualidade, estrutura técnica sólida e boa experiência.
O que considerar antes de otimizar as Core Web Vitals
Comece pelas páginas que geram contato, orçamento ou venda. Depois, analise os dados de campo por dispositivo e trate uma métrica de cada vez. Registre cada alteração, com data e página afetada, para comparar os resultados com segurança.
Também vale investigar a origem dos problemas antes de escolher a correção. Em alguns casos, a solução é ajustar imagens e scripts. Em outros, o tema, o construtor visual ou a hospedagem limitam o desempenho do site.
A W3maker desenvolve sites institucionais, landing pages e lojas virtuais com foco em performance, responsividade e estrutura para SEO. Se o seu site precisa de uma avaliação técnica, conheça as soluções da W3maker e converse sobre o projeto.
