A performance web deixou de ser um "detalhe técnico" para se tornar o fator que decide quem aparece primeiro no Google. Com a consolidação dos Core Web Vitals, o algoritmo do Google agora mede diretamente a experiência que você oferece aos visitantes. E na minha experiência, isso mudou completamente como construímos sites hoje.
Muitos focam apenas em "técnicas de SEO", mas esquecem que otimizar velocidade é, acima de tudo, criar uma boa experiência. Se seu site é lento, você está basicamente dizendo ao visitante: "seu tempo não importa". E o Google percebe isso.
Um site rápido não é apenas técnico - é sobre criar uma experiência agradável para quem visita
1. Entendendo os Core Web Vitals de verdade
O Google usa dados reais de navegação através do Chrome User Experience Report. Pelas diretrizes oficiais, não é só sobre "carregar rápido", mas sobre como o site se sente durante o uso.
LCP (Largest Contentful Paint) – Quando o conteúdo principal aparece
Basicamente, é quando o visitante vê aquela imagem grande no topo ou o título principal da página.
Uso o atributo fetchpriority="high" na imagem principal. É como dizer ao navegador: "Ei, carrega isso primeiro!". Funciona muito bem.
As pessoas otimizam tudo, mas esquecem da imagem hero. Já vi sites com ótimo código, mas uma imagem de 2MB no topo que arruína todo o LCP.
INP (Interaction to Next Paint) – Responsividade na prática
Desde 2024, isso substituiu o FID. Mede o tempo desde que você clica em algo até a resposta visual.
O problema geralmente está em scripts mal otimizados. Já encontrei menus "legais" com efeitos JavaScript que deixavam o site travado. Às vezes, simples é melhor.
Muitos plugins de WordPress adicionam scripts pesados que destroem o INP. Sempre teste cada plugin individualmente.
2. Infraestrutura: A base que ninguém vê, mas todo mundo sente
De nada adianta otimizar o front-end se o servidor é lento. O Time to First Byte (TTFB) ideal deve ser menor que 0,8s. Na minha experiência, isso começa na escolha certa da hospedagem.
Tecnologias que fazem diferença real
- HTTP/3 e QUIC: É o novo padrão. Reduz a "conversa inicial" entre navegador e servidor. Se sua hospedagem não oferece, está atrasada.
- Early Hints (Status 103): O servidor diz ao navegador "comece a carregar isso" antes mesmo de terminar de enviar a página. Parece mágica, funciona.
- Hospedagem para AdSense: Essa é importante: se seu blog usa anúncios, precisa de uma hospedagem que aguente scripts externos. Já analisei as melhores opções aqui.
A infraestrutura é como os alicerces de uma casa: você não vê, mas se for fraca, tudo desmorona
3. Imagens: O maior vilão (e maior oportunidade)
Formatos modernos que valem a pena
O AVIF é o novo queridinho. Na prática, vi economias de 30-40% comparado ao WebP. É significativo.
<picture>
<source srcset="hero.avif" type="image/avif">
<source srcset="hero.webp" type="image/webp">
<img
src="hero.jpg"
alt="Descrição acessível"
loading="lazy"
width="1200"
height="630"
>
</picture>
Minha rotina: Para blogs de clientes, uso ferramentas que convertem automaticamente para AVIF e WebP. Se você está começando, fique com WebP que já é excelente e mais compatível.
CSS: Menos é mais
Carregar CSS essencial direto no código funciona. Na prática, isso elimina uma requisição inicial. Para WordPress, alguns plugins específicos fazem isso automaticamente.
4. JavaScript: O necessário, apenas o necessário
JavaScript costuma ser o maior problema em dispositivos móveis. Não é raro ver sites onde 70% do tempo de carregamento é só processando JS.
O que realmente funciona (na minha experiência)
-
Adiar o desnecessário: Use
deferpara scripts que não são críticos. Analytics, por exemplo, não precisa carregar antes do conteúdo. - Fachadas para terceiros: Para widgets pesados (YouTube, Maps), carrego uma imagem estática primeiro. Só ativo o widget real se o usuário clicar. O Google até recomenda isso.
- Minha regra pessoal: Se um script não melhora diretamente a experiência do usuário na primeira visita, ele pode esperar.
5. Fontes: Bonitas, mas não a qualquer custo
Fontes de terceiros podem atrasar a renderização. Já vi sites esperando 2 segundos por uma fonte do Google Fonts enquanto o texto ficava invisível.
Problema comum
O maior erro é usar muitas variações de fonte (light, regular, medium, bold, italic...). Na maioria dos casos, 2 variações são suficientes: regular e bold.
Tipografia é importante, mas não deve custar a experiência do usuário
6. Checklist prático: O que fazer hoje mesmo
Baseado no que funcionou para meus clientes, aqui está um plano de ação:
Siga esta ordem de prioridade
Dica bônus: Comece pelo Google Search Console > Core Web Vitals. Ele mostra exatamente quais páginas têm problemas e quais métricas falham.
O que aprendi depois de otimizar centenas de sites
Velocidade não é um projeto que termina. É uma disciplina contínua. O que funciona hoje pode não funcionar amanhã - novos scripts são adicionados, imagens são carregadas, o conteúdo cresce.
Mas o mais importante que aprendi: não se trata apenas de SEO. Quando seu site carrega rápido, as pessoas ficam mais tempo, leem mais conteúdo, confiam mais na sua marca. É sobre respeito.
E se você está começando, não tente fazer tudo de uma vez. Escolha uma coisa da lista acima, implemente, veja o resultado. Depois passe para a próxima. Pequenas melhorias constantes > uma grande otimização uma vez por ano.
Henrique Machado
Especialista em Performance Web & SEO Técnico
Comecei como desenvolvedor front-end e fui percebendo como a performance afeta tudo - desde SEO até conversões. Hoje, trabalho ajudando blogs e e-commerces a não apenas ranquearem melhor, mas oferecerem experiências que fazem os visitantes voltarem.
Dúvidas sobre performance? Entre em contato