Core Web Vitals são um conjunto de métricas definidas pelo Google para medir a qualidade da experiência do usuário em páginas web. Essas métricas avaliam velocidade de carregamento, interatividade e estabilidade visual, e são fatores de rankeamento confirmados desde 2021. Neste guia, você vai aprender o que cada métrica significa, como diagnosticá-las e quais otimizações implementar para melhorar tanto o SEO quanto a taxa de conversão do seu site.
Muitos gestores ainda tratam os Core Web Vitals como "coisas de desenvolvedor". Esse é um erro estratégico. A performance do site impacta diretamente métricas de negócio: taxa de rejeição, tempo na página, conversões e, consequentemente, receita. Estudos do Google mostram que sites que atendem aos limiares de Core Web Vitals têm 24% menos abandono de página.
Os Core Web Vitals são três métricas específicas que o Google considera essenciais para uma boa experiência do usuário. Diferente de outras métricas de performance, essas três são oficialmente fatores de rankeamento e aparecem no Google Search Console como indicadores de qualidade do seu site.
A importância dessas métricas vai além do SEO. Elas refletem a percepção real do usuário sobre a qualidade do seu site. Um site lento ou instável transmite falta de profissionalismo e reduz a confiança do visitante, especialmente em contextos B2B onde decisões de compra envolvem alto valor.
O LCP mede o tempo que leva para o maior elemento visível da página ser renderizado na tela. Geralmente, esse elemento é uma imagem hero, um vídeo ou um bloco de texto grande. O LCP é a métrica que mais se correlaciona com a percepção do usuário sobre "o site carregou".
Os limiares definidos pelo Google são:
- Bom: Até 2.5 segundos
- Precisa melhorar: Entre 2.5 e 4 segundos
- Ruim: Acima de 4 segundos
Para a maioria dos sites, o LCP é a métrica mais difícil de otimizar porque depende de múltiplos fatores: tempo de resposta do servidor, tamanho dos recursos, ordem de carregamento e capacidade de renderização do navegador.
O INP substituiu o FID (First Input Delay) em março de 2024 como métrica oficial de responsividade. Enquanto o FID media apenas a primeira interação, o INP avalia todas as interações do usuário durante toda a sessão, reportando a latência da pior interação (excluindo outliers).
Os limiares do INP são:
- Bom: Até 200 milissegundos
- Precisa melhorar: Entre 200 e 500 milissegundos
- Ruim: Acima de 500 milissegundos
Um INP ruim significa que o usuário clica em um botão e nada acontece por meio segundo ou mais. Essa latência é percebida como "travamento" e aumenta drasticamente a taxa de abandono, especialmente em formulários de contato e processos de checkout.
O CLS mede a quantidade de movimento inesperado de elementos na página durante o carregamento. Quando você está prestes a clicar em um botão e ele "pula" porque uma imagem carregou acima, isso é um layout shift. Além de frustrante, pode causar cliques acidentais em elementos errados.
Os limiares do CLS são:
- Bom: Até 0.1
- Precisa melhorar: Entre 0.1 e 0.25
- Ruim: Acima de 0.25
O CLS é geralmente a métrica mais fácil de corrigir, mas também a mais negligenciada. Causas comuns incluem imagens sem dimensões definidas, anúncios que carregam tardiamente e fontes web que causam FOUT (Flash of Unstyled Text).
Antes de otimizar, é essencial entender onde estão os problemas. Existem duas categorias de dados: dados de laboratório (sintéticos) e dados de campo (usuários reais). Ambos são importantes, mas o Google usa dados de campo para rankeamento.
Para uma análise completa, utilize estas ferramentas em conjunto:
- Google Search Console: Mostra dados de campo agregados e identifica páginas com problemas. É a fonte oficial para entender como o Google vê seu site.
- PageSpeed Insights: Combina dados de campo (CrUX) com análise de laboratório (Lighthouse), oferecendo tanto o diagnóstico quanto recomendações de correção.
- Chrome DevTools: Permite análise detalhada em tempo real, identificando exatamente quais elementos e scripts causam problemas.
- Web Vitals Extension: Extensão do Chrome que mostra as métricas em tempo real enquanto você navega.
A auditoria técnica da MarkSaint inclui análise completa de Core Web Vitals com recomendações priorizadas por impacto.
Cada métrica exige abordagens específicas de otimização. A seguir, as técnicas mais eficazes para cada uma delas.
O LCP é afetado por quatro fatores principais: tempo de resposta do servidor, bloqueio de renderização por recursos, tempo de carregamento de recursos e renderização no cliente. As otimizações mais eficazes são:
- Otimizar imagens: Converter para WebP/AVIF, definir dimensões explícitas, usar srcset para responsividade e implementar lazy loading para imagens abaixo da dobra.
- Preload de recursos críticos: Usar
<link rel="preload">para fontes, imagens hero e CSS crítico. - Otimizar TTFB: Implementar cache de servidor, usar CDN e otimizar queries de banco de dados.
- Eliminar render-blocking: Inline CSS crítico, defer JavaScript não essencial e remover CSS/JS não utilizados.
Em nossa experiência, a otimização de imagens sozinha pode melhorar o LCP em 40-60% na maioria dos sites.
O INP é principalmente afetado por JavaScript pesado que bloqueia a thread principal. As otimizações mais eficazes são:
- Quebrar long tasks: Dividir tarefas JavaScript longas (>50ms) em chunks menores usando
requestIdleCallbackouscheduler.yield(). - Reduzir JavaScript de terceiros: Auditar e remover scripts de analytics, chat e tracking desnecessários ou carregá-los de forma assíncrona.
- Otimizar event handlers: Usar debounce/throttle em handlers de scroll e resize, e evitar manipulação DOM excessiva.
- Code splitting: Carregar apenas o JavaScript necessário para cada página, não o bundle completo da aplicação.
Scripts de terceiros são frequentemente os maiores vilões do INP. Um único widget de chat pode adicionar 300ms de latência em interações.
O CLS é causado por elementos que mudam de posição após o carregamento inicial. As correções mais comuns são:
- Definir dimensões de imagens: Sempre incluir atributos width e height em tags
<img>ou usar aspect-ratio em CSS. - Reservar espaço para anúncios: Definir containers com altura mínima para slots de anúncio antes do carregamento.
- Evitar inserção dinâmica: Não inserir conteúdo acima de conteúdo existente, especialmente banners e notificações.
- Otimizar fontes web: Usar
font-display: swapcom fallback de fonte similar para evitar FOUT significativo.
A maioria dos problemas de CLS pode ser resolvida em poucas horas de trabalho técnico, com impacto imediato na experiência do usuário.
Para ilustrar o impacto real dessas otimizações, apresentamos um caso de um e-commerce B2B do setor de peças industriais que atendemos.
Aplique isso no seu negócio
Quer saber como implementar essas estratégias na prática? Nossa equipe analisa seu site gratuitamente e monta um plano de ação personalizado.
O site apresentava métricas críticas que impactavam diretamente as conversões:
- LCP: 4.5 segundos (ruim)
- INP: 380ms (ruim)
- CLS: 0.25 (ruim)
- Taxa de rejeição: 68%
- Taxa de conversão (solicitação de orçamento): 1.2%
O site carregava 4.2MB de recursos na homepage, incluindo 12 scripts de terceiros e imagens não otimizadas.
Durante 3 semanas, implementamos um conjunto de otimizações técnicas:
- Conversão de todas as imagens para WebP com compressão otimizada
- Implementação de lazy loading para imagens abaixo da dobra
- Remoção de 7 scripts de terceiros desnecessários
- Code splitting do JavaScript principal
- Implementação de CDN com cache agressivo
- CSS crítico inline e defer do restante
- Definição de dimensões explícitas em todas as imagens
O peso total da página foi reduzido de 4.2MB para 890KB.
Os resultados foram significativos tanto em métricas técnicas quanto em métricas de negócio:
- LCP: 1.2 segundos (melhoria de 73%)
- INP: 95ms (melhoria de 75%)
- CLS: 0.05 (melhoria de 80%)
- Taxa de rejeição: 42% (redução de 26 pontos percentuais)
- Taxa de conversão: 1.49% (aumento de 24%)
Com ticket médio de R$ 15.000 e aproximadamente 200 solicitações de orçamento por mês, o aumento de 24% na taxa de conversão representou um incremento potencial de R$ 720.000 em pipeline anual.
Sim, os Core Web Vitals são fatores de rankeamento confirmados pelo Google desde junho de 2021. Porém, eles são um fator entre muitos. Conteúdo relevante e backlinks ainda têm peso maior. A melhor forma de pensar é: Core Web Vitals são um "desempate" entre páginas com conteúdo similar.
Dados de laboratório (Lighthouse, PageSpeed Insights) são coletados em ambiente controlado e são úteis para diagnóstico. Dados de campo (CrUX, Search Console) são coletados de usuários reais e são o que o Google usa para rankeamento. Foque em melhorar os dados de campo.
O Google coleta dados de campo em janelas de 28 dias. Após implementar otimizações, pode levar de 28 a 56 dias para que as melhorias sejam refletidas no Search Console e potencialmente impactem o rankeamento.
Idealmente sim, mas qualquer melhoria ajuda. O Google avalia as métricas no nível de página e de origem (domínio). Se a maioria das suas páginas passa, você terá benefício mesmo que algumas páginas específicas falhem.
A otimização de Core Web Vitals é um investimento com retorno mensurável. Além do impacto em SEO, sites rápidos e estáveis convertem melhor, retêm usuários por mais tempo e transmitem profissionalismo.
Se seu site apresenta métricas ruins no Google Search Console, ou se você quer entender o impacto potencial de otimizações de performance na sua taxa de conversão, considere realizar uma auditoria técnica. A metodologia da MarkSaint inclui diagnóstico completo de Core Web Vitals com recomendações priorizadas por impacto e facilidade de implementação.
