Desvendando os segredos do SEO: Apresentando o melhor guia para a velocidade do site

A velocidade importa tanto para os usuários quanto para o SEO: ninguém quer esperar vários segundos para que um site seja carregado. Os usuários preferem sair do seu site e ir para um concorrente do que perder tempo esperando. A citação “tempo é dinheiro” é tão verdadeira agora quanto era quando Benjamin Franklin disse isso séculos atrás. O tempo também é importante para o Google. A velocidade é um dos fatores de classificação do Google. Todas as coisas sendo iguais, quanto mais rápido o site, maior a classificação. E ninguém vai argumentar que ter um site rápido não é uma necessidade hoje em dia. A questão é: como tornar seu site mais rápido? Nosso autor convidado neste Unwrapping the Secrets of SEO é Tomek Rudzki, chefe da equipe de Pesquisa e Desenvolvimento da Elephate, vencedor do prêmio “Best Small SEO Agency” no European Search Awards de 2018. Rudzi oferece conselhos sobre como acelerar seu site e ganhar.

Este guia abrangente para a velocidade do site apresenta três artigos. Leia os seguintes posts aqui: The Ultimate Guide to Website Speed ​​– Part 2 e The Ultimate Guide to Website Speed ​​– Part 3.

Estudo de velocidade de página gratuito

1. Tempo é dinheiro

Há muitas pesquisas apontando para o fato de que um site mais rápido equivale a mais receita.

• O Pinterest percebeu que reduzir os tempos de espera percebidos resultou no aumento do número de inscrições em 15% .
• A BBC notou que para cada segundo adicional que seu site carrega, 10% dos usuários saem.
• A DoubleClick do Google investigou que a redução do carregamento da página de 19 (extremo!) para 5 segundos resultou em taxas de rejeição 35% mais baixas e sessões 70% mais longas.
• O estudo da Amazon revela que apenas um segundo de desaceleração no carregamento do site pode resultar em 1,6 bilhão de queda nas vendas a cada ano.

Você pode dizer: “ok, mas eu não ligo para o Pinterest, a BBC ou a Amazon; fale comigo sobre MEU negócio.'” O Google criou uma ótima ferramenta que calcula o impacto da velocidade na receita potencial . Preenchi a ferramenta com os dados de exemplo: Visitantes mensais médios 1.000.000, taxa de conversão de 3,26%, com valor médio do pedido de US$ 82.

Você pode perguntar: “Tomek, por que você escolheu esses dados: taxa de conversão de 3,26, mas não 1% ou 4%, ou mesmo 10%?” Ok, eu peguei os dados do Statista. De acordo com seus relatórios , o valor médio dos pedidos de compras online nos Estados Unidos no 4º trimestre de 2017 (em dólares americanos) foi de 82. Além disso, a taxa de conversão média foi de 3,26.

Parece que reduzir a velocidade de carregamento da página de 5s para 2,8s pode resultar em US$ 1,97 milhão a mais de receita por ano. Soa bem!

Claro, é apenas uma calculadora. Mas a calculadora é baseada em dados reais. Eu não acho que o Google adiciona alguns zeros no final do valor calculado para torná-lo sério.

2. Pense sempre nos usuários de dispositivos móveis

De acordo com o Statcounter, em fevereiro de 2018, mais de 55% dos usuários estavam se conectando à internet via celular ou tablet – estatísticas impressionantes!

Hoje em dia, se você deseja satisfazer seus usuários móveis, deve:

• verifique se seu site funciona bem em dispositivos móveis (ou seja, se é responsivo)
• tornar o site muito rápido.

Você deve ter em mente que os usuários móveis geralmente têm conexões ruins e usam dispositivos de baixo custo, então cada kilobyte enviado no “fio” realmente importa. Seu site pode funcionar rápido em um computador pessoal, com todos os extras , mas pode ser muito lento em dispositivos móveis. E as chances de você conseguir o primeiro não estão mais a seu favor.

3. Use GTMetrix

Existe uma ótima ferramenta que informa o que você pode melhorar para tornar seu site mais rápido. Você pode auditar qualquer site gratuitamente. Você não precisa ser o proprietário de um site para iniciar uma auditoria (ou seja, eu auditei o Giphy.com). A ferramenta combina dados e dicas do Google PageSpeed ​​Insights e do Yahoo Slow.

Vale a pena acessar https://gtmetrix.com/ e digitar a URL do seu site.

Você pode ver a lista de recomendações sobre como melhorar a velocidade do seu site clicando nas guias “PageSpeed” ou “YSlow”.

Por enquanto, muitas das informações nessas guias podem não ser compreensíveis porque são muito técnicas. Isso é bom. Roma não foi construída em um dia. Eu farei o meu melhor para você começar. Existe uma seção interessante chamada “Waterfall” que mostra exatamente quando os recursos (arquivos JS e CSS, arquivos de imagem) foram baixados e carregados.

Eu recomendo fortemente que você obtenha uma conta GTMetrix (é grátis!). Os usuários registrados podem personalizar o teste e alterar a localização do navegador e do servidor. Além disso, uma vez logado, você pode habilitar a opção “criar vídeo”. A opção de vídeo é ótima. Ele mostra quanto tempo os usuários terão que esperar até que possam ver as alterações visuais em seu site.

Mas não enlouqueça com GTMetrix

Embora o GTMetrix seja uma ótima ferramenta, às vezes suas recomendações podem levá-lo a uma caça ao ganso selvagem. Não há nada de errado com GTMetrix. É só que não existe uma regra de “tamanho único” ao otimizar a velocidade – algo que a GTMetrix está bem ciente:

Por exemplo, a GTMetrix recomenda que você defina o cache do navegador para recursos armazenados no servidor do Google Analytics ou do Facebook. Verdade seja dita, esses recursos estão fora de seu controle – você não pode fazer nada . Os desenvolvedores do Google e do Facebook decidiram que, por qualquer motivo, esses recursos não deveriam ser armazenados em cache por um longo período de tempo.

Claro, existem muitas ferramentas semelhantes ao GTMetrix, como o WebPageTest, (que é muito mais poderoso que o GTMetrix). No entanto, decidi apresentá-lo ao GTMetrix por dois motivos:

1. GTMetrix é mais amigável
2. O WebPageTest não fornece recomendações claras sobre o que fazer.

Gostaria de mencionar outra ferramenta interessante – Google Lighthouse (se você usa o Chrome, já o tem instalado). Kamila Spodymek, da Elephate, escreveu um ótimo artigo sobre Como os SEOs podem se beneficiar das métricas de desempenho do Google Lighthouse . Com certeza uma boa leitura!

4. Use a compactação GZIP

Há uma regra que você deve saber: se um recurso pesa menos, o navegador pode baixá-lo muito mais rápido, o que fará com que o carregamento da página seja mais rápido . Seus usuários móveis realmente se beneficiarão com isso.

Você pode diminuir o tamanho de seus arquivos de texto (como HTML, SVG, CSS e JS) implementando a compactação GZIP. É bastante comum que a compactação GZIP economize 70-80% do tamanho de um recurso, sem perder nenhuma informação. É realmente um grande negócio!

Visite https://checkgzipcompression.com/ para verificar quantos kilobytes você pode salvar (ou já salvou!) implementando o GZIP. No caso do Searchmetrics.com, o GZIP está habilitado (permitiu economizar 83% do tamanho da página). Soa bem!

Tenha cuidado, no entanto! Às vezes, os webmasters cometem um erro e compactam todos os arquivos estáticos, incluindo JPEG, imagens PNG e PDFs. Deixe-me citar a documentação do Yahoo Developer Network : “Arquivos de imagem e PDF não devem ser compactados porque já estão compactados. Tentar gzipá-los não apenas desperdiça CPU, mas pode aumentar o tamanho dos arquivos”.

Se você quiser economizar kilobytes adicionais, também é uma boa ideia reduzir seus arquivos HTML, JS e CSS .

5. Exiba imagens em escala

É um fato que um site irá carregar muito lentamente (especialmente em celulares!) por causa de um grande número de imagens.

Portanto, às vezes pode ser uma boa ideia reduzir o número de imagens. Mas, em vez de limitá-los, recomendo otimizar os existentes . Dizendo isso, as imagens veiculadas para seus usuários devem ser dimensionadas e compactadas (sem perdas ou com perdas).

Primeiro, vamos falar sobre o dimensionamento das imagens. Digamos que haja dez miniaturas de 220×220 por página, mas você carregou imagens de 800×800 para o servidor. Você deve fornecer as imagens já dimensionadas para os usuários ou forçar o navegador a dimensioná-las “on the fly”?

A resposta é fácil. Se você não dimensionar as imagens no lado do servidor, o navegador precisará baixar muito mais kilobytes do que o necessário. Para nada, porque as imagens serão dimensionadas de qualquer maneira. Além disso, é um trabalho adicional para a GPU no lado do cliente. Sem mencionar que a velocidade de carregamento da página sofrerá.

6. Comprima suas imagens

Agora, vamos falar sobre a compactação de imagens. Essa é outra técnica indispensável para a web moderna.

Geralmente, existem dois tipos de compressão de imagem:

• Sem perdas (faz um trabalho muito bom, você pode ter certeza que a qualidade não será prejudicada).

• Com perdas (geralmente deixa uma imagem mais leve, mas, como o nome diz: você perde um pouco da qualidade).

Surge a pergunta: que tipo de compactação é melhor: sem perdas ou com perdas?

• Isso depende da situação. Se o seu site fornece imagens do espaço sideral, todos os detalhes são importantes. Mas se você fizer um blog pessoal, provavelmente ficará bem com a compactação com perdas, mesmo com uma alta taxa de compactação. Eu recomendo que você experimente para ver quais configurações se adaptam melhor ao seu site.

7. Não force seus visitantes móveis a baixar fotos em Full HD!

Os usuários de dispositivos móveis têm telas muito menores e simplesmente não se beneficiarão de suas fotos em HD. Em vez disso, eles ficarão com raiva se você forçá-los a baixar imagens grandes.

Vamos examinar o exemplo de Elephate.com . Temos uma foto bem grande (2600×1463 pixels) dos membros da nossa empresa no topo da nossa página inicial (522kb)

É totalmente bom para desktops – eles podem baixá-lo muito rápido. Mas, para usuários móveis, usamos os parâmetros “srcset” do HTML. Graças à implementação disso, os usuários de dispositivos móveis simplesmente baixam uma imagem muito menor (eles não precisam de uma maior), o que tem um impacto positivo no tempo de carregamento da página.

Os usuários de desktop não sofrerão porque verão a foto em full HD. Mas os usuários móveis realmente se beneficiarão com isso.