Conheça o Core Web Vitals, novo sistema de ranqueamento do Google que mudou significativamente a maneira em que os sites aparecem nas buscas!
Imagine que você está numa loja querendo comprar um produto, mas vê uma fila gigantesca no caixa. O que faz nessa situação? Se boa parte dos clientes vai embora no universo físico, no digital esse comportamento é ainda mais frequente. Não temos mais paciência para esperar enquanto navegamos na internet.
Por isso, o Google passou a dar maior visibilidade para sites e plataformas que oferecem uma experiência melhor aos usuários. O famoso algoritmo, que define quem aparece nas primeiras posições na pesquisa, leva em conta uma série de critérios que foram aprimorados com a criação do Core Web Vitals.
O novo sistema é um conjunto de métricas relacionadas à velocidade, à capacidade de resposta de um site e à sua estabilidade visual. O Core Web Vitals foi anunciado em maio deste ano, mas foi implementado em agosto.
Conhecida como “The Page Experience Ranking Factor”, a atualização mudou a forma como são elencados os sites, colocando a experiência do usuário (UX) como ponto principal para o ranqueamento.
Core Web Vitals
Nesta nova lógica de avaliação, são considerados 3 tópicos: Largest Contentful Paint (LCP), que avalia a velocidade; First Input Delay (FID) focado na interatividade; e Cumulative Layout Shift (CLS), que mede a estabilidade visual.
A seguir, vamos explicar em detalhes o que é cada métrica e como melhorá-las.
LCP
Esse fator calcula o tempo de início do carregamento da página até a renderização do seu maior elemento.
Podemos considerar que até 2,5 segundos temos um bom tempo de LCP; até 4 segundos, o tempo que precisa de melhorias; acima disso, o Google já interpreta que o site tem um LCP ruim.
Como melhorar o LCP
O Largest Contentful Paint é afetado principalmente por um servidor com tempo de resposta lento, Javascript e CSS de bloqueio de renderização e recursos com tempo de carregamento lento.
Por isso, fique atento ao seu serviço de hospedagem. Se for compartilhado, por exemplo, pode afetar negativamente seu LCP. Além disso, é importante:
- otimizar o servidor;
- utilizar CDN para entregar arquivos estáticos;
- utilizar um serviço de cache;
- antecipar conexões de terceiros;
- atrasar o carregamento de scripts de terceiros;
- minificar e adiar JavaScript e CSS que não são críticos para a página.
FID
É uma métrica que mede o tempo entre a primeira interação do usuário com a página (como um clique em um botão de compra) até o momento em que o navegador começa a processar os eventos de resposta.
De acordo com o Google, um FID abaixo de 100 milissegundos é considerado bom, entre 100 e 300 milissegundos é um tempo razoável que exige melhorias, e acima de 300 milissegundos já é considerado ruim.
Como otimizar o FID
Geralmente, temos um First Input Delay lento por execuções pesadas de JavaScript. Portanto, o primeiro passo é otimizar sua página e ver como o JavaScript analisa, compila e executa. Outras orientações que podem trazer melhorias e diminuir este tempo são:
- dividir Javascript pesados em tarefas menores e assíncronas;
- melhorar o tempo de resposta do servidor;
- reduzir o tempo de execução do JavaScript;
CLS
Ajuda a mensurar mudanças inesperadas nas páginas, ou seja, sua estabilidade visual. Assim, as alterações ocorrem sempre que um elemento visível muda de um quadro renderizado para outro.
Portanto, para calcular sua pontuação, o navegador usa como base o tamanho da janela de visualização e o movimento dos elementos. Um CLS abaixo de 0,1 é considerado bom; entre 0,1 e 0,25 é razoável, ainda exige melhorias; e acima de 0,25 é considerado ruim.
Como otimizar o CLS
Em geral, o aumento no Cumulative Layout Shift é causado por recursos como imagens, iFrames e anúncios sem dimensões pré-definidas, conteúdo incluído de forma dinâmica e problemas no carregamento das fontes. Portanto, tome algumas atitudes para evitar problemas, como:
- incluir atributos de width e height para imagens e vídeos;
- reservar espaços para anúncios e conteúdo dinâmico;
- usar uma API de carregamento de fontes pode reduzir seu tempo de carregamento (otimizar o carregamento das fontes melhora seu CLS e seu LCP);
- uso de pop-ups.
Outros pontos importantes para uma boa experiência
Além de cumprir os requisitos do Core Web Vitals é preciso checar outros pontos técnicos para melhorar a experiência do usuário.
Imagens:
- definir o tamanho ideal para imagens;
- realizar a otimização das imagens;
- uso de imagens em formatos modernos, como Webp;
- hospedar imagens em serviços de CDN;
- ativação de recursos de cache;
- usar os recursos de Lazy Load (também conhecido como carregamento preguiçoso).
Fontes:
- diminuição da quantidade de famílias e pesos;
- hospedagem de fontes no próprio servidor ou em um CDN;
- evitar o uso de bibliotecas de ícones como FONTAWESOME ou carregar somente os ícones que serão usados no site.
WordPress:
- desabilitação dos recursos que não estão sendo usados;
- desabilitação dos plug-ins desnecessários;
- eliminação de links quebrados 404;
- compactação de arquivos JS e CSS.
Cache:
- ativação de um plug-in ou serviço de cache mais adequado com o servidor e a versão do WordPress.
Scripts de terceiros:
- otimização dos scripts de terceiros;
- atrasar em alguns segundos o carregamento de scripts de terceiros (Google Analytics, Pixel Facebook, RD Station)
Servidor de hospedagem:
- verificação da possibilidade de trocar para um serviço de hospedagem mais adequado as tecnologias usadas no projeto. Exemplo: para um site em WordPress busque servidores web com mais rápidos com tecnologias mais modernas como Apache2 (HTTP2), Nginx ou LiteSpeed (HTTP3).
Os outros indicadores de experiência de página do Google que devem ser observados são mobile friendly, navegação segura, certificado de segurança (HTTPS).
Como me adaptar para esta atualização?
As mudanças implementadas pelo Google também trouxeram consigo um leque de atualizações em ferramentas de mensuração. Portanto, o Google Search Console já dispõe de novos recursos para observar as métricas. Abaixo, listamos algumas dessas plataformas capazes de analisar os Core Web Vitals:
Quem usa essa ferramenta para SEO agora também conseguirá um relatório desenvolvido para os Core Web Vitals chamado de Métricas Essenciais da Web.
Google PageSpeed Insights
Outra ferramenta tradicional disponibilizada pelo Google, o Google PageSpeed Insights foi atualizada para incluir a demanda dos Core Web Vitals.
Essa plataforma já tem um template voltado exclusivamente aos Core Web Vitals. Para utilizá-lo, basta copiar, conectar sua base de dados e ter acesso a um relatório super completo!
Extensão Web Vitals
A extensão para Chrome Web Vitals faz medição em tempo real, mas resume apenas às novas métricas Largest Contentful Paint, First Input Delay e Cumulative Layout Shift, designadas pelo Google.
Conteúdo continua vital
Quem pensa que o Core Web Vitals vai substituir a forma como o algoritmo do Google trabalha em relação a qualidade de conteúdo está enganado. As melhores informações ainda terão um peso no ranqueamento das páginas, e, no caso de conteúdos similares, ganhará aquele com o melhor Core Web Vitals.
Agora que você conhece o Core Web Vitals é hora de colocar a mão na massa! Se precisar de alguma ajuda, pode contar com a gente.
