O que é o Core Web Vitals e como melhorá-lo? [2020]

De acordo com o Google, a experiência do usuário é um dos vários (aproximadamente 200) fatores de classificação que eles usam para classificar sites na página de resultados de pesquisa.

Portanto, otimizar para uma melhor experiência do usuário ajuda um site a obter sucesso a longo prazo na Internet. As principais métricas do Web vitals ajudam você a medir a experiência do usuário em seu site e oferecem oportunidades para melhorá-la.

Então, vamos entender o que é e como você pode melhorar sua pontuação e dar ao seu site uma vantagem em relação aos outros.

O que são os principais Web Vitals?

Os principais elementos vitais da web são um conjunto de fatores específicos que são essenciais para fornecer uma experiência de usuário de qualidade na web. Ele é feito de três medidas principais de velocidade de página e interação do usuário: maior pintura de conteúdo, atraso na primeira entrada e mudança de layout cumulativa.

Em outras palavras, os Core Web Vitals são o subconjunto de Web Vitals usados ​​pelos proprietários de sites e todas as ferramentas do Google para medir a experiência do usuário.

Existem vários outros elementos vitais da web, como compatibilidade com dispositivos móveis, navegação segura, HTTPS, sem intersticiais intrusivos, etc., que medem a experiência do usuário em um site. Mas é muito difícil para alguns usuários rastrear todas as métricas de uso de uma vez. É por isso que o Google introduziu o conceito central de web vitals, onde se concentra apenas no carregamento de métricas-chave, interatividade e estabilidade visual .

Você pode acompanhar os principais dados vitais da web do seu site na seção "aprimoramentos" da sua conta do console de pesquisa. Você pode ver a lista de páginas onde a experiência do usuário não é tão boa e também sugere como você pode melhorá-la.

Por que os principais elementos vitais da web são importantes para SEO?

Este ano, o Google anunciou no blog central de pesquisa sobre o sinal de experiência da página.

Anteriormente, o Google considerava vários sinais de experiência de página para classificação, incluindo:

• HTTPS
• Compatível com dispositivos móveis
• Falta de pop-ups intersticiais
• “Navegação segura” (basicamente, não ter malware em sua página)

Mas agora eles adicionaram os principais elementos vitais da web nele. Tem um papel importante nisso. Uma boa experiência de página não substitui o conteúdo relevante. Mas dá-lhe uma vantagem competitiva sobre a página de experiência de página baixa.

Se a qualidade do conteúdo dos dois sites for a mesma, o Google usará o sinal de experiência da página para escolher o vencedor. É por isso que você precisa trabalhar nos principais elementos vitais do seu site.

Mas não se preocupe, você tem tempo para corrigir isso até o próximo ano de 2021. Mas o Google também usa a pontuação de desempenho anterior para classificação. É por isso que você precisa começar a trabalhar nisso.

Neste artigo, vou orientá-lo sobre como você pode melhorar sua pontuação principal do web vitals.

Maior pintura de conteúdo (LCP)

O LCP mede o desempenho de carregamento de um site. Significa quanto tempo o site está demorando para carregar a página completamente.

Ele conta o tempo para carregar a primeira seção visível do site. É por isso que você pode priorizar seus recursos e carregar o conteúdo essencial primeiro.

De acordo com o Google, o LCP não excede 2,5 segundos quando a página começa a carregar.

O LCP é diferente de outras métricas, como Time To First Byte (TTFY) e First Contentful Paint , pois mede o desempenho do mundo real a partir do relatório Chrome UX.

Ele se concentra no tempo para carregar a página para ver o usuário real e começar a interagir com a página da web.

Você pode verificar sua pontuação de LCP no insight de velocidade da página do Google . Ele mostra os dados verificando todo o site e mostra a lista de URLs onde a melhoria precisa ser feita.

Você pode ver a pontuação para celular do meu site, que é de cerca de 60 e isso pode ser melhorado se eu trabalhar no design do meu site para celular. Na área de trabalho, a pontuação do meu site está acima de 90, mas no dispositivo móvel, é apenas 60 devido à grande pintura de conteúdo.

Mas não confie completamente nessa pontuação, pois ela muda ao longo do tempo e, às vezes, solicita a remoção de plug-ins ou scripts essenciais para melhorar o desempenho.

Você também pode ver um alerta sobre a pintura de conteúdo grande no console de pesquisa do Google . (GSC)

O LCP também é dividido em três categorias.

1. Bom
2. Precisa de melhorias
3. Pobre.

Se o seu LCP estiver abaixo de 2,5 s , isso é considerado bom, uma pontuação entre 2,5 s a 4 s é considerada Precisa melhorar e uma pontuação de mais de 4 s é considerada ruim.

Você também pode notar que alcançar um LCP inferior a 2,5 em dispositivos móveis é muito difícil. Sempre tente mantê-lo abaixo de 4 segundos.

Etapas para melhorar a pontuação do LCP:

Configuração de carregamento lento

considere usar o Lazy Loading em seu site. Se você estiver usando o WordPress 5.4 ou superior , o carregamento lento é ativado por padrão nas imagens. Você deve se concentrar nos vídeos de carregamento lento, pois diminui a velocidade das páginas.

Remova quaisquer scripts de terceiros desnecessariamente:

Certifique-se de usar apenas o script necessário e remova todos os scripts de terceiros do seu site. Certifique-se de reduzir o bloqueio do thread principal para cerca de 150 a 160ms.

Atualize a hospedagem na web:

Tente usar uma hospedagem na web melhor e mais confiável de acordo com o tamanho do seu site. Ele desempenha um papel muito importante na velocidade de carregamento do site.

Se você não sabe como escolher a melhor hospedagem na web, então você deve consultar o Guia de Diferentes tipos de hospedagem na web com guia de compra .

Remova elementos de página grandes:

A ferramenta de insights de velocidade da página mostra os elementos de página grandes que você pode remover para melhorar sua pontuação.

Minimizar CSS

Elementos CSS grandes afetam a pontuação LCP de um site. É por isso que você deve minimizar seu código CSS para melhorar o LCP.

Atraso da primeira entrada (FID)

O primeiro atraso de entrada mede o tempo que o usuário leva para interagir com sua página. Isso significa o tempo que um navegador da Web leva para processar sua página da Web e o usuário poderá interagir com a página, como clicar em um link, rolar a página ou inserir detalhes de login etc.

A principal razão para o atraso na interação do usuário são as principais tarefas de script de bloqueio de thread .

É muito importante manter o tempo de FID baixo, pois isso afeta diretamente a experiência do usuário em seu site. O Google definiu a pontuação FID aceitável abaixo de 100 MS .

Para sites como Blogs ou artigos , o FID não importa mais, pois a interação que acontece é a rolagem da página ou Zoom in ou out, inscreva-se em um boletim informativo por e-mail.

Mas para o site onde o login ou inscrição é necessário, o FID desempenha um papel importante nele. Como os usuários precisam digitar os detalhes de login no formulário e quando o site leva muito tempo para aceitar os detalhes, isso cria uma experiência de usuário muito ruim.

O FID também é importante para sites como sites de comércio eletrônico, onde os usuários precisam adicionar o produto ao carrinho e fazer login na conta do usuário. É por isso que você precisa trabalhar para minimizar o Atraso da Primeira Entrada (FID).

Passos para melhorar a pontuação do FID:

Remova scripts de terceiros desnecessários:

Você pode melhorar sua pontuação FID removendo scripts desnecessários (como Google Analytics, mapas de calor, Onesignal, etc.)

Adiar JavaScript:

Se o seu site estiver carregando javascript no início do carregamento da página, será um desafio para os usuários interagirem rapidamente. É por isso que você pode habilitar o javascript Defer usando plugins de cache como WP-Rocket, cache Litespeed, etc.

Ele carregará os arquivos javascript que não são necessários no início do carregamento da página. Isso melhorará significativamente a velocidade geral do seu site.

Ative o cache do navegador:

Ao habilitar o cache do navegador, você economizará muitos recursos do servidor e seu site não solicitará todos os arquivos para visitantes antigos. O navegador carregará alguns arquivos básicos do arquivo de cache e melhorará sua pontuação no FID.

Ativar compactação Gzip

Você pode reduzir o tamanho do arquivo HTML e CSS em até 80% ativando a compactação Gzip. Você pode fazer isso pelo Cloudflare CDN ou pelo seu painel de hospedagem na web.

Mudança de layout cumulativa (CLS)

A mudança cumulativa de layout concentra-se na estabilidade visual geral do seu site. Isso geralmente acontece devido à manipulação do DOM ou à falta de atributos de dimensão para os principais elementos de mídia.

De acordo com o Google CLS deve estar abaixo de 0,1 . Você pode entender melhor como as mudanças de layout cumulativas acontecem no site nos gráficos abaixo.

Etapas para melhorar a pontuação do CLS

Use arquivos de mídia de dimensões de atributo de tamanho definido (vídeo, imagens, GIFs, infográficos, etc.):

Você pode definir um tamanho específico de mídia para que o navegador do usuário saiba quanto espaço esse elemento vai ocupar. Então, isso não mudará depois que a página estiver totalmente carregada.

Espaço reservado para posicionamento do anúncio

Se você estiver usando anúncios automáticos no Adsense, seus anúncios serão exibidos aleatoriamente e, às vezes, ele enviará o conteúdo abaixo para exibir anúncios. É por isso que você precisa reservar algum espaço específico para o posicionamento do anúncio no site.

Adicione novos elementos de interface do usuário abaixo da página da Web:

Se você estiver usando alguns elementos da interface do usuário, como pop-ups, poderá mostrá-los na parte inferior do seu site. Dessa forma, ele não reduzirá o conteúdo e melhorará sua pontuação no CLS.

Conclusão

Os principais sinais vitais da web são alguns dos melhores sinais de experiência do usuário que desenvolvedores e proprietários de sites têm hoje. Se você seguir a diretriz acima corretamente, poderá melhorar facilmente sua velocidade geral e melhorar sua pontuação principal de vitals da web.

Agora é a sua vez.

Qual método você vai tentar primeiro, deixe-me saber na seção de comentários?

Se você gostou deste artigo, compartilhe-o com sua comunidade de blogs nas mídias sociais.