Core Web Vitals na Shopify: o que medem e o que você pode corrigir

Os Core Web Vitals na Shopify são medidos por três números que o Google coleta de visitantes reais: LCP para a rapidez com que o maior elemento visível aparece, INP para a rapidez com que a página responde a um toque e CLS para a estabilidade do layout durante o carregamento. Nas lojas Shopify, a maioria dos problemas vem de imagens de destaque não otimizadas, apps que injetam scripts em todas as páginas e elementos que pulam durante o carregamento. Este guia explica o que as métricas significam para uma loja, como medi-las corretamente, as correções que realmente movem os números e o que você não pode mudar na Shopify.

O que são os Core Web Vitals e por que importam para uma loja

Os Core Web Vitals são as métricas do Google para a experiência real na página, não uma pontuação técnica abstrata. Cada uma tem um limite bom documentado:

Métrica	O que mede	Bom	Precisa melhorar	Ruim
LCP (Largest Contentful Paint)	Tempo até o maior elemento visível aparecer (geralmente a imagem de destaque ou do produto)	até 2,5 s	2,5 a 4 s	acima de 4 s
INP (Interaction to Next Paint)	Atraso entre o toque do usuário e a resposta visual	até 200 ms	200 a 500 ms	acima de 500 ms
CLS (Cumulative Layout Shift)	Quanto os elementos pulam durante o carregamento	até 0,1	0,1 a 0,25	acima de 0,25

Por que uma loja se importa? Os clientes do Golfo navegam principalmente no celular, em redes variáveis, e se a imagem do produto demora ou o botão de adicionar ao carrinho pula no momento do toque, o resultado é um pedido perdido. O Google usa essas métricas como sinal de ranking dentro da experiência na página, mas o efeito delas na taxa de conversão é maior e mais rápido do que o efeito no ranking.

Medir corretamente: dados de campo versus testes de laboratório

Existem duas fontes diferentes, e confundi-las causa a maioria das discussões sobre velocidade:

O relatório Core Web Vitals no Search Console: baseado em dados de usuários reais (o Chrome User Experience Report) ao longo de 28 dias, agrupados por tipo de página. É isso que o Google usa e a referência pela qual você deve julgar sua loja. A configuração do Search Console em si está em Google Search Console para lojas Shopify.

Lighthouse e PageSpeed Insights: um teste de laboratório de uma página em um ambiente simulado. Útil para diagnóstico, porque diz o que deixa a página lenta, mas a pontuação de 0 a 100 não é o que o Google vê para o ranking, e ela muda a cada execução.

A regra: julgue com o Search Console, diagnostique com o Lighthouse. E não corra atrás de um 100 no Lighthouse; muitas lojas de sucesso rodam com pontuações de laboratório medianas e bons dados de campo.

Por que o LCP falha nas lojas Shopify e como corrigir

O LCP é a métrica que mais falha. Nas lojas, o maior elemento costuma ser a imagem de destaque na página inicial ou a primeira imagem do produto. Correções em ordem de impacto:

1. Tamanho e formato da imagem: suba imagens de destaque em dimensões adequadas ao celular e deixe a Shopify servir formatos modernos pelos parâmetros de imagem do tema. Uma imagem de destaque de 3 MB é a primeira coisa que encontramos em qualquer auditoria.
2. Lazy loading no lugar errado: a imagem de destaque não deve ter carregamento preguiçoso; o oposto vale para imagens abaixo da dobra. Alguns temas aplicam lazy loading em tudo.
3. Um slider no topo da página: várias imagens mais um script de animação atrasam o maior elemento. Uma imagem estática com texto claro geralmente converte melhor e aparece mais rápido.
4. Fontes: fontes árabes personalizadas pesadas atrasam o texto. Use uma ou duas fontes e faça o pré-carregamento delas.
5. Scripts que bloqueiam a renderização: apps que injetam scripts no head antes do conteúdo. Isso merece um artigo próprio: apps Shopify que deixam sua loja lenta.

INP: por que os toques respondem com atraso

O INP substituiu o FID em 2024 e mede todas as interações, não só a primeira. Nas lojas, o atraso aparece ao abrir o menu, trocar a variante de um produto ou tocar em adicionar ao carrinho. Causas comuns:

• Muitos apps rodando em segundo plano (avaliações, pop-ups, chat, vários rastreadores) disputando a thread principal do navegador.
• Scripts pesados do tema para efeitos visuais.
• Pixels de rastreamento duplicados (um do canal oficial e outro colado manualmente).

A correção começa com um inventário de apps: remova o que a loja não usa e confirme que os apps removidos não deixaram código no tema. Depois revise o rastreamento para que nada dispare duas vezes.

CLS: os elementos que pulam

O CLS acontece quando o conteúdo é empurrado durante o carregamento: uma barra de anúncio que aparece acima da página, imagens sem dimensões definidas, um selo de avaliações injetado depois do carregamento ou uma fonte que troca depois que o texto aparece. Correções:

• Defina largura e altura para cada imagem no tema para que o navegador reserve o espaço.
• Reserve uma altura fixa para barras de anúncio e elementos dinâmicos, como avaliações e contadores regressivos.
• Evite pop-ups que empurram o conteúdo em vez de flutuar sobre ele.
• Configure as fontes para que o tamanho do texto não mude depois do carregamento.

O que você não pode mudar na Shopify

Parte de ser honesto com um lojista é deixar claros os limites:

• Infraestrutura e CDN: a Shopify os gerencia globalmente; você não controla os servidores.
• Checkout: otimizado e bloqueado na maioria dos planos. Não perca tempo medindo-o.
• Scripts centrais da Shopify: carregados em todas as lojas e impossíveis de remover.
• Uma pontuação perfeita no Lighthouse: irrealista com os apps de avaliações, chat e rastreamento que uma loja realmente precisa.

O que você controla é o tema, as imagens, os apps e as fontes, e isso basta para levar a maioria das lojas de ruim para bom. O guia mais amplo é otimização de velocidade na Shopify.

Um plano de ação de uma semana

Dia	Tarefa
1	Abra o relatório Core Web Vitals no Search Console e identifique os grupos de páginas ruins no mobile
2	Rode o Lighthouse em uma página por grupo e anote o maior elemento e os scripts bloqueantes
3	Recomprima e suba de novo as imagens de destaque e as primeiras imagens de produto
4	Inventário de apps: remova apps não usados e limpe código residual no tema
5	Defina dimensões de imagem e reserve espaço para elementos dinâmicos
6	Revise o rastreamento: um pixel por plataforma, sem duplicatas
7	Meça de novo e registre a taxa de conversão mobile como linha de base para comparar depois de 28 dias

Da nossa experiência

Na Xmart, uma loja de eletrônicos na Jordânia com milhares de produtos, fizemos uma auditoria de desempenho do tema Xtra e correções de velocidade como parte da gestão da conta, porque anúncios de alto retorno perdem valor quando o cliente cai em uma página lenta. Ali, a velocidade não foi um projeto separado, mas parte da proteção do retorno dos anúncios e da conversão mobile. Os detalhes estão no estudo de caso Xmart. Em toda auditoria de conversão que fazemos pelo nosso serviço de otimização de taxa de conversão, a velocidade mobile é um item fixo ao lado da página de produto, do carrinho e do checkout.

Conclusão

Os Core Web Vitals na Shopify não são uma corrida por uma pontuação de 100, e sim três números vindos de usuários reais: LCP, INP e CLS. Corrija as imagens de destaque, reduza os apps, reserve espaço para elementos dinâmicos, limpe o rastreamento e depois meça o efeito na taxa de conversão mobile no Search Console após 28 dias. Isso completa o lado de experiência na página do guia completo de SEO para Shopify.

Envie o link da sua loja pelo WhatsApp e nós mandamos uma leitura do seu relatório de Core Web Vitals com as três primeiras correções que valem seu tempo.