Velocidade9 min de leitura
08

Velocidade

Imagens pesadas, scripts e o impacto de cada segundo a mais

Sua loja demora mais de 3 segundos para carregar no celular? Então 53% dos visitantes já foram embora antes de ver o primeiro produto. Não é opinião — é dado do Google.
"O site mais bonito do mundo não vale nada se o cliente nunca vê ele carregar."

— Regra dos 3 Segundos

Por que isso mata conversão

No Brasil, a maioria dos acessos é por dispositivos móveis em redes que não são tão rápidas quanto gostaríamos. 4G em muitas regiões é quase 3G. O site precisa carregar rápido em condições reais, não no Wi-Fi do escritório.

O Google mediu: a cada segundo adicional de carregamento, a taxa de rejeição aumenta 32%. De 1s para 5s, a probabilidade de abandono é de 90%.

Além disso, velocidade impacta SEO. O Google prioriza sites rápidos. Site lento = menos tráfego orgânico = mais dependência de mídia paga.

Probabilidade de Abandono por Tempo de Carregamento

Dados Google (referência)

1s2s3s5s7s10s0255075100% Abandono

O Princípio do Milissegundo Caro

Cada milissegundo de carregamento tem um custo direto em receita. Se sua loja fatura R$ 100k/mês e demora 5 segundos para carregar, otimizar para 2 segundos pode representar ganho significativo de conversão — estamos falando de milhares de reais por mês.

Como corrigir hoje

  1. 1Rode o PageSpeed Insights do Google (pagespeed.web.dev) no seu site agora. Anote a nota mobile.
  2. 2Comprima TODAS as imagens. Use formato WebP. Cada imagem de produto não precisa ter mais de 200KB.
  3. 3Defina width e height em todas as imagens (evita layout shift / CLS).
  4. 4Remova scripts e apps que você não usa. Cada app/script é peso. Seja cruel: se não gera receita, tire.
  5. 5Use lazy loading para imagens abaixo da dobra (que não estão visíveis na tela inicial).
  6. 6Minimize CSS e JavaScript. Se sua plataforma permite, ative compressão gzip/brotli.
  7. 7Meça o LCP (Largest Contentful Paint). O ideal é < 2.5 segundos. Se está acima, sua imagem hero ou banner é pesada demais.

Performance do Site

Site Lento
  • -Imagens em PNG, 2MB+ cada
  • -LCP: 6.2 segundos
  • -CLS: 0.35 (layout pula)
  • -15 scripts de terceiros
  • -PageSpeed: 28/100
Site Rápido
  • +Imagens em WebP, ~150KB cada
  • +LCP: 1.8 segundos
  • +CLS: 0.05 (estável)
  • +5 scripts essenciais
  • +PageSpeed: 85/100

Erro Comum: "Meu site abre rápido no meu computador"

Seu computador tem Wi-Fi rápido, cache do navegador e um processador potente. Seu cliente está no ônibus, com 4G fraco e um celular de R$ 800. Sempre teste no celular, em modo anônimo, com 4G regular (ou melhor: no modo "Slow 3G" do DevTools do Chrome).

Checklist: Site Rápido

0/8

Teste A/B Simples

Neste módulo, o teste não é A/B — é antes/depois. Otimize a velocidade e compare as métricas das 2 semanas anteriores com as 2 semanas posteriores. Meça: taxa de rejeição, tempo no site e taxa de conversão.

Mini-Quiz

1. Segundo o Google, qual é o tempo máximo ideal de carregamento no mobile?

2. Qual formato de imagem é mais eficiente para web?

Faça agora em 10 minutos

Abra pagespeed.web.dev e coloque o URL da sua loja. Anote a nota mobile. Depois, identifique a maior imagem da página inicial e comprima para WebP usando squoosh.app (gratuito).

Métrica para Acompanhar

PageSpeed Score (mobile), LCP, CLS e taxa de rejeição. Impacto esperado: cada segundo de melhoria no carregamento pode aumentar a conversão em 5% a 15%.

Resumo do Módulo

  1. 1Cada segundo de carregamento custa receita. Otimize para < 3 segundos no mobile.
  2. 2Imagens em WebP, lazy loading e remoção de scripts são as 3 ações de maior impacto.
  3. 3Sempre teste no celular com 4G real, não no Wi-Fi do escritório.

Próximos passos para aplicar na sua operação

Depois deste módulo, você pode avançar direto para as páginas principais da Performa.AI e conectar o aprendizado com implementação prática na sua loja.

Perguntas frequentes deste módulo

Use este bloco para revisar a decisão de implementação antes de seguir para o próximo módulo.

O que você aprende no módulo "Velocidade"?

Cada segundo a mais de carregamento custa dinheiro. Este conteúdo faz parte do curso Guia Rápido de Conversão e aprofunda imagens pesadas, scripts e o impacto de cada segundo a mais.

Como aplicar "Velocidade" na prática do e-commerce?

Abra pagespeed.web.dev e coloque o URL da sua loja. Anote a nota mobile. Depois, identifique a maior imagem da página inicial e comprima para WebP usando squoosh.app (gratuito).

Quanto tempo leva para implementar os ajustes deste módulo?

A leitura estimada é de 9 min. Com execução focada, você já consegue transformar os principais aprendizados em ação no mesmo dia.

Qual é o próximo passo depois deste módulo?

Depois de aplicar este módulo, avance para "Carrinho Mudo" em /masterclass/guia-rapido-conversao/modulo-09. Cada segundo de carregamento custa receita. Otimize para < 3 segundos no mobile.