Melhorar a velocidade do seu site aumentará a experiência do usuário, as conversões e as classificações.
E não para por aí: a otimização da velocidade do site é facilmente uma das tarefas técnicas que mais aumentam a receita que você pode realizar!
A melhor parte? É mais simples do que parece. Existem muitas práticas recomendadas, testadas e aprovadas e dezenas de ferramentas poderosas.
O que é velocidade do site?
A velocidade do site mede a rapidez com que os usuários podem carregar e interagir com seu site.
Vale dizer que o limite entre “velocidade da página” e “velocidade do site” não é definido e há muita sobreposição entre os dois.
Como a velocidade de cada página do seu site reflete geralmente as práticas de todo o site, otimizar para a velocidade da página é, na prática, o mesmo que otimizar para a velocidade do site, entende?
A principal diferença é que o monitoramento da velocidade do site envolve o monitoramento de uma amostra representativa de páginas para monitorar o desempenho de todo o site.
Você deve estar se perguntando se realmente vale a pena otimizar a velocidade se o seu site já tem um desempenho razoavelmente bom.
A resposta é um grandíssimo… SIM!
Uma pesquisa feita pela minha equipe descobriu uma correlação direta entre tempos de carregamento de página mais baixos e classificações orgânicas e taxas de conversão.
Isso também é corroborado por pesquisas de outras fontes.
Um estudo da Portent descobriu que sites com tempo de carregamento de um segundo convertem três vezes mais do que aqueles com tempo de carregamento de cinco segundos.
E uma pesquisa da NitroPack também mostra que um aumento no tempo de carregamento de dois para três segundos levou a um aumento de 50% nas rejeições de visitantes.
1. Entenda e use o PageSpeed Insights
O PageSpeed Insights é a ferramenta gratuita do Google para medir o desempenho de sites. O “Desempenho” avalia a velocidade de carregamento de uma página e a capacidade de resposta da página após o carregamento.
O Google combina três métricas principais, chamadas Core Web Vitals, para avaliar o desempenho:
- O Largest Contentful Paint (LCP) mede quanto tempo uma página leva para carregar completamente. O Google recomenda 2,5 segundos como mínimo.
- O Interaction To Next Paint (INP) avalia a rapidez com que uma página responde às interações do usuário, como abrir um menu ou um menu suspenso de perguntas frequentes. Menos de 200 milissegundos é o ideal.
- O Cumulative Layout Shift (CLS) analisa a estabilidade de uma página ao longo de seu ciclo de vida (ou seja, os elementos não se movem ou saltam). Não é uma métrica de velocidade em si, mas pode ter um efeito indireto nos tempos de carregamento da página.
Aqui está a avaliação do Core Web Vitals para NeilPatel.com:
A ferramenta PageSpeed Insights fornece um excelente ponto de partida para melhorar o desempenho e a velocidade do seu site.
Insira o URL da página e você verá sugestões para otimizar o desempenho na seção Diagnóstico.
Melhor ainda: cada um desses diagnósticos vem com uma classificação de prioridade e instruções específicas para corrigir problemas.
2. Complemente o PageSpeed Insights com outras ferramentas
O PageSpeed Insights é uma excelente solução. Mas complementá-lo com ferramentas adicionais oferece uma visão ainda mais completa das oportunidades de otimização.
Por exemplo, o Pingdom permite que você teste a velocidade da página de diferentes locais e abrange elementos técnicos adicionais, como detalhes de solicitação de arquivo.
Uma plataforma como o Ubersuggest fornece monitoramento contínuo com recursos regulares de auditoria em todo o site, como seu verificador de “longo tempo de carregamento”.
3. Comprimir imagens
Você provavelmente já se deparou com imagens de renderização lenta muitas vezes, especialmente ao usar uma conexão de internet fraca.
Imagens grandes e detalhadas demoram para carregar e contribuem significativamente para uma velocidade do site abaixo do ideal.
Siga estas práticas recomendadas ao enviar imagens para seu site:
- Compacte imagens com uma ferramenta como TinyPNG ou ImageOptim.
- Não faça imagens maiores do que o necessário.
- Use formatos de última geração, como WebP e AVIF.
- Configure o elemento <picture> para diferentes tamanhos de tela.
Se o seu site já hospeda muitas imagens não otimizadas, não se preocupe. Ferramentas como o TinyPNG oferecem plugins que auditam e atualizam todo o seu site automaticamente.
4. Compactar arquivos de texto
Além de imagens, a compactação de arquivos de texto CSS, JavaScript e HTML também reduz o tempo de carregamento das páginas.
A compactação reduz o tamanho da transferência sem alterar o conteúdo ou a qualidade do código. O navegador então descompacta os arquivos assim que os recebe.
Gzip e Brotli são as ferramentas de compactação de arquivos mais populares. O Brotli, compatível com todos os principais navegadores, tende a apresentar melhor desempenho em comparação.
Você deve conseguir implementar a codificação de transferência no seu servidor de hospedagem.
Lembre-se de não usar essas ferramentas para compactar imagens. Elas são projetadas para arquivos de texto. A compactação de imagens é melhor feita com uma ferramenta dedicada que preserve a qualidade.
5. Minimize CSS, JavaScript e HTML
A minificação transforma códigos CSS, JavaScript e HTML em uma espécie de atalho para navegadores.
Ela reduz o tamanho dos arquivos, reduzindo assim o tamanho da carga útil e aumentando a velocidade de transferência.
A minificação faz ajustes no código, entre outros ajustes: removendo espaços, cortando comentários e usando nomes mais curtos para variáveis.
A minificação transforma isso:
corpo { família da fonte: Arial, sem serifa; altura da linha: 1,6; cor de fundo: #f9f9f9; cor: #333; preenchimento: 20px; }
/*Neil Patel é um ótimo programador*/
Nisto:
corpo{família da fonte:Arial,sans-serif;altura da linha:1,6;cor de fundo:#f9f9f9;cor:#333;preenchimento:20px}
Quase todos os sistemas de gerenciamento de conteúdo têm recursos de minificação ou plugins integrados, e implementar a minificação em todo o site geralmente é uma questão simples de habilitá-los.
6. Reduza o JavaScript não essencial e o que bloqueia a renderização
Recursos de bloqueio de renderização forçam o navegador a baixar e analisar arquivos específicos antes de poder continuar carregando. Isso aumenta o tempo necessário para atingir o Largest Contentful Paint (LCP).
Isso pode acontecer com qualquer tipo de código, mas o JavaScript é um infrator particularmente ruim porque tem um tempo de execução relativamente longo.
Você pode ver as fontes de bloqueio de renderização e JavaScript não essencial na ferramenta PageSpeed Insights do Google:
A guia Cobertura no Chrome DevTools também fornece uma visão geral de todo o código não utilizado (incluindo CSS e HTML) em uma página.
7. Carregue lentamente as imagens abaixo da dobra
Quando o carregamento lento é implementado em um site, as imagens e os vídeos abaixo da dobra não são renderizados até que o usuário role a página para baixo.
Isso pode reduzir significativamente a carga inicial de uma página.
Sites de comércio eletrônico geralmente usam carregamento lento em páginas de categorias e similares, renderizando dinamicamente dezenas de imagens conforme os usuários rolam a página.
Alguns sistemas de gerenciamento de conteúdo têm problemas com carregamento lento, o que pode causar problemas com roladores rápidos. No entanto, melhora o desempenho na maioria dos casos.
8. Use uma CDN confiável
As redes de distribuição de conteúdo (CDNs) armazenam versões em cache (ou cópias) do seu site em servidores no mundo todo.
Por exemplo, se os servidores do seu site estiverem na Europa, alguém que carrega uma página na América do Norte não precisa enviar uma solicitação direta a milhares de quilômetros de distância.
Em vez disso, pode acessar uma cópia do seu site mais próxima de sua localização.
CDNs confiáveis, como Cloudflare e Amazon CloudFront, também costumam cuidar de outras tarefas de velocidade do site, como minificação e compactação de arquivos, portanto, pesquise os provedores cuidadosamente antes de tomar uma decisão.
9. Reduza as solicitações HTTPS
Um navegador coleta os arquivos necessários para renderizar seu site enviando solicitações HTTPS.
Cada solicitação pode levar de 30 a 200 milissegundos, e não é incomum que um navegador envie centenas de solicitações para carregar uma página.
Uma ferramenta como o Pingdom mostra todas as requisições de arquivo que uma página requer durante o carregamento.
Requisições excessivas para uma ou algumas páginas provavelmente indicam problemas em todo o site.
10. Use SVGs para gráficos e diagramas
Enquanto formatos de imagem de última geração, como WebP, são ideais para imagens complexas, SVGs (Scalable Vector Graphics) funcionam bem para gráficos simples.
Arquivos SVG baseados em texto são pequenos, carregam rapidamente e podem ser facilmente redimensionados, o que os torna uma excelente opção para gráficos e diagramas sem risco de pixelização.
Aqui está um exemplo de um elemento SVG:
11. Execute testes separados para dispositivos móveis
As práticas recomendadas de velocidade do site se aplicam da mesma forma a sites para dispositivos móveis e desktop.
No entanto, às vezes surgem problemas específicos para dispositivos móveis. É por isso que o PageSpeed Insights possui guias dedicadas para dispositivos móveis e desktop.
Pode ser, por exemplo, que elementos JavaScript e HTML não sejam adequados para navegadores móveis, ou que animações ou vídeos pesados apresentem lentidão em conexões 5G.
Ao executar sua amostra de páginas da web por meio do PageSpeed Insights, sempre use as visualizações para dispositivos móveis e para desktop.
12. Remova redirecionamentos quando possível
Quanto mais redirecionamentos você tiver, mais tempo o navegador levará para solicitar e renderizar a página correta.
Isso pode adicionar vários segundos ao seu tempo de carregamento — uma eternidade no mundo digital.
Identifique e corrija cadeias de redirecionamento desnecessárias sempre que possível.
Ferramentas como Ahrefs e Screaming Frog identificam rapidamente cadeias de redirecionamento 301 em seu site, que você pode revisar e corrigir quando apropriado.
13. Remova plugins desnecessários
Os plugins exigem muito código e aceleram o carregamento das páginas do seu site. Além disso, costumam adicionar muito código que bloqueia a renderização.
Revise regularmente para verificar se eles são necessários. Procure recursos duplicados e oportunidades para alternativas mais enxutas.
Claro, existem plugins desenvolvidos para ajudar na velocidade do site. Plugins que redimensionam imagens automaticamente, minimizam código e adiam o carregamento de JavaScript podem ajudar na velocidade da página.
Esses plugins geralmente fazem mais bem do que mal, mas sempre pergunte se os recursos extras valem a pena em relação à velocidade da página.
14. Utilize o cache do navegador
Quando o cache do navegador está ativado, o servidor informa aos navegadores para salvar uma cópia da página carregada. Quando um usuário retorna, a página é renderizada muito mais rápido.
Você pode habilitar o cache do navegador adicionando algum código ao seu arquivo .htaccess ou usando um plugin.
O WP Super Cache é um dos plugins de cache mais populares para WordPress.
15. Teste em diferentes navegadores
Seu site pode apresentar problemas que tornam a renderização lenta ou inviável em determinados navegadores.
Para solucionar isso, execute uma verificação em algumas das suas páginas principais com uma ferramenta como o BrowserStack SpeedLab.
Se você estiver com uma boa pontuação no Google PageSpeed Insights, é improvável que tenha grandes problemas. Mas, ainda assim, é uma tarefa de monitoramento útil.
16. Escolha seu host com cuidado
Com hospedagem web, você recebe o que paga.
E você não pode alterar a velocidade do seu provedor de hospedagem fazendo alterações no seu site.
Por isso, é muito importante escolher com sabedoria.
Existem quatro tipos de serviços de hospedagem web que você pode escolher:
- Hospedagem compartilhada: um único servidor hospeda vários sites pequenos. O preço da hospedagem compartilhada é baixo, mas um aumento repentino no tráfego para outros sites hospedados pode deixar o seu lento. É melhor evitar hospedagem compartilhada.
- Hospedagem VPS: um servidor virtual privado, ou VPS, hospeda muitos sites, mas cada site tem um “ponto” virtual dedicado exclusivamente a ele. Por ser virtual, ele oferece mais recursos, reduzindo potencialmente o risco de problemas de velocidade do site relacionados ao tráfego.
- Hospedagem em servidor dedicado: um site é hospedado em um único servidor. Embora mais caro, ajuda a reduzir ou eliminar o risco de perda de velocidade do site devido a picos de tráfego de outros sites.
- Hospedagem em nuvem: os sites são hospedados em uma rede de servidores virtuais e físicos que oferecem mais recursos e flexibilidade. Se houver um pico repentino de tráfego, um host virtual se adapta para lidar com isso.
17. Monitore a velocidade do site continuamente
Depois de executar sua auditoria inicial, implementar mudanças e automatizar processos como minificação e compactação, o trabalho pesado já passou. Mas não relaxe ainda.
A otimização da velocidade do site é um processo contínuo. Você deve verificar regularmente se há novos problemas e garantir que está seguindo as práticas recomendadas.
Veja como monitorar a velocidade do seu site:
- Execute consistentemente novas páginas (ou uma amostra de novas páginas) por meio do Google PageSpeed Insights.
- Automatize auditorias regulares em todo o site com uma ferramenta como o Ubersuggest.
- Assine uma ferramenta de garantia de qualidade como o Pingdom que alerta você sobre novos problemas.
Conclusão
Da minimização de código à implementação de monitoramento contínuo, há muitas tarefas técnicas a serem consideradas ao otimizar a velocidade do site.
No entanto, vale muito a pena a longo prazo.
O segredo é usar ferramentas como o PageSpeed Insights para realizar uma auditoria abrangente.
Depois, você pode configurar processos automatizados, como otimização e minificação de imagens. Muitas vezes, a implementação de alterações em todo o site não leva mais do que uma ou duas semanas.
De agora em diante, tudo se resume a realizar verificações regulares para garantir que os sistemas estejam funcionando corretamente. E então você pode relaxar e ver suas conversões e classificações dispararem.
Você quer resultados imediatos?
Minha agência pode fazer todo o trabalho pra você. Somos especialistas em:
- SEO - Colocamos seu site no topo das pesquisas do Google
- Mídia Paga - Fazemos seu negócio alcançar quem importa no momento certo
- Data & Conversion Intelligence - Desbloqueamos as conversões do seu site e criamos dashboards para melhores análises
