Com um site lento você está perdendo conversões. Simples assim.
Nas palavras do próprio Google, “velocidade = lucro”.
A velocidade do seu site tem um impacto direto no SEO e nas taxas de conversão. Deixar de introduzir as melhorias pode ser um erro caro.
Por quê? É muito mais provável que os usuários optem por abandonar um site lento, e a probabilidade disso acontecer aumenta em mais de 100% se o tempo de carregamento da página for de apenas 6s.
Velocidade não tem preço, e a ferramenta gratuita PageSpeed Insights do Google é um recurso fantástico para ajudar você a encontrar e corrigir problemas que podem estar prejudicando a velocidade do seu site.
Neste artigo entenda o que é o teste de PageSpeed, como ele funciona e como atingir nota máxima no teste do seu site usando as nossas recomendações. Também desvendamos alguns mitos comuns.
Por que a Velocidade é Importante
Os usuários esperam que a web seja rápida.
Em 2010 o Google sinalizou a velocidade da página como um fator de ranqueamento. No começo foi focado apenas nas pesquisas em Desktops, até que uma atualização específica do PageSpeed para dispositivos móveis foi lançada em julho de 2018.
Embora a velocidade seja apenas um de mais de 200 fatores de ranqueamento, é um fator importante para os resultados do seu negócio e que está sob nosso controle. De fato, o blog da Backlinko analisou 1 milhão de resultados de pesquisa do Google e encontrou “uma forte correlação entre a velocidade do site e os ranqueamentos no Google”.
Mas, SEO à parte, já vimos como a taxa de rejeição da página aumenta à medida que a velocidade de um site diminui.
De fato, um estudo da agência de marketing digital dos EUA Portent mostrou em 2019 que “as taxas de conversão caem em média 4,42% a cada segundo adicional de tempo de carregamento (entre 0 a 5 segundos)”. Ele também descobriu que os primeiros 5 segundos de tempo de carregamento da página tiveram o maior efeito nas taxas de conversão.
Se você ainda não está acompanhando a velocidade como uma métrica de desempenho, agora é a hora.
Dê boas vindas à ferramenta PageSpeed Insights do Google
PageSpeed Insights é uma ferramenta gratuita oferecida pelo Google para ajudar você a analisar o desempenho do seu site e ver sugestões de como melhorá-lo.
Na verdade, é sem dúvida a ferramenta de análise de velocidade de página mais popular do mercado, por isso vale a pena.
Você provavelmente está se perguntando: ‘como posso obter a pontuação máxima (100/100) no Google PageSpeed Test?’
Primeiro, você precisa saber como usar a ferramenta corretamente e como implementar as sugestões que ela faz. Caso contrário, você pode deixar passar os ganhos de desempenho que podem fazer tanta diferença no seu site.
Também é importante entender o que é o PageSpeed e o que não é.
PageSpeed e tempo de carregamento
Um ponto interessante.
A ferramenta Google PageSpeed nem mede o tempo de carregamento do seu site. Ao contrário do que as pessoas pensam. Para entender o porquê, vamos primeiro analisar a diferença entre o PageSpeed e o tempo de carregamento da página.
PageSpeed
PageSpeed é uma nota na escala de 100 dada pela ferramenta PageSpeed Insights do Google.
O PageSpeed Insights e a ferramenta de desempenho de página Lighthouse, obtém métricas brutas de desempenho e as convertem em uma pontuação de 1 a 100.
E, embora ela ofereça relatórios de oportunidades e diagnósticos, eles não contribuem diretamente para a pontuação de desempenho. Isso significa que o PageSpeed, por si só, não é um indicador verdadeiro do tempo de carregamento de um site.
Tempo de carregamento
Então, o que é o tempo de carregamento, em comparação com o PageSpeed?
É o tempo médio que uma página leva para carregar para um usuário. Não é uma índice calculada. É o tempo real que uma página leva para carregar, em segundos ou milissegundos, entre o início e o final do carregamento da página.
Obviamente, o tempo de carregamento por si só não fornece informações sobre o que está causando problemas de velocidade ou como corrigi-los.
O que isso significa para você?
A ferramenta Google PageSpeed Insights é muito útil, mas você não pode usá-la isoladamente para avaliar o desempenho do seu site. Você precisa usar vários indicadores para identificar e resolver problemas.
Como o Google PageSpeed Insights funciona?
A ferramenta Google PagesSpeed Insights é desenvolvida pela Lighthouse e fornece dados de laboratório ‘’ e dados de campo ‘’ para uma página.
‘’ Dados de laboratório ‘’ são coletados em um ambiente controlado ao digitalizar uma página e é uma ótima maneira de identificar problemas de desempenho e encontrar soluções para corrigi-los. “Dados de campo”, por outro lado, são coletados a partir de dados de desempenho do mundo real quando os usuários carregam sua página. Alguns dos problemas e gargalos aparentes que dificultam a conversão de seus visitantes reais podem aparecer aqui.
A ferramenta mostra uma pontuação de desempenho de 0 a 100. No entanto, os resultados da métrica de desempenho usados para calcular isso não são ponderados igualmente. Em vez disso, coisas como ‘first contentful paint’ (a primeira vez que um usuário vê aparecer alguma parte da página) têm um efeito maior.
3x — primeira exibição de conteúdo
1x — primeiro aparecimento com conteúdo.
2x — primeira CPU ociosa.
5x — tempo até ficar interativa.
4x — índice de velocidade.
0x — possível latência máxima na primeira entrada.
Mas você não verá nada disso. Você verá uma nota de desempenho e uma cor, dependendo do intervalo em qual a sua pontuação se enquadra. São elas:
Vermelho (nota baixa): 0–49
Laranja (nota média): 50–89
Verde (nota boa): 90–100
Agora que você sabe um pouco mais sobre o PageSpeed Insights, o que é e como as notas são calculadas, por onde começamos a otimização?
Como usar o Google PageSpeed
Acesse a ferramenta PageSpeed Insights:
Digite o URL de uma página. Não precisa ser o domínio raiz / página inicial. Depois que a ferramenta calcular as pontuações e recomendações, você verá o seguinte:
Por padrão você receberá pontuações de desempenho para celular. Você pode mudar a configuração para acompanhar o desempenho nos desktops usando a aba na parte superior esquerda da página:
Para entender melhor como usar o PageSpeed Insights, você precisa saber o que significa cada indicador mostrado e como interpretá-lo.
Pontuação de velocidade
Conforme explicado acima, a pontuação de velocidade é uma representação codificada por cores de muitas métricas de desempenho calculadas juntas. É uma ótima métrica de velocidade, aproximada, mas rápida.
Por si só, não é uma medida de desempenho profunda, por razões que discutimos anteriormente. Quanto pior o tempo de carregamento do seu site nas métricas de desempenho, maior será sua pontuação de velocidade. Compare sua pontuação de velocidade para dispositivos móveis e desktops.
Dados de campo
“Dados de campo” relata o desempenho da página nos últimos 30 dias, quando comparada a outras no Relatório de experiência do usuário do Chrome — um conjunto de métricas de desempenho coletadas de alguns usuários do navegador Chrome do Google.
Se disponível, você também poderá visualizar um resumo da origem, bem como o URL específico que está testando. Isso permite que você compare uma página específica e todas as páginas da origem.
É importante saber que os dados do campo são agregados de usuários reais no Chrome.
Mas pode não haver dados suficientes para o URL que você inseriu. Se for esse o caso, você poderá visualizar apenas “dados de laboratório”.
Primeira exibição de conteúdo (FCP)
A métrica de primeira exibição de conteúdo mede o tempo gasto desde a navegação até a página e o momento em que o primeiro bit de conteúdo é renderizado no DOM. É o primeiro marco a mostrar que uma página está começando a carregar. Primeira exibição importante relata a velocidade de chegar a esse ponto.
Latência de entrada (FID)
Essa é uma métrica essencial para medir a capacidade de resposta que quantifica a rapidez com que a página responde à entrada de um usuário, como um clique do mouse.
Um FID baixo sugere que uma página é pronta para ser usada mais rápido. Enquanto o FCP mede a rapidez com que uma página começa a carregar, o FID fornece informações sobre a primeira impressão do usuário ao interagir com uma página.
Dados do laboratório
“Dados de laboratório”, em comparação com “dados de campo”, são baseados na análise da Google Lighthouse da página em um dispositivo e conexão emulados. Embora isso não mostra dados do mundo real, ainda é útil para entender onde ocorrem os problemas. Mais uma vez, o PageSpeed Insights usa seu sistema familiar de coloração de semáforos para indicar o desempenho: exibindo um círculo para pontuações em verde, um quadrado para notas laranjas e um triângulo para notas vermelhas.
Primeira exibição de conteúdo (FCP)
Embora o FCP já foi mostrado no relatório “dados de campo”, este dado aqui é baseado em uma análise emulada da Lighthouse, em vez de dados do mundo real.
Primeira exibição importante
Quanto menor a primeira exibição importante para o seu site ou página, mais rápida é a página para exibir o conteúdo. Em termos simples, isso mostra quando o conteúdo principal de uma página foi exibido na tela e é uma ótima maneira de entender a experiência do usuário na hora de carregamento.
Índice de velocidade
A métrica do índice de velocidade mostra a rapidez com que o conteúdo de uma página se torna visível, onde as pontuações mais baixas indicam melhor desempenho.
Primeira CPU ociosa
Essa métrica mostra quando a maioria dos elementos de uma página é interativa e quando a página é capaz de responder à maioria das entradas do usuário sem demora excessiva.
Tempo até ficar interativa
Essa métrica mede a rapidez com que uma página se torna interativa. Otimizar a visibilidade prejudicando a interatividade pode ser frustrante para os usuários. Daí a importância de entender quando uma página que exibe conteúdo útil responde.
Possível latência máxima na primeira entrada
Lembra do indicador FID no relatório “dados do campo”? Para “dados de laboratório”, é o atraso potencial máximo da primeira entrada que mostra a duração da tarefa mais longa após o FCP que pode ser vivida pelos usuários.
Oportunidades
É na seção de oportunidades que você obtém uma ideia em que focar para melhorar o tempo de carregamento da página e a pontuação do PageSpeed.
Diagnóstico
Os diagnósticos, por outro lado, mostram recomendações sobre práticas recomendadas que devem ser levadas em conta, mas não necessariamente melhoram os tempos de carregamento.
Auditorias aprovadas
Auditorias aprovadas são mais recomendações com indicações de possível economia de espaço.
O que é uma boa pontuação no PageSpeed?
Mesmo se você não atingir a nota 100/100, ainda poderá ter um site de carregamento rápido. Lembre-se de que o PageSpeed, por si só, não é um indicador direto do tempo de carregamento.
A probabilidade é que você nunca alcance uma pontuação perfeita, apesar de fazer melhorias drásticas que afetam positivamente o tempo de carregamento do seu site. Concentre seus esforços e recursos onde eles fazem mais sentido. Conforme declarado pela plataforma de hospedagem Kinsta do WordPress, “obter 100/100 no Google PageSpeed Insights não é tão importante”.
É frequentemente citado como um mito comum que você precisa obter nota 100/100 para que seu site tenha um bom desempenho.
Lembre-se de que o verdadeiro indicador de desempenho do seu site é o tempo de carregamento, não uma pontuação do PageSpeed Insights. Dito isso, podemos ver que o próprio Google detalha que uma pontuação ruim é entre 0 e 49, uma média entre 50 e 89, e uma boa pontuação é de mais de 90. Mire alto, com certeza, mas não fique obcecado em obter uma pontuação de 100.
Também é importante entender o desempenho dos sites com os quais você está competindo diretamente nos SERPs. Se você tiver um tempo de carregamento mais rápido e uma melhor pontuação na Velocidade da Página, mas ainda assim a sua nota é, digamos, 92/100, é provável que seus esforços possam ser melhor alocados em outros lugares.
Como melhorar sua pontuação no Google PageSpeed Insights
Tente implementar as práticas recomendadas e as táticas abaixo; são os erros mais comuns e têm o maior impacto sobre as melhorias.
Otimize imagens
A otimização da imagens é talvez um dos motivos mais comuns pelos quais uma página da Web tenha um tempo de carregamento lento e geralmente isso é o melhor ponto de partida para começar a fazer melhorias, pois os aumentos no tempo de carregamento e no PageSpeed podem ser significativos.
Especialmente quando há várias pessoas responsáveis pelo upload de conteúdo ou pela adição de produtos, é difícil manter padrões rígidos para imagens e os erros podem multiplicar-se rapidamente.
As imagens consomem muitos recursos para fazer o download e geralmente não são otimizadas adequadamente. As áreas principais em que você pode fazer melhorias otimizando as imagens são:
Otimizar o tamanho de uma imagem.
Otimizar o tamanho de exibição em relação ao tamanho real da imagem em pixels.
Postergar o carregamento de imagens fora da tela.
Usar uma rede de entrega de conteúdo (CDN).
Usar imagens de última geração.
Otimizando o tamanho da imagem
Uma imagem de 1 MB levará mais tempo para baixar do que uma imagem de 100 KB. Para resolver isso, opte por comprimir imagens sem perder a qualidade.
Você pode usar ferramentas como o TinyPNG ou ImageMagick, recomendada por Google.
Tamanho original de imagens vs tamanho de exibição
Outro problema comum são as imagens que são muito maiores do que é necessário. Imagine que sua página exibe uma imagem de 250 por 250 px. Se a imagem original for de 1000 por 1000 px e você usar o CSS para diminuí-lá, pode acelerar bastante o tempo de carregamento.
Se você deixar a imagem do jeito que ela é, o navegador precisaria baixar a imagem original (maior) para exibi-la em tamanho menor, atrasando o carregamento.
Use uma rede de entrega de conteúdo (CDN)
Certifique-se de carregar imagens com o tamanho correto; caso contrário, você terá problemas de velocidade. O WordPress lida com isso automaticamente criando várias versões de uma imagem quando carregadas, mas se você estiver usando outro sistema de gestão de conteúdo, poderá ser necessário redimensionar manualmente as imagens.
O uso de uma CDN basicamente distribui a carga do servidor por vários locais diferentes e os usa o mais próximo ao usuário para atender as solicitações. Quanto mais próximos estiverem os dados, mais rápido é o tempo de carregamento. Parece ótimo, né? Confira as práticas de SEO necessárias para CDNs antes de testar.
Postergando as imagens fora da tela
Você também pode postergar o carregamento de imagens fora da tela, fazendo com que elas sejam carregadas apenas à medida que o usuário faz a rolagem da página. Corre o risco de que nem todas as imagens sejam visíveis quando necessário. No entanto, geralmente é um compromisso que vale a pena fazer para melhorar o tempo de carregamento.
Você pode encontrar vários plugins do WordPress que podem ajudar na implementação, ou seguir os conselhos do Google sobre imagens fora da tela.
Usar formatos de imagem de última geração
Considere o uso de formatos de imagem de última geração, como o WebP. Foi provado que as imagens WebP podem resultar em uma redução de 85,87% no tamanho médio da imagem em comparação com o JPG e em 42,8% em relação ao PNG.
Esse tipo de imagens nem sempre é suportado pelos principais navegadores, mas alguns aplicativos conseguem trabalhar com o WebP.
Melhorando o tempo de resposta do servidor
Infelizmente fazer melhorias no tempo de resposta do servidor não é algo que a maioria tem a capacidade de fazer, uma vez que as duas áreas reais de impacto são reduzindo a carga ou melhorando o hardware. Melhorar o tempo de resposta do servidor realmente se resume a garantir que seu site esteja hospedado em um ótimo servidor.
Se você vir recomendações relacionadas ao tempo de resposta do servidor ou TTFB (tempo até o primeiro byte), converse com seu provedor de hospedagem ou considere soluções de hospedagem mais adequadas ao seu site.
Minificação
Ao escrever código muitos desenvolvedores optam por usar espaços para facilitar a leitura. A minificação remove espaços em branco e comentários para otimizar arquivos CSS e JS, otimizando o tempo de carregamento.
Ela pode ser feita usando uma ferramenta simples, como o Minify.
Cache do Navegador
Se você estiver usando o WordPress como sistema de gestão de conteúdo (que cerca de 35% da Web usa), usar o cache do navegador é muito fácil com plug-ins gratuitos, tais como W3 Total Cache e WP Super Cache.
O armazenamento em cache significa criar e exibir rapidamente uma versão estática do seu site para os usuários, em vez de gerar uma página dinâmica sempre que for acessada.
Se você não estiver usando o WordPress, ainda é possível configurar o cache do navegador manualmente.
Limpar redirecionamentos
Com o tempo, vários redirecionamentos podem se acumular e resultar em uma velocidade de carregamento de página mais lenta, pois os navegadores são forçados a fazer solicitações HTTP adicionais, aumentando o tempo de carregamento.
O PageSpeed Insights vai destacar esses problemas.
Auditoria do Site da SEMrush como uma alternativa ao PageSpeed Insights
A ferramenta de Auditoria do Site da SEMrush é uma maneira fantástica de testar a velocidade do site.
Assim como o PageSpeed Insights, a ferramenta de Auditoria do site pode recomendar melhorias para aumentar a velocidade de carregamento de um site e apontar outros problemas de desempenho.
A ferramenta procura por mais de 130 erros técnicos e de SEO, fornecendo gráficos, instruções e diretrizes sobre todas as áreas, desde rastreabilidade até problemas de conteúdo.
Você pode visualizar um relatório temático completo que fornece uma visão sobre problemas e oportunidades de desempenho, mostrando tudo o que você precisa para fazer melhorias em um único relatório.
O relatório de desempenho ajuda a fazer melhorias acionáveis no desempenho e no tempo de carregamento do seu site. É uma maneira rápida de obter uma visão geral e uma análise visual de seus dados e métricas, cobrindo:
Velocidade de carregamento da página.
Velocidade média de carregamento da página.
Número de arquivos JavaScript e CSS.
Tamanhos de arquivo JavaScript e CSS.
Além disso, o relatório aponta os erros, avisos e notificações. Tudo priorizado para ajudar a corrigir os problemas mais urgentes. Você vai encontrar informações sobre o que fazer para ver melhorias na seção ‘Por que e como corrigi-lo’, com problemas sinalizados, incluindo:
Problemas de tamanho grande de páginas HTML
Cadeias de redirecionamento e loops.
Baixa velocidade de carregamento da página.
Páginas não compactadas.
Arquivos Javascript e CSS não compactados.
Arquivos Javascript e CSS não armazenados em cache.
Tamanho total de JavaScript e CSS muito grande.
Muitos arquivos JavaScript e CSS.
Arquivos JavaScript e CSS não minificados.
Tempo médio lento de interatividade do documento.
Por que vale a pena testar a ferramenta? Juntamente com o Google PageSpeed Insights, a ferramenta de Auditoria do site pode ajudar a priorizar e corrigir ações para promover melhorias, reduzir o tempo de carregamento do site e ter a chance de converter melhor seus visitantes.
Conclusão
Não há como ignorar a importância de ter um site rápido e esperamos que agora a ferramenta PageSpeed do Google ficou mais clara e fácil de usar.
Muitas vezes, é difícil saber por onde começar, mas dedicando algum tempo para entender quais áreas podem ter o maior impacto, você pode começar a trabalhar com seus desenvolvedores para estabelecer um plano de ação priorizado e mudar as coisas, melhorando não apenas o desempenho de SEO do seu site, mas também convertendo os usuários a uma taxa mais alta.
Um abraço
Meu nome é Camilo Dantas, sou especialista em SEO, otimização de sites para conversão e métricas do core Web Vitals
Me siga no instagram para ter informações diárias sobre Core Web Vitals, SEO e otimização de conversão para vendas online.
https://www.facebook.com/CamilloDantasoOficial/
Top comments (0)