SEO e Organic Growth · Consolidado
CLS: Cumulative Layout Shift
Medida da estabilidade visual: quanto o conteúdo se desloca inesperadamente na tela.
Nesta página
O que é CLS?
CLS é a Core Web Vital que mede a estabilidade visual. Soma os deslocamentos inesperados de elementos durante a visita, como um botão que muda de lugar quando um anúncio carrega. Quanto menor, mais estável a página.
Por que é importante?
Deslocamentos fazem o usuário perder a leitura ou clicar no lugar errado, inclusive em botões de compra. Isso gera frustração e erros. O CLS é muitas vezes o mais simples de corrigir entre as Core Web Vitals.
Como calcular CLS?
Fórmula
CLS = maior soma de pontuações de deslocamento em uma janela de sessão (percentil 75 das visitas)
Cada deslocamento recebe uma pontuação que combina a área afetada e a distância percorrida. Os deslocamentos são agrupados em janelas, e o CLS é a maior janela. A referência oficial é bom até 0,1 e ruim acima de 0,25.
- Unidade
- Pontuação sem unidade (percentil 75)
- Leitura
- Quanto menor, melhor
Exemplo: Em um portal, banners carregam sem espaço reservado e empurram o texto para baixo. O CLS de campo é 0,28, considerado ruim.
Como interpretar?
- Quando aumenta
- A página ficou mais instável.
- Quando diminui
- A página ficou mais estável.
- Contexto e cuidados
- Deslocamentos causados por ação do usuário, logo após um clique, não contam. Anúncios, imagens sem dimensões e fontes que trocam de tamanho são causas comuns.
Onde utilizar?
Consolidado: Definição estável e usada da mesma forma pelo mercado e pelas plataformas.
Quem acompanha?
| Nível | Aplicação | O que faz com o indicador |
|---|---|---|
| Analista Pleno | Opera | Configura, acompanha e ajusta o indicador no dia a dia. |
| Analista Sênior | Analisa | Investiga variações, cruza dados e recomenda mudanças. |
| Coordenador | Influencia | Usa o indicador para orientar decisões e prioridades de outras áreas. |
A lista indica onde o indicador costuma ser mais relevante. Qualquer profissional pode consultá-lo.
Como otimizar?
- Defina largura e altura de imagens e vídeos.
- Reserve espaço para anúncios, banners e incorporações.
- Evite inserir conteúdo acima do que já está na tela.
- Carregue fontes de forma que a troca não altere o tamanho do texto.
Erros comuns
- Testar só a primeira tela e ignorar deslocamentos durante a rolagem.
- Inserir avisos e banners no topo depois que a página carrega.
- Achar que CLS é tempo, quando é uma pontuação.
Como este indicador se conecta a outros KPIs
Um botão que se move pode receber cliques errados e gerar frustração. A melhora na conversão após corrigir o CLS depende de onde estavam os deslocamentos.
As relações mostram como um número entra na conta do outro, sob as premissas descritas. Não são causas automáticas: mudanças de público, oferta e medição alteram o resultado.
Indicadores relacionados
Perguntas frequentes sobre CLS
Qual é um bom CLS?
Segundo o Google, até 0,1 no percentil 75 das visitas. Entre 0,1 e 0,25 precisa de melhoria, e acima de 0,25 é ruim.
Deslocamentos causados pelo usuário contam?
Não, se acontecerem logo após a interação, como abrir um menu. A métrica considera só os inesperados.
Como achar o que causa o CLS?
Ferramentas como PageSpeed Insights e o painel de desempenho do navegador mostram os elementos que se deslocaram.