Core Web Vitals 2025: o que mudou, o que vem por aí e como seu site deve se preparar

O que são Core Web Vitals e por que continuam sendo relevantes em 2025

Os Core Web Vitals são o conjunto de métricas de experiência do usuário que o Google usa como sinal de ranqueamento dentro do grupo de fatores conhecidos como 'Page Experience'. Introduzidos como fator de ranqueamento em 2021, os CWV se tornaram um dos pilares técnicos do SEO moderno — e continuam evoluindo.

A lógica por trás deles é simples e poderosa: o Google quer ranquear páginas que oferecem boa experiência ao usuário, não apenas páginas com bom conteúdo. Uma página que carrega lentamente, que pula e move o conteúdo enquanto carrega, ou que demora muito para responder às interações do usuário, prejudica a experiência — e o Google penaliza isso, ainda que sutilmente, no ranqueamento.

Em 2025, os Core Web Vitals são compostos por três métricas principais: LCP (Largest Contentful Paint), INP (Interaction to Next Paint) e CLS (Cumulative Layout Shift). Cada uma mede um aspecto diferente da experiência do usuário — e entender o que cada uma representa é o primeiro passo para otimizar.

LCP — Largest Contentful Paint: a métrica de carregamento percebido

O LCP mede o tempo até que o maior elemento de conteúdo visível na viewport seja renderizado — geralmente uma imagem hero, um vídeo, ou um bloco de texto grande. É a métrica que mais se aproxima da percepção humana de 'o site carregou'.

Thresholds do LCP:

• Bom: até 2,5 segundos
• Precisa melhorar: 2,5 a 4 segundos
• Ruim: acima de 4 segundos

Principais causas de LCP lento:

• Imagens grandes não otimizadas (formato JPEG/PNG sem conversão para WebP ou AVIF)
• Servidor lento (alto TTFB — Time to First Byte)
• Recursos bloqueadores de renderização (JavaScript e CSS que bloqueiam o parse do HTML antes de renderizar o conteúdo)
• Imagens de hero sem atributo fetchpriority='high' — o browser não sabe que deve priorizar esse elemento
• Lazy loading aplicado incorretamente ao elemento de LCP

Otimizações prioritárias para LCP:

• Converter imagens para WebP ou AVIF — redução de 30-50% no tamanho sem perda visual perceptível
• Implementar fetchpriority='high' na imagem ou elemento de LCP
• Remover o atributo loading='lazy' do elemento acima da dobra
• Usar CDN para servir assets estáticos com latência reduzida
• Melhorar o TTFB com caching no servidor, infraestrutura adequada ou Edge computing

INP — Interaction to Next Paint: a nova métrica que substituiu o FID

Em março de 2024, o INP (Interaction to Next Paint) substituiu oficialmente o FID (First Input Delay) como métrica de responsividade nos Core Web Vitals. Essa mudança foi uma das mais significativas do programa desde sua criação.

Por que o FID foi substituído: O FID media apenas o atraso na primeira interação do usuário com a página. O problema é que a maioria das interações importantes acontece depois da primeira — e o FID não capturava isso. Um site podia ter FID perfeito mas ser lento ao responder a cliques em menus, formulários e botões após o carregamento inicial.

O que o INP mede: O INP avalia a latência de todas as interações que o usuário realiza na página durante a visita — cliques, toques, teclado. Ele registra o pior caso (percentil 98) para dar uma visão realista da responsividade geral da página.

Thresholds do INP:

• Bom: até 200 milissegundos
• Precisa melhorar: 200 a 500ms
• Ruim: acima de 500ms

Por que o INP é mais difícil de otimizar do que o FID:

• O INP é afetado por JavaScript pesado que bloqueia a main thread durante as interações
• Animações e transições complexas competem com a capacidade de resposta
• Frameworks JavaScript mal otimizados (React, Vue, Angular com hydration pesada) frequentemente têm INP alto
• Tarefas longas na main thread ('Long Tasks') são o principal culpado — qualquer task que dura mais de 50ms pode impactar o INP

Estratégias de otimização do INP:

• Usar scheduler.postTask() ou setTimeout(0) para dividir tarefas longas em micro-tarefas
• Mover código JavaScript pesado para Web Workers
• Adiar JavaScript não crítico para depois do carregamento inicial
• Usar content-visibility: auto para áreas fora da viewport
• Revisar e otimizar event handlers — callbacks de clique que executam muito código são causa frequente de INP alto

'O INP é a métrica de Core Web Vitals que mais exige atenção de desenvolvimento em 2025. Sites com JavaScript pesado — especialmente em frameworks modernos sem otimização adequada — frequentemente falham nessa métrica mesmo quando passam nas outras.' — Equipe Técnica da Trilion

CLS — Cumulative Layout Shift: a estabilidade visual que os usuários odeiam

O CLS mede quanto o layout da página se move inesperadamente enquanto o usuário a está visualizando. Aquele movimento irritante de texto que pula quando uma imagem ou anúncio carrega e empurra o conteúdo — isso é o que o CLS captura.

Thresholds do CLS:

• Bom: até 0,1
• Precisa melhorar: 0,1 a 0,25
• Ruim: acima de 0,25

Causas mais comuns de CLS alto:

• Imagens sem atributos de dimensão (width e height) — o browser não reserva o espaço antes do carregamento
• Anúncios (Google Ads, banners) sem dimensões fixas reservadas
• Fontes web que causam FOUT (Flash of Unstyled Text) ou FOIT (Flash of Invisible Text)
• Elementos injetados dinamicamente por JavaScript (pop-ups, banners de cookies, widgets) sem espaço reservado
• Animações de entrada de elementos que deslocam o conteúdo

Correções para CLS:

• Sempre defina width e height em todas as imagens — o CSS pode sobrescrever, mas o atributo garante que o browser reserva o espaço.
• Use aspect-ratio em CSS para containers de imagem responsivos.
• Para anúncios, reserve o espaço com um placeholder do tamanho padrão do banner.
• Use font-display: optional ou font-display: swap com fallback de tamanho similar para minimizar o layout shift de fontes.

O que vem por aí: métricas candidatas e evolução dos CWV

O Google tem um processo de evolução dos Core Web Vitals — novas métricas ficam em fase de 'candidata' por meses antes de serem integradas ao programa oficial. Em 2025, as métricas que estão em discussão ativa:

Smooth Animations: Avaliação da fluidez de animações e transições — especialmente relevante para experiências premium com microinterações. Ainda não confirmada como CWV oficial.

Time to First Byte (TTFB) e First Contentful Paint (FCP): Embora não sejam Core Web Vitals oficiais, essas métricas são amplamente usadas no relatório de Page Experience do Search Console e tendem a ser consideradas para integração futura.

Soft navigations: O Google tem trabalhado em métricas para aplicações SPA (Single Page Application) onde as 'navegações' são virtuais e não recarregam a página. Os CWV atuais foram projetados para navegação tradicional — as soft navigation metrics tentam resolver a lacuna para SPAs.

Ferramentas de monitoramento de Core Web Vitals

Monitorar Core Web Vitals corretamente exige entender a diferença entre dados de laboratório e dados de campo:

Dados de laboratório (Lab Data): Gerados por ferramentas em condições controladas — úteis para debug e otimização, mas não refletem a experiência real dos usuários.

• PageSpeed Insights: A ferramenta mais acessível — fornece dados de laboratório (via Lighthouse) e dados de campo (via CrUX) na mesma interface. Use o dado de campo como referência real.
• Google Lighthouse: Auditoria completa de performance — disponível no Chrome DevTools ou como CLI. Excelente para debug de otimizações específicas.
• WebPageTest: Análise avançada com waterfall detalhado — essencial para debug de LCP e diagnóstico de recursos bloqueadores.

Dados de campo (Field Data): Baseados em usuários reais — o que o Google efetivamente usa para ranqueamento.

• CrUX (Chrome User Experience Report): O banco de dados do Google com dados reais de performance de bilhões de URLs — acessível via API e integrado ao PageSpeed Insights e Search Console.
• Google Search Console (relatório Core Web Vitals): Mostra quais URLs do seu site estão com problemas de CWV baseado em dados de campo reais. É o relatório mais importante para SEO — o Google usa esses dados, não os dados de laboratório.
• Google Analytics 4: Permite rastrear métricas de CWV por segmentos de usuário — dispositivo, página, localização geográfica.

Como priorizar otimizações por impacto no ranking

Nem toda otimização de CWV tem o mesmo impacto no ranqueamento. O processo de priorização mais eficiente:

1. Identifique as páginas mais importantes: Home, landing pages de serviço/produto, artigos de maior tráfego — priorize otimizar as páginas que mais impactam o negócio.
2. Veja o relatório do Search Console: As URLs classificadas como 'Ruim' no relatório de Core Web Vitals são a prioridade máxima — estão ativamente prejudicando o ranqueamento.
3. Identifique a métrica problema: Para cada URL com problemas, qual CWV está falhando? LCP, INP ou CLS? Cada um tem conjunto específico de causas e soluções.
4. Estime o impacto de cada correção: Uma otimização de LCP que move de 4s para 2s tem impacto muito maior do que uma que move de 2,8s para 2,4s (ambas 'passam', mas a primeira sai do 'Ruim' e a segunda apenas melhora o 'Precisa melhorar').
5. Corrija e monitore: Após cada otimização, aguarde algumas semanas para que o CrUX reflita os dados de campo atualizados antes de avaliar o impacto.

'Core Web Vitals são um fator de desempate poderoso no ranqueamento — quando dois sites têm conteúdo de qualidade similar, o que tem melhor experiência de usuário leva a posição superior. Para sites premium que competem por keywords disputadas, isso faz toda a diferença.' — Trilion, SEO Técnico

Core Web Vitals e sites premium: o equilíbrio entre visual e performance

Existe uma tensão real entre design premium — com imagens de alta resolução, animações sofisticadas, fontes customizadas e efeitos visuais elaborados — e as métricas de Core Web Vitals. Mas essa tensão não é intransponível.

Técnicas que permitem ter sites premium e bons CWV:

• Imagens de alta qualidade em WebP/AVIF com dimensões corretas e lazy loading para abaixo da dobra
• Animações que usam transform e opacity (processadas pela GPU) em vez de propriedades que causam reflow (margin, padding, width)
• Fontes customizadas com estratégia de fallback para evitar CLS de font swap
• JavaScript dividido em chunks com carregamento diferido para código não crítico

A Trilion desenvolve sites que combinam design premium com excelência técnica em Core Web Vitals — acreditamos que não há motivo para abrir mão de nenhum dos dois. Entre em contato com nossa equipe para uma auditoria de CWV do seu site atual e descubra quais otimizações têm maior impacto no seu ranqueamento.