O Google anunciou que a implementação da atualização da Experiência da Página agora está concluída. Agora é hora de garantir que o Core Web Vitals do seu site WordPress esteja saudável.
O Core Web Vitals por meio da experiência da página agora é oficialmente um fator de classificação na Pesquisa Google. E, pelo que se sabe, gradualmente terá um grande papel no SERP porque a experiência do usuário é importante.
O Core Web Vitals foi criado para cuidar da experiência do usuário. E o Google dá grande prioridade à experiência do usuário. Se você também se preocupa com a experiência do usuário, não deve apenas otimizar seu site para o Google, mas fazer isso para oferecer uma experiência melhor a seus usuários.
As importantes métricas do Core Web Vitals
Vamos dar uma olhada nas três métricas que constituem os principais elementos vitais da web.
Atraso na primeira entrada (FID): o FID mede quanto tempo leva para um site responder à interação do usuário. Por exemplo, um usuário digita em seu site em um navegador ou um usuário clica em um botão em seu site. Isso é uma interação. Todos podemos concordar que, como usuário, queremos uma interação mais rápida com as páginas da web.
Largest Contentful Paint (LCP): LCP mede quanto tempo leva para carregar a maior imagem ou bloco de texto na parte superior de uma página da web. Observe que ele mede apenas um elemento, uma imagem ou um bloco de texto, dependendo de qual for maior. Todos podemos concordar que ninguém gosta quando as imagens demoram uma eternidade para carregar.
Mudança cumulativa de layout (CLS): o CLS mede as alterações no layout da tela. Por exemplo, se você está lendo um artigo, de repente algo aparece e há uma mudança no layout, e você tem que rolar para baixo ou para cima para encontrar onde estava lendo. Todos podemos concordar que é uma péssima experiência do usuário
3 fatores-chave que afetam Core Web Vitals
Aqui estão alguns fatores bem conhecidos que afetam Core Web Vitals
Anúncios: os anúncios são bons para ganhar dinheiro, mas podem ter uma ou duas coisas a dizer sobre os principais elementos vitais da web. A maioria dos anúncios de redes de anúncios adiciona ativos de terceiros, como imagens e js, ao seu site que você não pode controlar. Na maioria das vezes, esses ativos não são otimizados. E eles podem afetar LCP, FID e CLS.
Tempo de resposta do servidor: quanto mais rápido o servidor responder, melhor. Se a resposta do servidor for lenta, não há como você passar o FID e isso pode afetar todas as outras métricas.
JS e CSS não otimizados: JS e CSS ajudam a tornar os sites atraentes aos olhos. JS ajuda a adicionar funções importantes a sites, como caixa de pesquisa, caixa de inscrição, rolar para o topo e muitos recursos importantes implementados no WordPress. CSS ajuda no estilo, fazendo com que tudo pareça bom, de fontes a cores e muito mais. Mas quando não são otimizados, podem afetar todas as métricas vitais da web principal.
Como passar o Core Web Vitals para sites WordPress
1. Use um host rápido
Como mencionei, o tempo de resposta do servidor também conhecido como Time to First Byte (TTFB) pode afetar todas as métricas vitais da web principal. O principal fator responsável pelo tempo de resposta do servidor é o seu host. As pilhas que eles estão usando são muito importantes.
Embora um tempo de resposta rápido do servidor não garanta que você destruirá os vitais essenciais da web, ele fornece a base certa para isso. Sem a base certa, tudo o mais pode não dar os resultados desejados. Quanto mais rápido, melhor.
Portanto, verifique se o seu host é rápido e se ele está usando uma boa pilha de tecnologia.
2. Use o cache baseado em servidor
Os blogs do WordPress e o WooCommerce são em sua maioria dinâmicos e não estáticos. Isso significa que os itens em um site estão sempre mudando. Como essas mudanças são regulares e, para cada visita, devem ser feitas consultas ao banco de dados e assim por diante, o cache é usado para dar uma sensação estática. O cache de objetos pode melhorar muito as consultas ao banco de dados. E o cache de página pode melhorar a renderização de front-end.
Embora o cache possa acelerar sites WordPress, há um grande problema, é conhecido como taxa de acertos de cache. Quantos usuários estão sendo atendidos via cache?
Os dados do mundo real de vitais essenciais da web são coletados do Chrome User Experience Report (CrUX). E nem todo usuário do Chrome faz parte dele. Apenas aqueles que “optaram por sincronizar seu histórico de navegação, não configuraram uma senha longa de sincronização e têm relatórios de estatísticas de uso habilitados”. Portanto, de 1.000 usuários que visitam seu site por dia, apenas 40 podem ser responsáveis pelos dados do mundo real.
Portanto, é importante ter uma taxa de acertos de cache mais alta. Embora os plug-ins de cache sejam bons, o problema é a taxa de acertos. Usar um cache baseado em servidor oferece uma taxa de acertos de cache significativamente maior. Isso aumenta suas chances de servir conteúdo em cache aos usuários que contribuem para o seu relatório vitals da web central do mundo real. Lembre-se de que os dados do laboratório não contam.
Se o seu host não oferece cache baseado em servidor, você pode usar o Cloudflare para dar ao seu site uma taxa de acertos de cache mais alta.
Geralmente, um cache baseado em servidor é mais eficiente do que o cache baseado em arquivo de plug-in. Principalmente quando você tem muitos usuários simultâneos.
3. Use um tema rápido e leve
O WordPress é open source e possui uma comunidade muito grande. De longe, a maior comunidade de qualquer CMS. Embora isso seja bom, também pode ter um efeito negativo. Por exemplo, há tantas pessoas desenvolvendo produtos para WordPress, produtos como temas para WordPress. E esses desenvolvedores têm experiências e motivações diferentes.
Existem tantos temas mal codificados na comunidade WordPress que estão fortemente inchados. O uso de tais temas pode frustrar seu esforço para acelerar seu site para vitais essenciais da web. Um tema ruim afeta o TTFB e todas as métricas essenciais da web vitals.
Certifique-se de procurar um tema bem codificado que siga todas as práticas recomendadas geralmente aceitas do Google. E é leve, não inchado.
Uma ferramenta como Yellowlab.tools pode ajudá-lo a testar a demonstração de qualquer tema para ver seu desempenho, levando em consideração as melhores práticas existentes.
4. Remova plug-ins desnecessários
Embora os plug-ins não sejam uma coisa ruim, usar plug-ins mal codificados pode fazer mais mal do que bem. Os plug-ins aumentam o número de solicitações quando um usuário visita seu site.
A solução ideal é usar apenas os plug-ins necessários. E também procure o plugin mais leve e bem codificado para cada necessidade. Lembre-se de que a popularidade de um plug-in não significa que seja o melhor para esse fim.
5. Otimize JS
A otimização do JavaScript (JS) melhorará muito todas as métricas vitais da web principal. Se você já testou seu site em ferramentas como PageSpeed Insights ou Web.dev e recebeu um aviso “elimine recursos de bloqueio de renderização”, provavelmente foi causado por JS.
Você pode remover os comentários e espaços em branco para reduzir o tamanho de um arquivo JS. Adiar o carregamento de JS não críticos também ajudará.
Alguns plug-ins podem ajudar a conseguir isso, um exemplo é Autoptimize . Embora recomendemos que você use um cache baseado em servidor, alguns plug-ins de cache têm recursos que podem fazer isso e muito mais. Um exemplo é WP Rocket e WP Fastest Cache. Se você usar um cache baseado em servidor, poderá desligar o recurso de cache e usar os recursos de otimização.
6. Otimize o CSS
“Remover CSS não utilizado” é um conselho muito comum quando você executa seu site por meio do Google PageSpeed Insight.
Quando um usuário visita o seu site, o navegador carrega e executa primeiro todos os CSS referenciados no cabeçalho do seu site antes da renderização. Se houver muitos deles, isso pode desacelerar as coisas.
Alguns plug-ins carregam seu CSS mesmo em páginas desnecessárias.
Você pode gerar CSS crítico para suas páginas, isso eliminará todos os problemas causados por CSS e apenas o CSS crítico será carregado pela primeira vez pelo navegador.
Remover espaços em branco e comentários pode reduzir o tamanho do arquivo. E você pode remover CSS não utilizado de suas páginas com um plugin gratuito como Asset CleanUp.
7. Use um CDN
A internet é global. A menos que você restrinja o acesso ao seu site a uma região específica, obterá usuários de todo o mundo.
Embora seu site possa estar hospedado em seu país e carregar rapidamente lá, você pode ter usuários em países que estão a mais de 10.000 km de distância de você, contribuindo para sua pontuação Vital Core Web.
Usar uma Content Delivery Network (CDN) garante que seu site seja veiculado rapidamente em todo o mundo.
Se você tiver usuários de diferentes partes do mundo, verá uma grande melhoria na velocidade da sua página e também oferecerá uma melhor experiência do usuário.
8. Posicionamento otimizado de anúncios
Anúncios acima da dobra afetarão mais seu LCP e CLS. As imagens nos anúncios podem contar para o LCP do seu site se for maior do que todas as imagens ou blocos de texto acima da dobra. E o problema com as imagens veiculadas no AdSense e em redes de anúncios semelhantes é que você não pode otimizá-las. E eles podem não ser otimizados. Está fora do seu controle.
Se isso não impactar sua receita, considere remover os anúncios acima da dobra, especialmente para dispositivos móveis.
Além disso, o uso de anúncios responsivos acima da dobra afetará o CLS, pois haverá uma mudança de layout quando ele for carregado. Você pode superar isso definindo um atributo de altura mínima para os anúncios. Isso evitará uma mudança de layout.
9. Imagens de carregamento lento
As imagens contribuem para o tamanho da sua página. Quanto maior o tamanho da página, mais tempo leva para carregar.
Imagens de carregamento lento garantirão que as imagens sejam carregadas apenas quando necessário, como resultado, reduzirá o tamanho da página e aumentará o tempo de carregamento.
Você pode ter visto o aviso “adiar imagens fora da tela” nas ferramentas de teste de velocidade. Ele está simplesmente dizendo para você carregar imagens lentamente.
10. Defina o atributo para imagens
O CLS acontece quando há uma mudança de layout. Por exemplo, navegue na sua página inicial e, de repente, uma imagem seja carregada, a página torna-se maior e a parte do site que você estava lendo agora está fora de vista. Essa é uma mudança de layout.
Definir o atributo de tamanho reservará esse tamanho no carregamento da página. Assim, quando a imagem finalmente aparecer, não haverá mudança de layout
11. Otimize sua fonte ou use a fonte do sistema
No LCP, o tempo que leva para seu bloco de texto carregar pode contar. Portanto, se a fonte que você usa demorar muito para renderizar, isso pode afetar seu LCP.
Além disso, fontes de terceiros adicionam solicitações extras.
Experimente e otimize sua fonte de terceiros, como Google Font ou Font Awesome , pré-conectando. Você também pode optar por uma fonte de pilha do sistema que seja nativa do dispositivo do usuário e não faça solicitações externas.
12. Use a pré-busca de DNS
Se você depende de muitos serviços de terceiros para diferentes funções em seu site, deve considerar a pré-busca de seus domínios para reduzir a pesquisa de DNS.
Exemplos de serviços de terceiros comuns são Google Analytics, CDNs, fontes de terceiros, incorporações do Facebook / Twitter / Instagram e assim por diante.
13. Aprenda com os outros
Você pode dar uma olhada nos sites do seu nicho que passaram por pontos vitais essenciais da web e ver o que eles estão fazendo certo. Aprender com os outros faz parte do crescimento. Com o PageSpeed Insight, você pode ver se um site é aprovado ou não.
Não desanime, dê uma olhada nas listas de sites que passam os principais elementos vitais da web para se inspirar. Você pode procurar sites em seu nicho e ver o que eles estão fazendo certo.