Como passar no teste de velocidade do Google com o Pagespeed Insights

Quem quer esperar anos para que uma página carregue? Especialmente no celular. Uma boa pontuação no teste de velocidade do Google é vital para o seu site.

A velocidade da página e os Core Web Vitals são cruciais hoje em dia, e não há razão para ter tempos de carregamento de página ou site lentos, especialmente com sites WordPress.

Se o tempo médio de carregamento do seu site for superior a três a cinco segundos usando um teste de velocidade do site, você está perdendo tráfego. Sua taxa de rejeição será alta porque os leitores não vão esperar e assistir a uma tela branca.

O desempenho do site é um fator vital de SEO e ajudará você a melhorar a classificação e a taxa de conversão do mecanismo de pesquisa. Na verdade, o Google agora tem uma prioridade móvel principal do Core Web Vitals para classificar palavras-chave e páginas.

Como garantir que seu blog esteja atualizado

Muitos fatores afetam os resultados do teste de velocidade.

Os serviços de Internet que fornecem testes de velocidade variam de país para país ou mesmo de cidade para cidade.

Se você testou sua conexão com a Internet, saberá que a velocidade de download e upload depende do seu provedor de serviços e da eficiência da verificação da sua conexão de internet e wi-fi.

No entanto, com o teste de velocidade do Google usando o Pagespeed Insights, você pode obter uma visão geral da velocidade de download e do desempenho do site para os visitantes do site.

Não há necessidade de pensar que chegar a 100 é sempre o objetivo principal. Você pode perder muito tempo buscando a perfeição no desempenho da web. Mas obter pontuações verdes é relativamente fácil e significa que seu site está tendo um bom desempenho.

O Just Publishing Advice tem muitas funcionalidades, widgets e imagens embutidas, mas ainda consegue pontuar muito bem para a velocidade do site. Aqui está uma rápida olhada no desempenho do site.

A pontuação mobile costuma ser um pouco menor porque o Google reduz o resultado se você não usar imagens em formatos de última geração.

No momento, isso seria uma tarefa muito grande para qualquer blog, pois requer a substituição de todas as imagens do seu site por arquivos de imagem JPEG 2000, JPEG XR ou WebP. Para a maioria dos blogueiros, você pode ignorar este aviso e continuar a usar arquivos de imagem JPEG e PNG.

Como testar o desempenho da velocidade do seu site

O teste de velocidade do Google oferece uma boa medida aproximada da velocidade do seu site.

Você também pode verificar o tempo médio de carregamento da página no Google Analytics. Mas não fornece as informações necessárias para analisar detalhadamente o desempenho do site.

Você precisa de melhores ferramentas de SEO para fazer o trabalho.

Se seus dados de laboratório estiverem todos verdes, tudo bem. Mas se suas classificações são laranja ou vermelho, você precisa tomar alguma atitude.

Dependendo de quanto tráfego você recebe, você pode ou não ver sua avaliação de Core Web Vitals.

Isso mede os dados reais de velocidade do usuário do navegador Chrome.

É um teste de aprovação ou reprovação se você tiver tráfego suficiente para gerar o relatório.

Esses relatórios fornecem orientações sobre onde você pode melhorar o desempenho do seu site.

Mas as ferramentas de teste de velocidade da página do Google não ajudam muito a rastrear e corrigir problemas.

Descobrir como corrigir problemas

Uma maneira muito melhor de verificar a velocidade do site é usar o GTMetrix.

É de código aberto e usa a pontuação do Google Pagespeed e YSlow do Yahoo, e fornece muito mais informações do que o Google.

Quando você está monitorando o desempenho e medindo sua velocidade, há dois tempos que você precisa verificar.

Embora a maioria dos serviços de teste use o Fully Loaded Time para medir o desempenho do site, essa não é a estatística mais importante.

A medida real mais precisa da velocidade do site é o tempo de carregamento do DOM (Document Object Model).

É o ponto no processo de carregamento do site quando uma página da Web está ativa para um usuário.

Para mim, esta é a estatística mais importante ao medir a verdadeira velocidade de uma página da web.

Você pode ver na imagem abaixo que, enquanto o tempo de carregamento total é de 1,9 segundos, o tempo de carregamento do DOM é de apenas 1,3 segundos.

Aqui está outra visão abaixo. A linha vermelha marcada pela seta é o ponto carregado do DOM.

Você pode ver que os elementos que não são necessários na primeira visualização do usuário são carregados posteriormente.

Os elementos carregados posteriormente são geralmente imagens que estão sendo carregadas lentamente e arquivos javascript que são adiados até que sejam necessários para ajudar sua página a ter um melhor desempenho.

Sempre que você verificar seu site, preste muita atenção ao tempo de carregamento do DOM, porque é uma medida muito mais precisa da velocidade do seu site para um usuário.

Além disso, execute um teste duas ou três vezes porque as velocidades da Internet variam de minuto a minuto.

Você pode ter uma ideia melhor calculando a média de seus resultados em, digamos, uma hora ou mais ou até mais.

Todos os testes de velocidade da Internet têm essa variação natural, portanto, não se preocupe em obter um resultado ruim aleatório.

Você também pode verificar com outros sites de teste de velocidade.

Se o seu site não está obtendo classificações verdes do Google e do GTMetrix, aqui estão onze maneiras simples, rápidas e fáceis de corrigir o problema e manter os visitantes do site e os mecanismos de pesquisa satisfeitos.

1. Primeiro, limpe a desordem da barra lateral

A primeira coisa que você deve fazer é verificar sua barra lateral. Você precisa de todos esses widgets e anúncios? Na verdade, você realmente precisa de uma barra lateral?

Você deve pensar em suas páginas como imóveis de primeira linha.

Quanta área valiosa é desperdiçada em seu site por elementos que servem muito pouco ao propósito real e tornam seu site mais lento?

Uma página da web confusa também é difícil de ler porque há muitas distrações.

A maioria dos elementos da barra lateral aumenta a velocidade de carregamento, então quanto mais você remover, melhor.

2. Evite conteúdo on-page dependente de sites externos

Um dos piores criminosos por desacelerar uma página da web e falhar no teste de velocidade do Google é um botão Curtir do Facebook.

Sua página tem que esperar pelo Facebook antes de carregar a página. É um problema comum com a maioria dos widgets de mídia social e botões de compartilhamento.

Alguns podem adicionar até dois segundos ou mais ao tempo de carregamento da página.

Se você precisar de compartilhamento de mídia social, procure um plug-in leve.

Outros serviços de Internet que podem desacelerar elementos em seu site incluem anúncios e widgets da Amazon e grandes anúncios de banner do Google.

Se você tiver o Google Adsense, tente usar anúncios in-article em vez de grandes anúncios em banner e defina o saldo do anúncio para cerca de 70-80 por cento.

Ao contrário do que você pode ler sobre o Adsense, não há uma grande carga em um site se você usar anúncios in-article.

Aqui está uma página em nosso site com anúncios do Google medidos pelo GTmetrix.

O efeito no tempo de carregamento é mínimo.

Com dois anúncios, o tempo de carregamento completo é perfeito em pouco mais de dois segundos, e o DOM carrega em 1,6 segundos.

Além disso, os anúncios estão carregando com atraso, o que significa que a página não está esperando no Google antes de ser processada.

3. Verifique se há arquivos javascript lentos

Cada elemento que você tem em seu site leva tempo para carregar.

Preencher seu site com muitos plug-ins, widgets e complementos tem um enorme custo de velocidade.

Aqui está uma avaliação do GTMetrix de um site que realmente precisa de atenção urgente. Um carregamento de página em 12,4 segundos é péssimo hoje.

Você pode usar o GTMetrix para localizar cada elemento que está deixando seu site lento.

Clique no sinal de + ao lado de cada GET para descobrir o que está deixando seu site lento e o que você precisa corrigir, remover ou otimizar.

Um site como o acima pode ser melhorado rapidamente tomando três medidas muito fáceis.

Os três pontos a seguir explicam como adicionar um cache, minificar e agregar CSS e Javascript e carregamento lento de imagens.

Todos os três plugins recomendados abaixo são gratuitos.

4. Instale o W3 Total Cache

Existem muitos plugins de cache muito bons para WordPress, incluindo WP Super Cache e WP Fastest Cache.

Mas eu uso o W3 Total Cache há mais de dez anos em todos os meus sites.

Existem muitas configurações que você pode usar com todos esses plug-ins para aproveitar o cache do navegador, mas há apenas duas que você precisa definir e usar.

Aqui estão as configurações para Total Cache. Mas eles são semelhantes para todos os plug-ins de cache.

Você só precisa ativar o navegador e o cache da página.

Essas duas configurações acelerarão seu site armazenando em cache os elementos que não mudam, como cabeçalhos, rodapés, elementos da barra lateral e menus.

5. Instale o Autoptimize

A maioria dos plug-ins de cache também pode reduzir e agregar Javascript e CSS.

Embora todos funcionem muito bem, alguns podem ser muito complicados de configurar.

Eu uso o Autoptimize para fazer esse trabalho porque é mais rápido, fácil de configurar e muito mais eficiente. Na verdade, você pode configurá-lo em menos de um minuto.

O que ele faz é reduzir o tamanho de todos os arquivos CSS e Javascript e, em seguida, agregá-los em um arquivo CSS e um arquivo Javascript.

Esses dois arquivos são carregados para que não bloqueiem a renderização, o que geralmente é um problema com um teste de velocidade do Google para alguns sites.

Minificar e agregar faz uma grande diferença na velocidade do seu site.

Aqui estão as configurações que uso para todos os meus sites.

Outro bônus extra com o Autoptimize é que o suporte é fantástico.

6. Instale o a3 Lazy Load

Quando um usuário visita seu site, todas as imagens que você tem em uma página da web precisam ser carregadas antes que sua página se torne ativa e utilizável para o visitante.

Ao usar o carregamento lento, todas as imagens que não estão aparecendo na tela do usuário são carregadas apenas à medida que rolam.

Fazer isso faz uma grande diferença na velocidade do seu site, porque suas imagens serão carregadas após o tempo de carregamento completo do DOM.

Eu tentei alguns plugins diferentes antes de decidir sobre o a3 Lazy Load. Ele ganha em desempenho e facilidade de uso.

Depois de instalado, você pode usar as configurações padrão ou fazer alguns ajustes.

O plug-in carregará lentamente todas as suas imagens, vídeos e iFrames.

7. Instale o WP Rocket

Se você deseja uma opção completa para substituir as três opções gratuitas acima, o WP Rocket pode fazer tudo e muito mais.

Em vez de ter que usar e configurar três plug-ins, você pode usar o WP Rocket para configurar sua página e o cache do navegador, minimizar seu Javascript e CSS, bem como carregar lentamente suas imagens.

Ele também pode otimizar seu banco de dados e oferece integração com Cloudflare.

O WP Rocket é uma solução tudo-em-um econômica para tornar seu site extremamente rápido em minutos com muito pouco esforço.

8. Redimensione suas imagens

Imagens grandes não diminuem a velocidade do site. Mas as imagens que não são dimensionadas para caber em uma página da web podem diminuir drasticamente a velocidade do seu site.

Você deve sempre redimensionar suas imagens para exatamente o tamanho necessário antes de carregá-las.

Se você deseja uma imagem de largura total, ela deve ser dimensionada para a largura da página do seu blog.

Este site tem 750px de largura com uma barra lateral de 300px. Qualquer imagem com mais de 750px deixará o site mais lento.

Mas nunca ajuste o tamanho de suas imagens na hora em sua caixa de detalhes de mídia. Não reduzirá o tamanho da página.

Como você pode ver, esta imagem tem 1218px de largura. Selecionar o tamanho Grande fará com que a imagem caiba.

Mas, na realidade, a página carregará a imagem em tamanho real de 1218px e diminuirá a velocidade do site.

Nunca use a caixa Detalhes da imagem no WordPress para redimensionar suas imagens preguiçosamente.

Sempre redimensione as imagens antes de fazer o upload, para que o tamanho total seja o tamanho real da sua imagem na página.

9. Otimize as imagens

Smush é um plugin popular para reduzir imagens usando compressão com perdas. Eu uso a versão gratuita e funciona perfeitamente.

No entanto, dou um passo extra antes de enviar uma imagem para qualquer um dos meus sites. Eu uso um pequeno aplicativo de desktop chamado ImageOptim.

Como você pode ver, ele reduz as imagens em cerca de 80%.

Infelizmente, está disponível apenas para usuários de Mac. Se você for um usuário do Windows, poderá usar um otimizador de imagem online para obter o mesmo resultado.

Você também pode ler um artigo anterior sobre como reduzir imagens.

10. Use Cloudflare CDN

Você precisa usar uma rede de entrega de conteúdo (CDN)?

Depende. Um CDN armazena seus arquivos estáticos em servidores em todo o mundo para ajudar seu site a carregar um pouco mais rápido. Se os visitantes do seu site estiverem distantes de você, isso pode ajudar.

Mas se o seu site estiver recebendo principalmente tráfego local, isso não ajudará muito.

A Just Publishing Advice está hospedada na Europa, mas uma grande porcentagem do tráfego vem dos Estados Unidos. Portanto, faz sentido usar um CDN.

Se o seu site estiver hospedado na Austrália, por exemplo, e você receber muito tráfego do Reino Unido e dos Estados Unidos, provavelmente deverá considerar o uso de um CDN.

Cloudflare é popular, eficiente e gratuito. Portanto, é uma boa escolha.

No entanto, você precisa de um pouco de habilidade técnica para implantá-lo em seu site.

Você pode ler mais sobre como configurar o Cloudflare com WordPress em nosso artigo de guia prático.

11. Verifique uma vez por semana

Depois de melhorar seu site com as medidas acima, você deve fazer uma verificação regular.

As coisas sempre mudam em um blog, então vale a pena ficar de olho no seu desempenho.

Você usará Pagespeed Insights e GTMetrix na maioria das vezes.

No entanto, há mais um teste gratuito de velocidade do site que você pode fazer para verificar o desempenho do seu site em 25 locais ao redor do mundo.

O Dot-Com Tools testa a velocidade do seu site em tempo real para que você possa ver a classificação do seu site.

É uma ferramenta de teste muito boa e um guia se você estiver considerando se um CDN vale a pena para você.

Ao testar, lembre-se de que o Google recomenda uma velocidade máxima de página totalmente carregada de 3 segundos.

Com o WordPress, isso é muito fácil de conseguir se você usar as sugestões de otimização deste artigo.

Resumo

Você precisa fazer tudo listado neste guia?

O WordPress pronto para uso geralmente funciona muito bem no que diz respeito à velocidade.

Mas se você usa um tema lento e adiciona muitos plugins e usa imagens grandes, então sim, você deve considerar fazer algum trabalho se o seu site tiver uma classificação ruim para velocidade de carregamento.

Outra causa pode ser um servidor host não confiável ou lento. Se você precisar mudar de provedor, um host rápido custa apenas alguns dólares por mês.

Se você está marcando no vermelho no teste de velocidade do Google, definitivamente precisa fazer algum trabalho com urgência.

Uma dica é ativar um tema WordPress padrão como o Twenty Seventeen e testar novamente. A maioria dos temas agora é responsiva, mas alguns temas mais antigos podem causar lentidão na velocidade do site.

Se o seu tema estiver bom, as principais prioridades para melhorar um site como o da imagem acima seriam:

1. Instale um plug-in de cache.

2. Instale o Autoptimize

3. Instale um carregador lento

Siga estas três etapas e o desempenho do seu site melhorará instantaneamente.

Para suas imagens, instalar o Smush e fazer uma otimização em massa também ajudará muito.

Não há razão para ter um site WordPress lento e falhar no teste de velocidade do Google.

Se você implantar as dez etapas listadas neste artigo, seu site passará no teste Pagespeed Insight para dispositivos móveis e computadores com facilidade.