Principais Métricas da Web: Por que o JAMstack pode ser a chave

As Principais Métricas da Web- chamadas de Core Web Vitals em inglês- são três novas métricas que irão ser incluídas no novo algoritmo experiência de página da Google, que começará ser implementado em Junho de 2021. Estes novos fatores irão ter um impacto na forma em como os resultados de pesquisa se posicionam, por isso entender estes fatores é crucial para os seus esforços de SEO.

Tips and inspiration

6 min read

JAMstack e as principais métricas da web

Equipa de Conteúdo da Cobiro

Neste artigo iremos explicar o que são as métricas, como medir a sua pontuação e como os sites JAMstack são ideais para alcançar e exceder os novos parâmetros.

O novo algoritmo de experiência de página do Google

O objetivo principal do Google é servir as pessoas, e uma das maneiras de como a Google faz isto é ao observar o quão boa é a experiência de usuário no seu site. Páginas web que respondem ao que o usuário tenta fazer, na forma mais eficiente possível, são mais prováveis de se posicionarem mais acima do que as restantes.

Com uma implementação gradual a partir de Junho de 2021, o Google irá começar a combinar alguns dos seus sinais de pesquisa existentes com as suas novas Principais Métricas da Web (Core Web Vitals em inglês), que juntos constituem o algoritmo de experiência de página. A atualização é esperada para estar pronta no fim de agosto.

Os sinais de pesquisa existentes incluem coisas como adaptação para dispositivos móveis, pesquisa segura e conexão estável, que pode ler mais acerca no nosso artigo sobre experiência de página. Neste blog vamos focar-nos nas novas Principais Métricas da Web.

Principais Métricas da Web

Divididas em três medidas específicas, as Principais Métricas da Web são um conjunto de fatores que o Google considera importantes para a experiência geral de usuário numa página web.

Estas vão mais a fundo do que nunca antes, ao medir problemas tais como tempos de carregamento, interatividade e estabilidade - todos estes tendo um impacto significativo em como um usuário interpreta e interage com uma página web.

1. Largest Contentful Paint (LCP)

Em português, a maior exibição de conteúdo. Esta é a medida do tempo que demora a carregar a maior peça do conteúdo na sua página. 

O Google olha para a maior imagem ou bloco de texto numa página e calcula o tempo de renderização (quando está totalmente carregado e visível) relativo a quando a página começou a carregar. Quanto mais tempo os usuários têm de esperar, pior é a experiência de usar esse website.

O ideal: um tempo de carregamento de 2.5 segundos ou menos. 

2. First Input Delay (FID)

Em português, a latência na primeira entrada. Esta é a medida de quanto tempo demora para a sua página se tornar interativa e responsiva.

O Google calcula o tempo que demora desde quando o usuário primeiro interage com a sua página (ao clicar num link, num botão ou ao submeter um formulário) até ao momento em que o browser é capaz de responder a essa interação.

O ideal: um atraso de input de menos do que 100 milissegundos. 

3. Cumulative Layout Shift (CLS)

Em português, a mudança de layout cumulativa. Esta é a medida de quão frequentemente movimentos inesperados ocorrem na sua página.

Elementos, tais como anúncios de terceiros ou imagens sem dimensões que se movem quando o usuário está a ver a página podem contribuir para uma experiência de página negativa. O Google olha para o espaço que um elemento ocupa e quanto é que move no ecrã para determinar a pontuação CLS.

O ideal: uma pontuação de menos que 0.1.

Como medir as Principais Métricas da Web do seu website

Com as Principais Métricas da Web a ocupar a maior parte da pontuação da sua experiência de página, vale a pena fazer uma análise ao seu site e tomar medidas para o otimizar antes da atualização.

Existem várias ferramentas, mas o PageSpeed Insights do Google é um bom sítio por onde começar. 

Insira o URL completo de uma das suas páginas para iniciar. Assim que clicar em "analisar" a sua pontuação irá aparecer. Note- no topo da página pode alternar entre as versões móveis e de computador.

A pontuação geral da sua página é numa escala de 100. Abaixo de 50 (vermelho) é considerado fraco, entre 50 e 89 (laranja) precisa de melhoria e de 90 a 100 (verde) é bom.

Cada área é explicada, com recomendações sobre o que é preciso para alcançar um melhor resultado.

Melhore a sua pontuação nas principais métricas da web com um site JAMstack

Fazer as melhorias necessárias no seu website pode ser complexo e demorado, mas passar para uma abordagem JAMstack pode tornar este processo muito mais simples.

Vamos ver melhor o que é JAMstack e como ultrapassar os problemas que levam a uma pontuação baixa nos Core Web Vitals. 

O que é JAMstack?

JAMstack é uma abordagem moderna à criação de websites. Não é uma linguagem de programação nem uma ferramenta, mas sim uma arquitetura que permite criar sites rápidos e fáceis de usar.

É um acrónimo que significa JavaScript, Application Programming Interfaces (APIs), e Markup. Cada componente é separado para que sejam mais fáceis de trabalhar com. Isto é denominado de “decoupling”. Mas eles interagem juntos para entregar o resultado final (o tal “stack”).

CDNs

Com um site JAMstack, o conteúdo é gerado sobre a forma de ficheiros de um servidor de origem de um site, que é depois cacheado e entregue através de uma content delivery network (CDN)- uma network global de servidores.

Esta network trabalha junta para reduzir a distância que o conteúdo de um website tem de viajar antes de chegar ao usuário final. Portanto, se um utilizador nos EUA aceder ao seu website com base em Portugal, o conteúdo irá ser entregue a partir do servidor mais próximo de onde esse utilizador está baseado, em vez de ter de viajar até ao servidor de origem do website em Portugal.

Leia mais sobre JAMstack no nosso guia completo..

Em prática

Vamos escolher três desafios relacionados com uma fraca experiência de usuário e investigar como os sites JAMstack estão configurados para ultrapassar estes desafios.

Challenge #1: Conteúdo demora a carregar

Solução: faça um upgrade das suas capacidades de hospedagem web. Com um site JAMstack, não precisa de depender num único host para distribuir todo o seu conteúdo. Porque as páginas são geradas a partir do servidor mais próximo da CDN, a distância que os dados têm de viajar é menor. Isto significa que as páginas são incrivelmente rápidas, frequentemente carregando em menos de um segundo.

Challenge #2: Imagens e outros elementos só carregam ao descer na página

Solução: gerar conteúdo com antecedência para não abrandar uma página web.  Com um site JAMstack, o conteúdo é gerado sob a forma de ficheiros, que são depois armazenados como cópias na network CDN. Isto significa que quando uma página web está a carregar, as imagens e elementos estão imediatamente disponíveis e prontos a aparecer na página.

Challenge #3: Funcionalidades dinâmicas têm um impacto na velocidade

Solução: mova as funcionalidades dinâmicas do seu website para o lado do cliente (o computador do utilizador). Sites JAMstack usam APIs para comunicar com os ficheiros JavaScript pré-renderizados para facilitar informação dinâmica. Portanto, cada vez que uma tarefa interativa é requerida (como completar um formulário), pode ser feita o mais próximo possível de onde o utilizador está, tornando-a super responsiva.

Isto são apenas alguns exemplos, mas você irá notar um tema comum: o poder dos CDNs e a sua habilidade de ultrapassar os desafios tradicionais que levam a um desempenho de website frustrante.

Como começar 

Torne o seu website existente numa solução JAMstack

Tem um site estático mas quer hospedá-lo via um CDN? Deixe a Cobiro tratar de todas as suas necessidades de hosting e transforme o seu site numa solução JAMstack ultrarrápida.

A conexão GitHub (beta) da Cobiro fornece um link contínuo entre o seu headless CMS, o seu gerador de site estático e o seu host CDN.

Assim que enviado, o conteúdo do seu site será entregue via o CDN Cloudfare, que trata dos pedidos na internet de 16% das empresas Fortune 1000 e serve 20 milhões de pedidos HTTP por segundo, em média.

De código a JAMstack em seis passos

1. Escolha o seu headless CMS (por exemplo Dato CMS, Contentful or Agility)
2. Use um gerador de site para criar o seu site estático
3. Envie o seu código para um Git Repository no GitHub
4. Inicie uma sessão na plataforma Cobiro e selecione a conexão GitHub
5. Encontre o seu código e clique em “reconstruir”
6. O seu website é agora hospedado via CDN Cloudfare

Em breve: CDN hosting estará disponível em todos os nossos planos pagos, que começam a partir de apenas 19$ por mês. Saiba mais.

Crie um site JAMstack de raíz

O criador de sites Cobiro é o único criador de sites gratuito no mercado que usa a abordagem JAMstack. Não requer codificação, instalações nem plug-ins.

Quando estiver pronto a lançar o seu site, este será rápido e seguro desde o ínicio.

Simplicidade

Use a ferramenta de arrastar-e-largar e escolha de entre uma variedade de elementos e designs.

À base de CDN

Impulsione a velocidade e o desempenho do seu website ao distribuí-lo via um CDN.

Integração de Marketing

Escolha as suas aplicações preferidas e acesse-as através da plataforma.

Certificado SSL grátis

Proteja a informação confidencial dos seus clientes ao adotar um padrão de excelência na segurança do seu website.

Registo de domínio 

Obtenha um domínio profissional. Escolha uma extensão Cobiro grátis ou compre uma.

Experimente o criador de sites Cobiro gratuitamente!

Ludzie też czytają

What is jamstack
What is JAMstack? Your complete guide

Tips and inspiration

6 min read

Illustration of a person holding a tablet with lots of ideas
How to structure the perfect website

Tips and inspiration

3 min read

Zacznij za darmo już dziś!

Zacznij za darmo już dziś!

Zaczynaj
Zacznij za darmo już dziś!