Ao conceber um website, a maioria das pessoas concentra-se somente na estrutura do conteúdo e no apelo visual do website. Isto não é mau se não ignorar outros aspetos como a velocidade do seu website ou a popularidade do mesmo (backlinks).
Neste artigo vamos analisar uma das métricas mais importantes que o Google usa para avaliar um website: a sua velocidade de carregamento.
Contents
O que são Core Web Vitals e em que se baseiam
Para avaliar a qualidade do desempenho de um website, a Google criou 3 métricas normalizadas e mais ou menos independentes que lhe permitem avaliar a qualidade da velocidade de descarga do website a partir de diferentes pontos de vista:
- LCP ou Largest Contentful Paint
- FID ou First Input Delay
- CLS ou Cumulative Layout Shift
Porquê criar 3 métricas em vez de uma para medir a velocidade de carregamento? Bem, porque por mais rápido que um website carregue, pode não carregar de forma otimizada (e isto é muito importante para o utilizador).
Vamos estudar estas 3 métricas uma a uma para que compreenda em que consistem e como pode aumentar a qualidade de cada elemento.
LCP (Largest Contentful Paint)
Esse indicador conhecido como “Processamento de imagem com maior conteúdo” é responsável por medir em quanto tempo um website carrega com base no seu maior elemento. O Google regista o tempo de carregamento visual do elemento com maior peso em questão de Bytes.
Este indicador permite aproximar o tempo máximo de carregamento do website. Isto porque, em princípio, quando o elemento mais pesado do website é carregado, os restantes componentes do website já deviam ser exibidos no ecrã. No entanto, como veremos, isso às vezes não ocorre.
- O recomendado pela Google é um tempo de carregamento não superior a 2,5 segundos de LCP para um bom carregamento.
- Uma carregamento com uma pontuação mediana, deve ser inferior a 4 segundos.
- Se a pontuação de velocidade for superior a isso, o Google considera o tempo de carregamento como pobre.
FID (First Input Delay)
A métrica (First Input Delay) realiza a medição da interatividade. Ou seja, mede a rapidez com que o operador interage com a página. Esta métrica mede o tempo de resposta da página, ou seja, quando a página está pronta para que o utilizador realize a primeira interação.
Tal como a métrica anterior, esta mede a resposta visual do conteúdo e não o tempo de carregamento. Por outras palavras: esta métrica avalia a navegabilidade do seu website.
O FID tem três classificações dadas pelo Google:
- a primeira é boa se o carregamento for menor que 100 milisegundos.
- No caso de ser superior a 100 milisegundos e inferior a 300 milisegundos, qualifica-se como “requer melhoramento”.
- No caso de exceder os 300 milissegundos, é considerado um mau desempenho.
CLS (Cumulative Layout Shift)
A métrica (Cumulative Layout Shift) mede as alterações que o website faz enquanto está a carregar. É comum que efeitos Javascript ou CSS adicionados criem esses efeitos no carregamento. O Google pode registá-los e detalhar quanto tempo demoram a completar dentro do website.
Os layout shifts são entendidos como alterações na forma ou tamanho dos elementos da página enquanto a página ainda está a carregar.
Nota: O Google não gosta de layout shifts, pois são prejudiciais para a experiência do utilizador da página.
O Google pode não só registar o tempo que demoram as mudanças, mas também a frequência com que estas ocorrem no seu website.
- O Google avalia este parâmetro e estabelece que até 0,1 é um valor óptimo.
- Caso esteja entre este valor e 0,25, estará num intervalo que precisa de ser melhorado.
- No pior dos casos estará acima de 0,25, neste caso terá uma má classificação. Se for este o caso, é recomendável que reveja o seu website e optimize os efeitos e o conteúdo do mesmo.
Ferramentas para avaliar a velocidade do seu website
Pode utilizar diversas ferramentas para avaliar a velocidade de carregamento do seu website. A mais lógica para qualquer SEO é a Google Search Console, já que (além de ver como o website responde organicamente) desde há algum tempo que tem uma secção integrada que indica quais as páginas do website que são lentas e precisam de ser optimizadas.
Outras ferramentas conhecidas para avaliar a velocidade de um website são:
- PageSpeed Insights, é a ferramenta de análise do próprio Google
- Pingdom Tools
- GTmetrix, outra ferramenta muito recomendada
Considerações básicas para melhorar as métricas do seu website
Existem muitos elementos a considerar no momento de optimizar um website a nível de velocidade de carregamento:
- Ficheiros multimédia que envolvem vídeos, imagens, documentos
- as folhas de estilo
- o número de scripts que são carregados
- o tamanho da base de dados
- a ordem de carregamento de cada um dos elementos anteriores
No entanto, veremos alguns aspetos que pode melhorar sozinho em qualquer WordPress e que podem melhorar muito a velocidade do seu website.
Optimização de imagens
Para a optimização das imagens, a primeira coisa a ter em consideração é o peso recomendado das imagens. Este deve ser entre 50Kb a 200Kb como peso máximo por imagem, embora, na verdade, quanto menor, melhor.
É recomendável usar ferramentas de compressão para reduzir automaticamente o peso da imagem. Algumas das nossas recomendações, no caso do WordPress são:
É provável que diminua um pouco a qualidade da imagem com a compressão, mas as mudanças não serão percetíveis ao olho humano.
Instalar um sistema de cache
Instalar um sistema de cache permite que o website carregue mais rapidamente porque o navegador do utilizador não tem de voltar a descarregar o website inteiro se detetar que não houve alterações desde a última visita.
Por outras palavras, o navegador utilizará os estilos e arquivos que guardou no disco rígido do seu PC em vez de os voltar a descarregar, a menos que haja instruções em contrário.
As nossas recomendações para as caches do WordPress são:
- WP Fastest Cache
- Não oferece um salto de velocidade tão grande como o esperado, mas é muito estável e não entra em conflito com outros plugins.
- Lite Speed Cache
- É um pouco complexo de configurar, mas oferece melhorias muito boas na velocidade de carregamento e é muito estável. Funciona melhor com um servidor dedicado
- WP Super Cache
- Por vezes causa erros 500 em websites e tem de ser desinstalado. Há muito tempo que não o utilizamos em nenhum website.
- W3 Total Cache
- Oferece o melhor desempenho, mas entra em conflito com a Elementor e outros plugins muito facilmente. Não recomendado para uso básico
Os sistemas de cache melhoram a velocidade de carregamento ao poupar tempo e recursos.
Optimização de arquivos CSS e Javascript
É necessário rever os ficheiros CSS e Javascript, não só ao nível do seu tamanho, mas também a nível da ordem em que são descarregados quando a website está a carregar.
Embora possa parecer sem importância, carregar muitas folhas de estilo e ficheiros JS na primeira ordem resultará no facto de o website não ser visível para o utilizador até que esses ficheiros sejam descarregados, o que aos olhos do utilizador parece simplesmente lentidão.
As duas soluções para este problema são a minificação de ficheiros e o carregamento assíncrono dos mesmos.
Esta tarefa parece muito complexa, mas não desespere: na maioria das vezes estas funções são incluídas como opções extra em qualquer plugin de cache (como os listados acima).
Normalmente tudo o que terá de fazer é ativar a opção e verificar se nada se estraga no website. Recomendamos que faça uma cópia de segurança do website antes de fazer qualquer coisa.