Site lento perde usuário, perde conversão e perde ranking no Google. Essa combinação faz da velocidade uma das prioridades de investimento técnico mais justificáveis para qualquer empresa que depende de resultados online.

Este guia apresenta o processo completo de diagnóstico e otimização de velocidade, com foco nas áreas que mais impactam a experiência real do usuário.

Como medir velocidade de site corretamente

Antes de otimizar, meça. Ferramentas certas:

PageSpeed Insights (pagespeed.web.dev): usa dados reais de usuários do Chrome (CrUX) combinados com análise sintética do Lighthouse. Use para ver LCP, INP e CLS reais.

WebPageTest (webpagetest.org): teste mais detalhado com waterfall, filmstrip e análise de recursos individuais. Útil para diagnóstico aprofundado.

Chrome DevTools > Performance: para análise local em desenvolvimento, antes de publicar.

Google Search Console > Core Web Vitals: dados reais de todos os usuários do seu site ao longo do tempo. O mais importante para SEO.

Sempre meça no mobile em conexão lenta - é como a maioria dos usuários no Brasil acessa.

As 3 métricas que o Google usa para ranking

LCP - Largest Contentful Paint

Tempo até o maior elemento visível carregar. Meta: abaixo de 2,5s.

O LCP é quase sempre:

  • Imagem hero (banner principal da home)
  • Imagem de produto em página de e-commerce
  • Texto grande em primeiro plano

INP - Interaction to Next Paint

Tempo de resposta a interações do usuário (cliques, toques, digitação). Meta: abaixo de 200ms.

Problemas de INP geralmente vêm de:

  • JavaScript pesado bloqueando a thread principal
  • Event handlers ineficientes
  • Renderizações desnecessárias no React/Vue

CLS - Cumulative Layout Shift

Quanto o layout se move durante o carregamento. Meta: abaixo de 0,1.

Causas comuns de CLS alto:

  • Imagens sem dimensões definidas
  • Anúncios que aparecem empurrando conteúdo
  • Fontes customizadas trocando o fallback
  • Elementos injetados dinamicamente acima do conteúdo visível

Veja os guias individuais: melhorar LCP, melhorar INP, reduzir CLS.

Área 1: Imagens (maior impacto na maioria dos sites)

Imagens representam 60-80% do peso total da maioria das páginas. Otimizar imagens é sempre o primeiro passo.

Ações prioritárias:

  1. Converter para WebP ou AVIF

    • WebP: 30-50% menor que JPEG com qualidade equivalente
    • AVIF: ainda menor, mas suporte mais limitado em navegadores antigos
    • Use <picture> com fallback para JPEG/PNG

  2. Dimensionar corretamente

    • Não servir imagem 2000px para exibir em 400px
    • Use atributo srcset para servir tamanho correto por breakpoint

  3. Lazy loading em imagens fora da viewport

    • loading="lazy" em todas as imagens abaixo do fold
    • Nunca use lazy loading na imagem hero (LCP sofre)

  4. Definir width e height em todas as imagens

    • Evita CLS causado por images sem dimensões definidas

Veja o guia completo de otimização de imagens.

Área 2: JavaScript (impacto em INP e LCP)

JavaScript bloqueia parsing e renderização. Quanto mais JS, mais lento fica.

Ações prioritárias:

  1. Auditoria de bundle

    • Identifique scripts grandes desnecessários no <head>
    • Use Coverage no Chrome DevTools para ver JS não usado

  2. Defer e async estratégicos

    • Scripts não críticos: <script defer>
    • Scripts de terceiros (analytics, chat, pixels): carregar após load event

  3. Remover plugins e scripts desnecessários

    • Cada plugin do WordPress adiciona JS ao site
    • Slider, popup, compartilhamento social - cada um tem custo

  4. Code splitting em SPAs

    • React, Vue, Angular: carregue apenas o JS necessário para a rota atual

Veja otimização de JavaScript.

Área 3: Cache e CDN

Cache evita que o servidor processe e entregue os mesmos recursos múltiplas vezes. CDN entrega recursos a partir de servidores geograficamente próximos do usuário.

Cache HTTP:

  • Recursos estáticos (CSS, JS, imagens): Cache-Control: max-age=31536000, immutable
  • HTML: Cache-Control: no-cache (ou curto, como 5-60 minutos)
  • Use hash de arquivo no nome para invalidar cache após atualização

CDN:

  • Cloudflare (gratuito para maioria dos casos)
  • Reduz TTFB, distribui carga, protege contra DDoS
  • Para sites WordPress: Cloudflare + WP Rocket ou W3 Total Cache

Veja CDN e cache para sites.

Área 4: Servidor e hospedagem

Mesmo o melhor código não compensa um servidor lento. Indicadores de problema:

  • TTFB acima de 600ms: servidor muito lento ou longe geograficamente do usuário
  • PHP 7.x ou inferior: versão antiga é mais lenta e sem suporte de segurança
  • Hosting compartilhado sobrecarregado: você sofre com o tráfego dos vizinhos

Ações:

  • Servidor em data center no Brasil (preferencialmente São Paulo)
  • PHP 8.2+
  • HTTP/2 ou HTTP/3 habilitado
  • Compressão Gzip ou Brotli ativa

Área 5: Fontes customizadas

Fontes do Google Fonts ou Typekit podem adicionar 300-600ms de tempo de carregamento se não forem tratadas.

Boas práticas:

  • font-display: swap para mostrar texto enquanto a fonte carrega
  • Self-hosting: hospedar fontes no próprio servidor elimina round-trip externo
  • Limitar variantes: cada peso e estilo é um arquivo separado. Não carregue fontes que não usa

Processo de otimização: por onde começar

  1. Medir com PageSpeed Insights e anotar LCP, INP, CLS
  2. Resolver imagens (geralmente maior ganho rápido)
  3. Resolver JavaScript (second biggest bang for buck)
  4. Configurar cache e CDN
  5. Verificar servidor (TTFB)
  6. Resolver fontes
  7. Medir novamente e comparar
Performance

Site lento? Resolvemos com diagnóstico técnico real

Auditamos seu site, identificamos os gargalos reais e executamos as otimizações - com antes e depois documentado.

Solicitar auditoria de velocidade

FAQ

Qual pontuação no PageSpeed é considerada boa?

No PageSpeed Insights: acima de 90 é bom, 50-89 é regular, abaixo de 50 é problemático. Mas pontuação é indicador, não objetivo. O que importa são as métricas reais: LCP < 2,5s, INP < 200ms, CLS < 0,1.

WordPress pode ser rápido?

Sim, mas requer mais trabalho. WordPress com tema pesado, muitos plugins e sem cache pode ter LCP de 6-8s. Com otimização adequada (cache, CDN, tema leve, imagens otimizadas), sites WordPress chegam facilmente a LCP abaixo de 2s.

Quanto tempo leva uma otimização de velocidade?

Para ganhos rápidos (imagens, cache básico): 1-2 dias. Para otimização completa que inclui revisão de código, arquitetura de cache avançada e ajuste de servidor: 1-3 semanas dependendo da complexidade.

A velocidade do site afeta diretamente o ranqueamento no Google?

Sim. Core Web Vitals (LCP, INP, CLS) são sinais de ranqueamento confirmados pelo Google desde 2021. Sites que atendem os critérios “Bom” para as 3 métricas têm vantagem sobre sites que não atendem, em condições de conteúdo equivalente.