A Única Ferramenta que Precisa para Aumentar a Velocidade do Seu Site
aumentar velocidade do site, velocidade site, teste de velocidade site, gtmetrix, teste de velocidade google

A Única Ferramenta que Precisa para Aumentar a Velocidade do Seu Site

A velocidade do seu site tem um impacto direto na sua presença nos motores de busca, e é um dos elementos importantes de SEO.

Os motores de busca “olham” com atenção para a velocidade de carregamento do seu site…

E recompensam mais os sites que carregam rapidamente, mesmo que todas as outras componentes de SEO estejam iguais.

Ou seja, mesmo que o seu site tenha a mesma autoridade de domínio, autoridade de página, e todos os outros fatores de ranking sejam iguais a um site concorrente…

aumentar velocidade do site, velocidade site, teste de velocidade site, gtmetrix, teste de velocidade google

Se o seu site carregar em 5 segundos, e o site concorrente carregar em 1 segundo, o concorrente provavelmente obterá um melhor ranking nos resultados de pesquisa.

Por outro lado, existe o lado humano da questão.

O tempo médio de atenção das pessoas é cada vez mais curto, pelo que se o seu site demorar 5 segundos a carregar, o resultado pode muito bem ser perder um potencial cliente.

Neste artigo vou partilhar consigo uma plataforma que pode usar gratuitamente para analisar a velocidade do seu site, e facilmente identificar as áreas que estarão a ter impacto negativo na velocidade de carregamento.

Existem pequenos ajustes que podem ser facilmente executados, para que o seu site possa carregar rapidamente no browser dos seus visitantes.

Comecemos pela ferramenta essencial para a sua análise:

Ferramenta de Análise de Velocidade de Sites: GTmetrix.com

aumentar velocidade do site, velocidade site, teste de velocidade site, gtmetrix, teste de velocidade google

O GTmetrix é uma ferramenta gratuita (freemium) que lhe permite analisar a velocidade de qualquer página do seu site.

Mas mais importante do que apenas analisar, fornece-lhe também recomendações práticas sobre como optimizar cada detalhe.

Assim que insere o URL da página que deseja analisar, o GTmetrix vai correr a sua página por diferentes análises, sendo as mais importantes a “PageSpeed” e algo chamado “Waterfall”.

A primeira coisa que verá será uma “nota” geral da velocidade da sua página.

Vejamos um exemplo dos resultados de uma página que precisa de optimização:

aumentar velocidade do site, velocidade site, teste de velocidade site, gtmetrix, teste de velocidade google

Neste caso a página teve uma nota de “F” em PageSpeed.

As notas variam entre “A” (a melhor) e a “F” (a pior).

O PageSpeed é uma análise feita à performance “front-end” do seu site (ou seja, aquilo que é carregado no browser dos visitantes)...

Elementos como o código HTML, CSS, JavaScript, e multimédia (imagens, videos, etc).

Muitos destes elementos são facilmente controláveis e ajustáveis, e têm um impacto relevante na velocidade do seu site.

No entanto, a performance “back-end” (servidor e base de dados) não é analisada no GTmetrix, uma vez que é difícil de analisar e estandardizar (existem demasiadas variáveis).

Na imagem acima, repare que a página analisada tem um tempo de carregamento (Fully Loaded Time) de 5.0 segundos, o que é considerável (o ideal será chegar a 1 segundo).

Para além disso, a página tem 14.0MB de tamanho (Total Page Size), o que é tremendamente pesado (o ideal será chegar a 1MB!).

E finalmente, reparamos que faz 78 requests (número de “pedidos” feitos ao servidor por cada elemento da página), sendo que o objetivo aqui é fazer com que haja o menor número de pedidos possível.

Ou seja, este site não foi optimizado para a velocidade e precisa de alguns ajustes.

A primeira coisa a fazer é anotar todas estas métricas, para estabelecer uma linha de análise para comparação futura.

Vejamos agora o que poderá estar a causar estes problemas, olhando para as recomendações mais comuns de PageSpeed:

aumentar velocidade do site, velocidade site, teste de velocidade site, gtmetrix, teste de velocidade google

Serve Scaled Images (reduzir a dimensão das imagens)

A primeira recomendação que encontramos é “Serve scaled images” (com nota “F”), ou seja, reduzir a dimensão das imagens.

O que está a acontecer nesta página é que as imagens estão a ser inseridas na sua dimensão original, e muito provavelmente em dimensões demasiado grandes (como 4032x3024).

Apesar de a dimensão das imagens ser automaticamente ajustada em HTML ou CSS no site, a dimensão original da imagem é carregada sempre que a página abre num browser…

Consequentemente aumentando o tempo de carregamento da página.

Clicando na seta do lado esquerdo da recomendação, conseguirá ver exatamente quais as imagens que estão a afetar a velocidade, e qual a dimensão recomendada.

Enable gzip compression (activar compressão gzip)

A segunda recomendação também com nota “F” é “Enable gzip compression”.

Esta é bastante comum em todos os sites criados em WordPress e é também facilmente resolvida.

Activar a compressão gzip irá reduzir o tamanho dos ficheiros enviados pelo seu servidor, para que possam ser transferidos para o browser mais rapidamente.

E esta é uma alteração muito fácil de fazer no WordPress!

Alguns servidores já vêm com o gzip activado (ou incluem um plugin WordPress, como o A2 Optimized WP que o permite fazer), mas se não for o seu caso existem vários plugins que o permitirão activar facilmente, como o WP Rocket, ou o W3 Total Cache.

Defer parsing of JavaScript (adiar análise do JavaScript)

A terceira recomendação com nota “F” é “Defer parsing of JavaScript”.

Esta é também bastante comum e fácil de corrigir.

Para que uma página carregue, o browser tem que analisar os conteúdos incluídos nos tags de <script>, o que aumenta o tempo de carregamento da página.

Ao minimizar a quantidade de JavaScript necessária para renderizar a página, e ao adiar (“defer”) a análise ("parsing") do JavaScript até que seja necessário ser executado, é possível reduzir o tempo de carregamento inicial.

Para fazer esta alteração, pode usar os mesmos plugins de WordPress referidos acima, configurando a opção de “Minify JS Files”.

​Optimize images (optimizar imagens)

Outra recomendação importante e também bastante comum (mas que no exemplo desta página teve boa nota) é a de “Optimize images”.

Se carregar imagens no seu formato e resolução originais, cada imagem irá ter um tamanho considerável e diminuir a velocidade de carregamento do seu site.

Para diminuir o tempo de carregamento de cada imagem, precisa de optimizar para a web antes de adicionar no seu site.

O ideal será comprimir cada imagem para menos de 100KB de tamanho.

Pode fazer isto usando por exemplo o Photoshop (escolhendo a opção “Export” > “Save for Web”), ou os sites Optimizilla ou Tinypng (ideais para comprimir imagens sem perder qualidade visual).

Corrigindo apenas estas 4 recomendações já daria um salto na velocidade de carregamento do site e, como vê, são correções fáceis de efetuar.

Como Ver os Detalhes de Cada Elemento da Página: "Waterfall Chart" do GTmetrix

aumentar velocidade do site, velocidade site, teste de velocidade site, gtmetrix, teste de velocidade google

A opção de “Waterfall” é onde poderá entrar nos detalhes específicos da página, e descobrir que elementos estão a desacelerar a velocidade de carregamento.

Pode parecer demasiado técnico, mas não se assuste!

É bastante simples e útil.

Tudo o que precisa de fazer é olhar para as barras mais longas.

Estas são basicamente uma representação visual do tempo que cada elemento/tarefa leva a carregar…

E cada linha na tabela representa um elemento/tarefa, estando ordenadas exatamente pela ordem de carregamento da página (a primeira linha é o primeiro elemento a ser carregado no browser).

Portanto, o objetivo aqui é encontrar as barras realmente longas e que superam 1 segundo, e investigar o que é esse elemento e como o corrigir (usando o nosso amigo Google!).

No caso acima podemos ver agora os resultados do meu site.

Vejo por exemplo que tenho um elemento chamado “wp-emoji-release.min.js”

Descubro que se trata de um ficheiro que o WordPress carrega automaticamente, para ajudar a carregar “emojis” (uma característica de blogging do WordPress)...

E que é um script que desacelera o carregamento da minha página.

Como sei que não preciso desse elemento, este é um ganho fácil!

Basta instalar um plugin que é bastante leve, chamado Disable Emojis (ou se preferir, alterar o código no ficheiro functions.PHP do seu tema).

Vejo também que um plugin que tenho instalado “Pinterest Pin-it Button” também demora mais do que 1 segundo a carregar…

Mas neste caso prefiro manter, uma vez que é um plugin importante para a minha estratégia.

Como vê, trata-se de um exercício que tem que fazer individualmente, e os resultados dependerão muito dos plugins que tenha instalado, da sua instalação WordPress, e também da sua estratégia.

Mas esta análise é extremamente útil para perceber exatamente que elemento impacta mais na velocidade da sua página…

E tomar ação!

Usando o seu melhor amigo Google para identificar o elemento, e descobrir a solução.

No entanto, uma recomendação:

Não perca demasiado tempo e energia a analisar a velocidade do seu site.

Mesmo quando corrige um elemento, aparecerá sempre outro que se torna no elemento que leva mais tempo a carregar.

Se entrar nesse caminho, perderá horas e horas desnecessárias, que poderia estar a dedicar ao que realmente interessa:

Criação de conteúdo relevante para a sua audiência!

Veja o vídeo abaixo do Matt Cutts, onde fala sobre a importância da relevância VS velocidade.

O vídeo já tem 8 anos, mas os princípios mantêm-se inalterados:

A velocidade do seu site é importante, mas tendo o essencial alinhado, pouco interessa aumentar 1 milésimo de segundo aqui e outro ali.

Dedique-se a criar valor para a sua audiência consistentemente, e com tempo corrija estes pormenores (eu diria que 3 ou 4 vezes por ano será o suficiente).

Um abraço,

-Tiago “velocidade furiosa” Faria

About the Author Tiago

O Tiago é um especialista em marketing digital que ajuda negócios locais a criar activos online para a vida através de estratégias simples, económicas e automáticas. Depois de 8 anos a trabalhar na Google em Dublin, este blog é o resultado de anos de experimentação e aprendizagem nas áreas de criação de conteúdo, SEO, copywriting e conversões online.

follow me on:

Leave a Comment: