A maioria dos proprietários de sites WordPress sabe o quão frustrante um site lento pode ser. Você fez o básico — comprimiu imagens, configurou o cache e seguiu as dicas padrão de velocidade — mas suas páginas ainda demoram muito para carregar.
Descobrimos que o problema é muitas vezes algo simples: sites baixando dados desnecessários demais.
Em termos técnicos, isso é chamado de 'carga útil de rede'. É simplesmente a quantidade total de dados necessária para carregar uma página. O tamanho total do download inclui texto, imagens, vídeos, CSS, JavaScript, fontes e outros códigos.
Basicamente, quanto menos dados precisarem ser baixados, mais rápido a página carregará.
Portanto, se você está procurando melhorar a velocidade do seu site, veio ao lugar certo!
Neste guia, mostraremos exatamente como reduzir o tamanho desses arquivos e evitar cargas úteis de rede enormes no WordPress.
Por Que Cargas Úteis de Rede Enormes no WordPress São um Problema?
Você já usou uma ferramenta como Google Lighthouse ou PageSpeed Insights para verificar a velocidade do seu site?
Às vezes, você pode ver uma mensagem dizendo: 'Evite cargas úteis de rede enormes'.
Essencialmente, isso significa que sua página da web é muito grande, como uma mala que está muito pesada para carregar. Uma página da web grande demora mais para carregar, o que pode ser frustrante para as pessoas que visitam seu site.
A carga útil de rede de uma página da web é o tamanho total de todas as partes que compõem essa página. Isso inclui:
- Texto: As palavras que você lê na página
- Imagens e Mídia: Fotos e vídeos que você vê
- Código: Os arquivos CSS e JavaScript que fazem a página ter uma boa aparência e funcionar corretamente
- Fontes: Os estilos especiais para o seu texto
- Além disso, quaisquer outros elementos personalizados
Portanto, quanto maiores todos esses elementos combinados, mais tempo leva para sua página da web aparecer na tela.
Quão grande é muito grande? Aqui está um guia simples:
- Bom: Se todas as partes da sua página da web somarem menos de 2 MB, é como carregar uma bolsa leve. É bem otimizado e carrega rapidamente. Você não precisa se preocupar muito aqui.
- Precisa de melhorias: Se sua página da web tiver entre 2 MB e 4 MB, é como carregar uma mochila que está ficando um pouco pesada. Pode haver algumas coisas que você pode tornar mais leves. O Google lhe dará algumas dicas sobre como torná-la mais rápida.
- Enorme: Se sua página da web tiver mais de 4 ou 5 MB, é como tentar carregar uma mala enorme e transbordando. Isso tornará seu site lento para seus visitantes, então você precisa priorizar a otimização.
Se você vir a mensagem 'Evite cargas de rede enormes', poderá clicar na pequena seta para ver uma lista de todos os recursos que compõem sua página da web.
Veja como os maiores arquivos estão no topo da lista? Se você se concentrar em tornar esses arquivos menores ou remover arquivos desnecessários, verá a maior melhora no desempenho do WordPress.
Ao tornar esses arquivos menores, você usará menos dados para visualizar a página da web, e ela carregará mais rápido.
Agora que você sabe por que páginas da web grandes são um problema, vamos explorar como evitá-las no WordPress. Aqui estão as 8 dicas que abordaremos neste artigo:
- Reduza o tamanho das suas imagens
- Incorpore vídeos da maneira certa
- Use carregamento preguiçoso (lazy loading) em imagens e vídeos
- Reduza o tamanho e o número de arquivos Javascript e CSS
- Comprimir Arquivos com Gzip
- Use Cache do Navegador para Evitar Downloads Repetidos
- Use Menos Fontes ou Fontes do Sistema
- Evite Plugins Lentos
- Frequently Asked Questions About Network Payloads in WordPress
Você está pronto? Vamos mergulhar!
1. Deixe Suas Imagens Menores
Uma das maiores causas de grandes cargas de rede são imagens grandes.
Os smartphones e câmeras de hoje tiram imagens de alta qualidade com tamanhos de arquivo muito grandes. Mas você não precisa mantê-las tão grandes quando as exibe em um site.
Felizmente, você pode otimizar imagens para torná-las até 80% menores sem perder a qualidade da imagem. Isso tem um impacto maior na carga de rede do seu site do que praticamente qualquer outra coisa.
Na WPBeginner, otimizamos todas as nossas imagens antes de carregá-las. Redimensionamos nossas imagens para as dimensões corretas e, em seguida, reduzimos o tamanho do arquivo usando várias ferramentas.
Reunimos um guia útil baseado exatamente em como fazemos isso em nosso próprio site. Você pode seguir nosso artigo sobre como otimizar imagens para desempenho na web sem perder qualidade.
2. Incorpore Vídeos da Maneira Certa
Se você tem vídeos em seu site, precisa ter cuidado com a forma como os exibe.
Carregar vídeos diretamente em seu site pode causar grandes cargas de rede e diminuir significativamente a velocidade do seu site, especialmente se eles começarem a tocar automaticamente.
A melhor maneira de incluir vídeos é incorporá-los de plataformas de vídeo como YouTube ou Vimeo.
☝ Observação: Usamos o YouTube para hospedar e transmitir nossos vídeos. Você pode explorar nossos tutoriais em vídeo do WordPress em nosso canal do WPBeginner no YouTube.
Essa abordagem ainda permite que você reproduza os vídeos em seu site, mas como eles são armazenados em um servidor de outra pessoa, eles não fazem parte da carga útil da sua rede.
Isso realmente ajuda porque seu servidor não precisa lidar com a transferência de dados pesados. Além disso, essas plataformas são projetadas para entregar vídeos de forma eficiente, com streaming otimizado que se adapta à conexão de internet do seu visitante.
Além disso, muitos players de vídeo dessas plataformas só começarão a carregar o vídeo quando o usuário clicar em reproduzir, o que significa menos dados transferidos inicialmente.
Você pode facilmente adicionar os vídeos ao seu site usando o código de incorporação.
Para mais informações sobre este tópico, consulte nosso guia sobre por que você nunca deve fazer upload de um vídeo para o WordPress.
3. Use Lazy Loading em Imagens e Vídeos
O lazy loading é outra ótima maneira de evitar grandes cargas úteis de rede, especialmente se o seu site estiver cheio de imagens ou vídeos.
Normalmente, quando uma página da web carrega, o navegador quer baixar imediatamente todas as imagens e vídeos, mesmo que eles não sejam vistos imediatamente.
Imagine se um restaurante trouxesse todos os seus pratos de uma vez em vez de um de cada vez. Seria avassalador!
É isso que acontece em uma página da web se o lazy loading não for implementado. Tudo precisa ser baixado antecipadamente, mesmo que o usuário ainda não consiga vê-lo.
Isso obviamente não é ideal, pois significa que seu site tem uma carga útil grande e você baixa muitos dados, mesmo que o usuário não veja o conteúdo na parte inferior da página.
A solução para isso é chamada de lazy loading.
O lazy loading é como aquele restaurante trazendo cada prato da sua refeição conforme você está pronto para ele.
Com carregamento preguiçoso, imagens e vídeos não são carregados até que estejam prestes a rolar para a visualização do usuário na tela. Dessa forma, o navegador só precisa carregar o que é necessário quando é necessário.
Isso reduz a carga útil inicial da rede e a quantidade de dados que precisam ser baixados.
Aqui estão alguns tutoriais úteis que mostram como configurar o carregamento preguiçoso (lazy loading) no WordPress:
- Como Carregar Imagens Lentamente (Lazy Load) Facilmente no WordPress
- Como Adicionar Facilmente Carregamento Lento para Vídeos no WordPress
- Como Carregar Lento Gravatars em Comentários do WordPress
4. Reduza o Tamanho e o Número de Arquivos Javascript e CSS
Uma das melhores maneiras de evitar grandes cargas de rede em seu site é reduzir o tamanho de seus arquivos CSS e JavaScript.
Seu site usa arquivos CSS para estilização e arquivos JavaScript para recursos interativos.
No entanto, esses arquivos geralmente contêm espaços extras e comentários que não são necessários para a funcionalidade do código. Você pode remover esses elementos com segurança para reduzir o tamanho dos arquivos.
Isso significa que esses arquivos ainda funcionarão da mesma maneira, mas haverá menos dados para seus usuários baixarem, tornando o carregamento da sua página mais rápido.
Esse processo é conhecido como minificação, e a boa notícia é que você pode usar um plugin do WordPress como o WP Rocket para minificar automaticamente seus arquivos.
Veja nosso guia sobre como minificar arquivos CSS e JavaScript no WordPress para mais informações.
Agora, diferentes partes do seu site geralmente terão arquivos CSS ou JavaScript diferentes. Por exemplo, um arquivo para o cabeçalho, outro para o corpo e talvez até mais para plugins.
Mas muitos arquivos menores podem ser menos eficientes do que um arquivo maior. Quando há muitos arquivos para carregar, o navegador precisa buscar cada um deles separadamente, o que aumenta o tamanho total do download. Em vez disso, você pode combinar muitos desses arquivos menores em um único arquivo.
Plugins populares como WP Rocket (pago) e Autoptimize (gratuito) podem combinar e minificar automaticamente arquivos CSS e JavaScript.
Você pode aprender como usar esses plugins em nosso guia sobre como corrigir JavaScript e CSS que bloqueiam a renderização no WordPress.
5. Reduza o tamanho dos arquivos com Gzip
Outra maneira de tornar os arquivos do seu site menores é comprimi-los. Arquivos baseados em texto como HTML, CSS e JavaScript podem ser significativamente reduzidos usando compressão Gzip.
Na verdade, a compressão Gzip pode frequentemente reduzir o tamanho desses arquivos em até 70% antes que eles sejam enviados para o navegador do usuário! Isso é uma grande economia na quantidade de dados que precisam ser transferidos.
Isso reduz o tempo de download dos arquivos e faz com que seu site WordPress carregue muito mais rápido. Assim que os dados comprimidos chegam ao computador do seu visitante, o navegador descompacta (descomprime) automaticamente os arquivos e os exibe na tela do usuário.
Você não precisa se preocupar se os navegadores dos seus usuários suportam a compressão Gzip, pois ela funciona em todos os navegadores populares hoje em dia.
Muitos plugins de cache excelentes também suportam a compressão Gzip. Opções populares incluem WP Rocket, WP Super Cache e W3 Total Cache.
Anteriormente, usamos o WP Rocket no site WPBeginner e tivemos uma ótima experiência. Para mais informações, veja nossa análise completa do WP Rocket.
Com o WP Rocket, a compressão Gzip será ativada automaticamente se o seu provedor de hospedagem usar o servidor Apache. Para outros plugins de cache, você pode precisar ativá-la nas configurações do plugin.
Para instruções detalhadas, veja nosso guia sobre como ativar a compressão Gzip no WordPress.
6. Use o Cache do Navegador para Evitar Downloads Repetidos
Outra maneira de evitar uma carga de rede enorme no WordPress, especialmente se o seu site tiver muitos visitantes recorrentes, é experimentar o cache do navegador.
Imagine se seus visitantes tivessem que baixar tudo do seu site toda vez que o visitassem! Isso seria incrivelmente lento, e é exatamente o que acontece se você não usar o cache adequado.
Quando alguém visita seu site pela primeira vez, o navegador baixa tudo o que precisa: imagens, CSS, JavaScript e todos os outros recursos. Com o cache do navegador, o navegador salva uma cópia desses arquivos no computador do usuário.
Em seguida, na próxima vez que visitarem seu site, o navegador será inteligente! Ele verifica os arquivos salvos localmente antes de solicitar tudo novamente ao seu servidor.
Se o navegador tiver uma cópia de um arquivo em seu cache, ele simplesmente a usará em vez de baixá-la novamente. Isso faz uma grande diferença na redução da carga geral da rede e proporciona aos visitantes frequentes uma experiência mais rápida e fluida.
Claro, se o conteúdo do seu site muda com frequência, como um site de notícias ou um blog que é atualizado regularmente, você precisará informar aos navegadores quando rebaixar as versões mais recentes de seus arquivos. Isso garantirá que todos recebam o conteúdo mais atualizado.
Você pode controlar isso adicionando cabeçalhos de expiração no WordPress. Esses cabeçalhos informam ao navegador quando um arquivo salvo deve ser considerado antigo e precisa ser atualizado.
7. Use Menos Fontes ou Fontes do Sistema
Fontes podem fazer seu site parecer ótimo e melhorar a legibilidade. Usar fontes personalizadas pode tornar seu site único e incentivar seus visitantes a passarem mais tempo navegando.
Mas imagine se você tivesse que baixar muitas fontes diferentes cada vez que visitasse um site. Levaria um tempo para mostrar tudo na página.
A chave é usar um pequeno número de fontes em seu site. Recomendamos usar apenas duas fontes principais e utilizá-las em todo o seu site. Isso reduz o número total de arquivos que seus visitantes precisam baixar.
Melhor ainda, você pode usar fontes do sistema em vez de fontes personalizadas.
Fontes do sistema são fontes que já estão instaladas nos computadores das pessoas. Pense nisso como usar as fontes padrão do seu computador, como Arial ou Times New Roman.
Se você escolher fontes do sistema para o seu site, seus usuários não precisarão baixar nenhum arquivo extra! Isso reduz significativamente o tamanho da sua carga de rede e torna seu site mais rápido para os visitantes.
Para mais informações, veja nosso guia sobre como desativar fontes do Google em seu site WordPress.
8. Evite Plugins Lentos
Finalmente, vamos falar sobre plugins. Às vezes, plugins podem deixar seu site mais lento e aumentar o tamanho da sua carga de rede carregando muitos arquivos JavaScript e CSS extras.
Você deve pensar em plugins como ferramentas extras que você adiciona ao seu site. Alguns são ótimos e leves, enquanto outros podem ser bem pesados. Usar muitos plugins pesados pode aumentar o tamanho de download do seu site.
É difícil saber quais plugins são lentos de relance, então você terá que pesquisar. Para mais informações, você pode ver nosso guia sobre quais plugins do WordPress estão deixando seu site lento.
Depois de encontrar os plugins que aumentam o tamanho de download da sua página, você tem algumas opções.
Primeiro, você pode entrar em contato com o desenvolvedor do plugin e ver se há algo que você possa fazer para tornar o plugin mais eficiente. Ou você também pode procurar um plugin mais rápido que faça a mesma coisa.
Para recomendações, consulte nosso guia sobre como escolher os melhores plugins do WordPress.
👉 Post Relacionado: Você está um pouco nervoso em entrar em contato com um desenvolvedor de plugin? Confira nosso guia sobre como pedir suporte ao WordPress corretamente (e obtê-lo).
Às vezes, você descobrirá que alguns dos plugins pesados são essenciais para o seu site. Nesse caso, você ainda pode tornar seu site mais rápido carregando esse plugin apenas nas páginas que o necessitam, em vez de carregá-lo em todos os lugares.
Você pode usar um plugin gratuito chamado Plugin Organizer para desativar plugins em páginas onde eles não são necessários. Isso diminuirá a carga útil da rede nessas páginas.
Perguntas Frequentes Sobre Cargas Úteis de Rede no WordPress
Aqui estão algumas das perguntas mais comuns que as pessoas fazem sobre como reduzir as cargas úteis de rede no WordPress. Essas respostas ajudarão você a entender melhor os aspectos técnicos e os detalhes de implementação.
1. O que exatamente é uma carga útil de rede e por que ela é importante para o meu site WordPress?
Uma carga útil de rede é a quantidade total de dados (imagens, CSS, JavaScript, HTML, etc.) que seu site envia para o navegador de um visitante quando ele carrega uma página. Cargas úteis grandes deixam seu site lento porque os visitantes precisam baixar mais dados, o que é especialmente problemático para usuários de dispositivos móveis ou com conexões de internet mais lentas. O Google também considera o tamanho da carga útil ao classificar sites, portanto, otimizá-lo pode melhorar seu SEO.
2. Como posso verificar o tamanho atual da minha carga útil de rede?
Você pode verificar sua carga útil de rede usando o Google PageSpeed Insights, GTmetrix, ou as ferramentas de desenvolvedor do seu navegador. No Chrome, pressione F12, vá para a aba Rede e recarregue sua página. O tamanho total aparecerá na parte inferior. Geralmente, você deseja manter sua carga útil total abaixo de 1-2 MB para um desempenho ideal.
3. A redução das cargas úteis de rede afetará a funcionalidade ou o design do meu site?
Não, se feito corretamente. As técnicas se concentram em otimizar e comprimir o conteúdo existente em vez de remover recursos. Você manterá a mesma funcionalidade e apelo visual, ao mesmo tempo em que entrega o conteúdo de forma mais eficiente. No entanto, sempre teste as alterações em um site de staging primeiro para garantir que tudo funcione corretamente.
4. Com que frequência devo otimizar minhas cargas úteis de rede?
Você deve monitorar suas cargas úteis mensalmente e otimizar sempre que adicionar novo conteúdo, plugins ou temas. Configure auditorias regulares usando ferramentas como o Google Search Console para rastrear suas Core Web Vitals. Otimizações importantes podem ser necessárias trimestralmente, mas a manutenção contínua deve fazer parte da sua rotina regular de manutenção do WordPress.
5. Posso reduzir as cargas úteis de rede sem conhecimento técnico?
Sim, muitas técnicas de otimização podem ser implementadas usando plugins fáceis de usar como WP Rocket, Smush ou Autoptimize. Essas ferramentas lidam com compressão de imagem, minificação de arquivos e cache automaticamente. No entanto, para otimizações avançadas, você pode precisar da ajuda de um desenvolvedor ou especialista em WordPress.
Bônus: Guias de Especialistas Relacionados ao Desempenho do WordPress
Esperamos que este tutorial tenha ajudado você a aprender como evitar cargas de rede enormes no WordPress. Você também pode querer ver alguns guias sobre outras maneiras de melhorar o desempenho do WordPress:
- O Guia Definitivo para Aumentar a Velocidade e o Desempenho do WordPress
- Por que o WordPress está lento? Aprenda como consertar
- Como Acelerar Seu Site de E-commerce
- Como Aumentamos a Velocidade de Carregamento de Páginas no WPBeginner
- Como Executar Corretamente um Teste de Velocidade de Site
- Melhores Plugins de Cache para WordPress para Acelerar Seu Site
- Por que você precisa de uma CDN para o seu blog WordPress?
- Como Reduzir Solicitações HTTP no WordPress
- Como Descarregar Mídia do WordPress para Melhorar a Velocidade do Site
- Manutenção do Banco de Dados do WordPress: Como Otimizar Seu Banco de Dados
Se você gostou deste artigo, por favor, inscreva-se em nosso Canal do YouTube para tutoriais em vídeo do WordPress. Você também pode nos encontrar no Twitter e no Facebook.
Tem alguma pergunta ou sugestão? Por favor, deixe um comentário para iniciar a discussão.