Como o Google considera uma página da Web ideal para um usuário? Como o Google decide qual site vai primeiro na página de resultados do mecanismo de pesquisa (SERP)? Como profissional de marketing digital iniciante, se todas essas perguntas continuarem martelando em sua mente, você está no lugar certo.
Inicialmente, desenvolvedores e designers costumavam ter dificuldade em projetar páginas da web e otimizá-las, pois mal sabiam como a classificação funciona e como o público interagia com as páginas da web (que era um dos principais fatores de classificação).
Isso mudou lentamente após o lançamento de métricas chamadas Core Web Vitals do Google. Essas foram métricas padronizadas lançadas pelo Google para ajudar desenvolvedores e designers a entender a experiência dos usuários no site.
- Quais são os principais indicadores vitais da Web?
- Maior pintura de conteúdo
- Mudança cumulativa de layout
- Primeiro atraso de entrada
- Como medir os Core Web Vitals? Quais são as ferramentas disponíveis?
- Farol do Google
- Insights de velocidade de página
- Google Search Console
- Dicas para melhorar os principais sinais vitais da Web e otimizar o desempenho
- Considerações finais
Quais são os principais indicadores vitais da Web?
Os três principais sinais vitais da web são determinados com base em três aspectos principais da experiência do usuário:
| Carregando | Maior pintura de conteúdo (LCP) |
| Estabilidade visual | Mudança cumulativa de layout (CLS) |
| Interatividade | Primeiro atraso de entrada (FID) |
Vamos explicar o que significam esses três principais sinais vitais da web e vamos usar a página inicial do Google como exemplo.
Quando fomos ao Google HomePage e executamos o teste Lighthouse (a ser discutido mais adiante neste artigo), recebemos os seguintes dados.
Isenção de responsabilidade: a pontuação muda com relação ao tempo e nunca é estática
Vamos ver as três principais métricas que fazem parte dos principais sinais vitais da web.
Maior pintura de conteúdo (LCP)
Essa métrica indica quanto tempo uma imagem, vídeo ou qualquer conteúdo, do maior tamanho, demora quando a página está carregando.
Tomando a página inicial do Google como referência: Leva 1,2 segundos para carregar o LCP da página inicial do Google, o que é uma pontuação muito boa, quando comparada aos benchmarks, o que é excelente se 2,5 segundos ou menos. O motivo é que quanto mais tempo leva para uma página carregar, maiores são as chances de os usuários saírem da página.
- De acordo com o Google Developers, se o seu LCP for <2,5 segundos, você terá um desempenho muito bom
- Se entre 2,5 segundos e 4 segundos, sua página precisa ser melhorada
- Se > 4 segundos, o desempenho é ruim
Se você observar mais de perto os dados do LCP, encontrará uma análise aprofundada, conforme mostrado na imagem.
Agora, vamos passar para a segunda métrica vital da web – Cumulative Layout Shift (CLS)
Mudança cumulativa de layout (CLS)
Essa métrica indica a instabilidade do site. Quanto menor a pontuação indica melhor estabilidade do site. Por exemplo, você teria encontrado sites cujos layouts continuam mudando conforme você os percorre, e é um aspecto irritante de se lidar.
Para a página inicial do Google que auditamos, a pontuação CLS foi de 0,065 segundos, uma pontuação excelente. Isso porque quanto menor o salto do bloco de conteúdo quando o usuário rola, melhor a experiência do usuário no site.
- De acordo com o Google Developers, se o seu CLS for <1 segundo, você terá um desempenho muito bom
- Se estiver entre 0,1 e 0,25 segundos, sua página precisa ser melhorada
- Se >2,5 segundos, o desempenho é ruim
As pontuações ideais de desempenho do CLS, conforme publicadas no site oficial do Google Developers, são as seguintes:
Primeiro atraso de entrada (FID)
A métrica mede o tempo que o navegador da web leva para responder à primeira interação do usuário. Ele mostra a capacidade de resposta da página da Web à interação do usuário. E quanto mais rápida a interação, melhor a experiência do usuário. Porque, no final das contas, ninguém gosta de uma página lenta e sem resposta.
Pontuações ideais de desempenho do FID, conforme publicado no site oficial do Google Developers
- De acordo com o Google Developers, se o seu FID for <100 milissegundos, você terá um desempenho muito bom
- Se estiver entre 100 e 300 milissegundos, sua página precisa ser melhorada
- Se >300 milissegundos, o desempenho é ruim
Just in: Além disso, há uma conversa sobre uma nova métrica de capacidade de resposta que será introduzida, que supostamente substituirá o primeiro atraso de entrada.
Como medir os Core Web Vitals? Quais são as ferramentas disponíveis?
Farol do Google (meu favorito pessoal)
A ferramenta que usamos para medir os principais sinais vitais da web acima foi o Lighthouse, disponível gratuitamente em seu navegador Chrome. E se você for um desenvolvedor/designer, esta ferramenta oferece insights mais profundos sobre essas métricas no nível de base. Sua funcionalidade supera as outras ferramentas e você deve verificar isso.
Insights de velocidade de página
Esta é uma ferramenta muito fácil de entender. A ferramenta possui módulos que podem auxiliar no diagnóstico e fornecer insights sobre onde melhorias podem ser feitas.
Google Search Console
A ferramenta fornece informações sobre o desempenho da URL e ajuda a identificar as páginas que precisam ser melhoradas. A principal diferença entre esta ferramenta e as outras é que o Search Console fornece dados de campo, enquanto as outras ferramentas fornecem dados de laboratório. E quando se trata do mundo real, os dados de campo são mais relevantes do que os dados de laboratório.
Agora que você tem uma boa compreensão dos principais sinais vitais da web e como eles podem ser úteis para o seu site, é hora de verificar se o desempenho do seu site está de acordo com os benchmarks.
Dicas para melhorar os principais sinais vitais da Web e otimizar o desempenho
Para desenvolvedores/proprietários de sites que procuram técnicas para aumentar o desempenho da página para corresponder aos principais fatores de classificação do Google, aqui estão algumas para começar.
- Acelere o tempo de carregamento dos recursos visuais pré-carregando os principais recursos
Isso se refere ao primeiro núcleo vital da web – a maior pintura de conteúdo (LCP). Primeiro, você deve identificar qual é o elemento LCP da página. A próxima etapa é garantir que o LCP carregue mais rapidamente, incorporando métodos como pré-carregamento para ajudar o navegador a buscar esses recursos – os elementos LCP como primeira prioridade.
- Minimizando Tarefas Longas
Essa técnica pertence ao segundo núcleo vital da rede – primeiro atraso de entrada (FID). Imagine clicar em um item acionável e esperar eternamente que ele carregue. Nem eu nem você temos paciência para esperar tanto.
O principal fator que contribui para esse problema são as Tarefas Longas. Estes são trechos de código Javascript que bloqueiam o thread principal e fazem com que a página pare de responder e congele. Embora a correção varie dependendo dos fatores que contribuem para os bloqueios, a solução comum é dividir o código e servir os scripts em seções menores.
- Reservando espaço para imagens e incorporações
A terceira técnica pertence ao terceiro vital da web – Deslocamento Cumulativo de Layout (CLS). Um dos principais fatores que fazem com que essa pontuação caia é um UX mal projetado – não alocar espaços reservados para imagens e fontes incorporadas. Portanto, ao projetar a UX/UI da página, certifique-se de que os espaços sejam reservados para imagens e outros recursos na página.
- Páginas da web compatíveis com dispositivos móveis
Mais de 50% do conteúdo online é visualizado por meio de dispositivos móveis. Portanto, é absolutamente necessário tornar as páginas do seu site compatíveis com dispositivos móveis.
Você pode verificar se o site é compatível com dispositivos móveis monitorando a seção Relatório de Usabilidade Móvel disponível no Google Search Console (anteriormente conhecido como Google Webmaster).
Outra opção para descobrir a pontuação de usabilidade em dispositivos móveis é executar os principais modelos de página por meio do teste de compatibilidade com dispositivos móveis do Google.
- Garanta a criptografia HTTPS para o seu site
A ausência de conexões HTTP seguras possui riscos e vulnerabilidades para os usuários e seus dados. Portanto, ter uma segurança HTTPS (Hypertext Transfer Protocol Secure) incorporada às páginas da web é uma forma de sinalizar ao Google que seu site é seguro para os usuários.
- Garanta a segurança do site
A segurança do site desempenha um papel importante na determinação da experiência na página. O Google garante que todos os sites presentes na SERP sejam seguros para os usuários e penalizaria sites que não adotassem práticas de segurança adequadas.
Problemas de segurança relacionados a phishing, software indesejado, malware e conteúdo enganoso são fatores que o Google considera prejudiciais, e é preciso garantir que seus sites não possuam nenhum deles. Um método muito simples para auditar a segurança do seu site é dar uma olhada no relatório de problemas de segurança do Google Search Console, que pode ser encontrado em Segurança e ações manuais.