{"id":2403,"date":"2024-02-16T15:00:00","date_gmt":"2024-02-16T18:00:00","guid":{"rendered":"https:\/\/liveseo.com.br\/core-web-vitals\/"},"modified":"2024-04-08T10:13:14","modified_gmt":"2024-04-08T13:13:14","slug":"core-web-vitals","status":"publish","type":"post","link":"https:\/\/liveseo.com.br\/seo\/core-web-vitals\/","title":{"rendered":"Core Web Vitals: um guia completo dos indicadores"},"content":{"rendered":"\r\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\r\n<p><em>Otimizar a qualidade da experi\u00eancia do usu\u00e1rio \u00e9 fundamental para o sucesso a longo prazo de qualquer site. N\u00e3o importa se voc\u00ea \u00e9 propriet\u00e1rio de uma empresa, profissional de marketing ou desenvolvedor, o Web vitals pode ajudar a quantificar a experi\u00eancia no seu site e identificar oportunidades de melhoria.<\/em><\/p>\r\n\r\n\r\n\r\n<p><a href=\"https:\/\/web.dev\/articles\/vitals?hl=pt-br\" target=\"_blank\" rel=\"noreferrer noopener\">Google via Web.Dev sobre o Web Vitals<\/a><\/p>\r\n<\/blockquote>\r\n\r\n\r\n\r\n<p>Em Maio de 2020, o Google comunicou oficialmente a inclus\u00e3o dos indicadores de Page Experience como um fator de classifica\u00e7\u00e3o na p\u00e1gina de resultados. O principal objetivo das atualiza\u00e7\u00f5es \u00e9 continuar garantindo que as pessoas encontrem resultados \u00fateis e tenham uma experi\u00eancia agrad\u00e1vel em suas buscas.<\/p>\r\n\r\n\r\n\r\n<p>As m\u00e9tricas do Core Web Vitals est\u00e3o dentro desses par\u00e2metros anunciados como influenciadores do ranqueamento. <strong>Elas t\u00eam tr\u00eas principais indicadores: o LCP, o CLS e o FID<\/strong>. Cada um deles tratam de um aspecto da experi\u00eancia do usu\u00e1rio em um site, como a velocidade de carregamento da p\u00e1gina ou a estabilidade do layout.<\/p>\r\n\r\n\r\n\r\n<p>Eu sou Isabela Bezerra, Especialista SEO, e hoje irei te guiar por uma viagem para conhecer as m\u00e9tricas do CWV, como elas impactam nas otimiza\u00e7\u00f5es para ranqueamento org\u00e2nico e ainda te contar sobre algumas das principais tarefas para melhorar esses indicadores.<\/p>\r\n\r\n\r\n\r\n<p>Pronto para partir? Aperte os cintos e vamos l\u00e1 em 3,2,1&#8230; J\u00e1!<\/p>\r\n\r\n\r\n\r\n<h2 class=\"wp-block-heading\">Core Web Vitals e Page Experience: entenda a rela\u00e7\u00e3o!<\/h2>\r\n\r\n\r\n\r\n<p>Os fatores da atualiza\u00e7\u00e3o do Page Experience nada mais s\u00e3o do que uma forma de garantir que o usu\u00e1rio est\u00e1 tendo uma boa experi\u00eancia de navega\u00e7\u00e3o \u2013 algo que est\u00e1 intrinsecamente ligado \u00e0 <a href=\"https:\/\/www.google.com\/intl\/pt-BR\/search\/howsearchworks\/mission\/#:~:text=A%20miss%C3%A3o%20da%20nossa%20empresa,de%20informa%C3%A7%C3%B5es%20de%20v%C3%A1rias%20fontes.\" target=\"_blank\" rel=\"noreferrer noopener\">miss\u00e3o do Google<\/a>.\u00a0<\/p>\r\n\r\n\r\n\r\n<p>Entre os crit\u00e9rios a serem considerados pelo update est\u00e3o as m\u00e9tricas do Core Web Vitals e diversos outros pontos da Experi\u00eancia do Usu\u00e1rio, por exemplo:\u00a0<\/p>\r\n\r\n\r\n\r\n<ul>\r\n<li>otimiza\u00e7\u00e3o para mobile;<\/li>\r\n\r\n\r\n\r\n<li>seguran\u00e7a de navega\u00e7\u00e3o<\/li>\r\n\r\n\r\n\r\n<li>protocolo HTTPS;<\/li>\r\n\r\n\r\n\r\n<li>cumprimento das regras contra an\u00fancios\/banners invasivos.<\/li>\r\n<\/ul>\r\n\r\n\r\n\r\n<p>Ou seja, podemos considerar<strong> o Core Web Vitals como uma parte important\u00edssima do grande guarda-chuva que \u00e9 a atualiza\u00e7\u00e3o do Page Experience<\/strong>, um conjunto de m\u00e9tricas, crit\u00e9rios que ser\u00e3o avaliados e levados em conta na hora da classifica\u00e7\u00e3o!<\/p>\r\n\r\n\r\n\r\n<p>Se voc\u00ea quiser entender mais sobre<a href=\"https:\/\/liveseo.com.br\/seo\/atualizacoes-do-algoritmo-do-google\/\" target=\"_blank\" rel=\"noreferrer noopener\"> todas as atualiza\u00e7\u00f5es do algoritmo do Google<\/a>, temos um conte\u00fado super completo contando todos os marcos que moldaram o buscador para ser cada vez mais assertivo.<\/p>\r\n\r\n\r\n\r\n<h2 class=\"wp-block-heading\">Core Web Vitals: o que s\u00e3o? Como ir\u00e3o impactar no SEO?<\/h2>\r\n\r\n\r\n\r\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\r\n<p><em>Recomendamos que os propriet\u00e1rios de sites alcancem as m\u00e9tricas do Core Web Vitals para ter bons resultados com a Pesquisa e garantir uma \u00f3tima experi\u00eancia do usu\u00e1rio em geral.<\/em><\/p>\r\n\r\n\r\n\r\n<p><a href=\"https:\/\/developers.google.com\/search\/docs\/appearance\/core-web-vitals?hl=pt-br\" target=\"_blank\" rel=\"noreferrer noopener\">Developers Google sobre Core Web Vitals<\/a><\/p>\r\n<\/blockquote>\r\n\r\n\r\n\r\n<p>O Core Web Vitals \u00e9 um conjunto de diretrizes que avaliam<strong> a velocidade de carregamento, experi\u00eancia do usu\u00e1rio e estabilidade visual de uma p\u00e1gina<\/strong>. Ou seja, essas m\u00e9tricas indicam se o seu site possui uma estrutura otimizada e que gera uma navegabilidade agrad\u00e1vel para seus leitores.<\/p>\r\n\r\n\r\n\r\n<p>Podemos utilizar o Web Vitals para mensurar a entrega do nosso site de acordo com as expectativas do Google.\u00a0Ele tamb\u00e9m serve de direcionamento para entendermos quais as otimiza\u00e7\u00f5es que devemos realizar para melhorar o ranqueamento org\u00e2nico do dom\u00ednio \u2014 o que \u00e9 o objetivo do SEO.<\/p>\r\n\r\n\r\n\r\n<p>Segundo um <a href=\"https:\/\/blog.chromium.org\/2020\/05\/the-science-behind-web-vitals.html\" target=\"_blank\" rel=\"noreferrer noopener\">estudo realizado pelo Chromium Blog<\/a>, ao seguir as diretrizes do Core Web Vitals seu site possui 24% a menos de chances de perder usu\u00e1rios durante o carregamento da p\u00e1gina.<\/p>\r\n\r\n\r\n\r\n<p>E para te ajudar a entender quais s\u00e3o as m\u00e9tricas do CWV e os n\u00fameros considerados bons para a experi\u00eancia do usu\u00e1rio na p\u00e1gina, vamos ver cada um deles isoladamente:\u00a0<\/p>\r\n\r\n\r\n\r\n<h3 class=\"wp-block-heading\">Largest Content Paint (LCP)<\/h3>\r\n\r\n\r\n\r\n<p>O LCP \u00e9 uma m\u00e9trica utilizada para medir o tempo que os maiores conte\u00fados visuais da p\u00e1gina demoram para serem exibidos para o usu\u00e1rio. Ou seja, ele indica o momento exato em que o maior item do conte\u00fado \u00e9 totalmente carregado, sem que o usu\u00e1rio precise rolar o scroll. Aqui estamos falando de imagens, textos ou v\u00eddeos.\u00a0<\/p>\r\n\r\n\r\n\r\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\r\n<p><em>O tamanho do elemento informado para a Maior exibi\u00e7\u00e3o de conte\u00fado normalmente \u00e9 o tamanho vis\u00edvel para o usu\u00e1rio na janela de visualiza\u00e7\u00e3o. Se o elemento se estender para fora da janela de visualiza\u00e7\u00e3o ou se algum elemento for recortado ou tiver overflow n\u00e3o vis\u00edvel, essas partes n\u00e3o ser\u00e3o contabilizadas no tamanho do elemento.<\/em><\/p>\r\n\r\n\r\n\r\n<p><a href=\"https:\/\/web.dev\/articles\/lcp?hl=pt-br\" target=\"_blank\" rel=\"noreferrer noopener\">Google via Web.Dev sobre LCP<\/a><\/p>\r\n<\/blockquote>\r\n\r\n\r\n\r\n<p>Segundo Google, <strong>para que o usu\u00e1rio tenha uma boa experi\u00eancia de navega\u00e7\u00e3o, o LCP deve ser de at\u00e9 2,5 segundos<\/strong>. E por mais que 3s ou 3,5s n\u00e3o representem um tempo t\u00e3o consider\u00e1vel, \u00e9 importante lembrar que durante nossa jornada na internet nos acostumamos a ter respostas r\u00e1pidas, ent\u00e3o, at\u00e9 mesmo meio segundo ou um segundo a mais fazem a diferen\u00e7a para o usu\u00e1rio decidir ficar ou n\u00e3o na p\u00e1gina.<\/p>\r\n\r\n\r\n\r\n<p>Em nosso blog, temos um excelente conte\u00fado para voc\u00ea que deseja <a href=\"https:\/\/liveseo.com.br\/videos-de-seo\/seo-para-imagens\/\" target=\"_blank\" rel=\"noreferrer noopener\">otimizar as imagens<\/a> do seu site de acordo com as boas pr\u00e1ticas indicadas pelo Google.\u00a0<\/p>\r\n\r\n\r\n\r\n<h4 class=\"wp-block-heading\">Causas comuns de um LCP ruim<\/h4>\r\n\r\n\r\n\r\n<p>H\u00e1 uma s\u00e9rie de fatores que podem interferir na performance do site nesse sentido. Vejamos:\u00a0<\/p>\r\n\r\n\r\n\r\n<ul>\r\n<li>Baixo tempo de resposta do servidor (<em>slow server response<\/em> time);<\/li>\r\n\r\n\r\n\r\n<li>Bloqueio da renderiza\u00e7\u00e3o por JavaScript ou CSS (Render-Blocking JavaScript and CSS);<\/li>\r\n\r\n\r\n\r\n<li>Tempo de carregamento lento dos recursos (slows Resource load times);<\/li>\r\n\r\n\r\n\r\n<li>Renderiza\u00e7\u00e3o do lado do cliente (client-side Rendering).<\/li>\r\n<\/ul>\r\n\r\n\r\n\r\n<h3 class=\"wp-block-heading\">Cumulative Layout Shift (CLS)<\/h3>\r\n\r\n\r\n\r\n<p>Sabe quando voc\u00ea vai clicar em um bot\u00e3o no site e a\u00ed, do nada, aparece outro bot\u00e3o acima dele e o muda de lugar na p\u00e1gina te fazendo clicar no local em que n\u00e3o queria? \u00c9 isso que o CLS indica.<\/p>\r\n\r\n\r\n\r\n<p><a href=\"https:\/\/liveseo.com.br\/seo\/cumulative-layout-shift-cls\/\" target=\"_blank\" rel=\"noreferrer noopener\">O CLS \u00e9 o indicador que calcula a estabilidade do layout da p\u00e1gina durante o carregamento<\/a>. Ter um bom resultado CLS significa que seu usu\u00e1rio n\u00e3o passar\u00e1 por problemas como clicar em um elemento indesejado dentro do seu site pois o layout mudou de forma\u00e7\u00e3o enquanto ele realizava o clique.\u00a0<\/p>\r\n\r\n\r\n\r\n<p>Vale lembrar, portanto, que <strong>essa m\u00e9trica n\u00e3o \u00e9 relacionada ao tempo, mas sim a frequ\u00eancia e intensidade das mudan\u00e7as na p\u00e1gina<\/strong>. De acordo com os canais oficiais, conforme as altera\u00e7\u00f5es v\u00e3o acontecendo, novos valores s\u00e3o adicionados \u00e0 pontua\u00e7\u00e3o, tornando-a mais alta. Quando o upload \u00e9 conclu\u00eddo, o valor total \u00e9 adicionado \u00e0 sua pontua\u00e7\u00e3o CLS.\u00a0<\/p>\r\n\r\n\r\n\r\n<p>Segundo os documentos do Google sobre Core Web Vitals, o valor indicado como o CLS de seu site ser\u00e1 o que aparecer em pelo menos 75% das visitas no URL em quest\u00e3o. Podemos considerar um bom CLS aquele que tem valor menor que 0,1.<\/p>\r\n\r\n\r\n\r\n<h4 class=\"wp-block-heading\">C\u00e1lculo do CLS<\/h4>\r\n\r\n\r\n\r\n<p>Para calcular essa pontua\u00e7\u00e3o, o navegador leva em considera\u00e7\u00e3o o tamanho da janela de visualiza\u00e7\u00e3o do conte\u00fado e o movimento dos elementos inst\u00e1veis na janela entre dois quadros renderizados. A pontua\u00e7\u00e3o \u00e9 um produto de duas medidas desse movimento: a fra\u00e7\u00e3o de impacto e a fra\u00e7\u00e3o de dist\u00e2ncia. Nos <a href=\"https:\/\/web.dev\/articles\/cls?hl=pt-br\" target=\"_blank\" rel=\"noreferrer noopener\">canais oficiais do Google sobre o CLS<\/a> voc\u00ea encontra explica\u00e7\u00f5es aprofundadas do c\u00e1lculo.\u00a0<\/p>\r\n<p><img fetchpriority=\"high\" decoding=\"async\" class=\"alignnone wp-image-4324 size-large\" src=\"https:\/\/liveseo.com.br\/wp-content\/uploads\/2024\/02\/4f9547363dc308748b100edafae91063_CausascomunsdeumCLSruim-1024x576.webp\" alt=\"Texto posicionado na parte esquerda da foto com bullet point com uma ilusta\u00e7\u00e3o de computador e um celular na direita\" width=\"1024\" height=\"576\" srcset=\"https:\/\/liveseo.com.br\/wp-content\/uploads\/2024\/02\/4f9547363dc308748b100edafae91063_CausascomunsdeumCLSruim-1024x576.webp 1024w, https:\/\/liveseo.com.br\/wp-content\/uploads\/2024\/02\/4f9547363dc308748b100edafae91063_CausascomunsdeumCLSruim-300x169.webp 300w, https:\/\/liveseo.com.br\/wp-content\/uploads\/2024\/02\/4f9547363dc308748b100edafae91063_CausascomunsdeumCLSruim-768x432.webp 768w, https:\/\/liveseo.com.br\/wp-content\/uploads\/2024\/02\/4f9547363dc308748b100edafae91063_CausascomunsdeumCLSruim.webp 1280w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/p>\r\n\r\n\r\n\r\n\r\n\r\n<h4 class=\"wp-block-heading\">Causas comuns de um CLS ruim<\/h4>\r\n\r\n\r\n\r\n<ul>\r\n<li>Imagens mal dimensionadas;\u00a0<\/li>\r\n\r\n\r\n\r\n<li>Propagandas, transi\u00e7\u00f5es, anima\u00e7\u00f5es e frames mal dimensionados;<\/li>\r\n\r\n\r\n\r\n<li>Mudan\u00e7as inesperadas de layout e conte\u00fado;<\/li>\r\n\r\n\r\n\r\n<li>Web fontes que sofrem altera\u00e7\u00f5es;<\/li>\r\n\r\n\r\n\r\n<li>HTML mal compactado que demora para carregar o layout.<\/li>\r\n<\/ul>\r\n\r\n\r\n\r\n<h3 class=\"wp-block-heading\">First Input Delay (FID)<\/h3>\r\n\r\n\r\n\r\n<p>Assim como o LCP, o FID tamb\u00e9m est\u00e1 relacionado \u00e0 velocidade do site. Dessa vez, a mensura\u00e7\u00e3o \u00e9 de quanto tempo leva para que o conte\u00fado se torne visualmente renderizado. Ou seja, a partir do momento em que o usu\u00e1rio faz a primeira intera\u00e7\u00e3o com a p\u00e1gina,<strong> quanto tempo demora para que o site esteja apto para ter seus elementos clic\u00e1veis e prontos para navega\u00e7\u00e3o e pesquisa?\u00a0<\/strong><\/p>\r\n\r\n\r\n\r\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\r\n<p><em>A FID \u00e9 uma m\u00e9trica de campo e n\u00e3o pode ser simulada em um ambiente de laborat\u00f3rio. \u00c9 necess\u00e1ria uma intera\u00e7\u00e3o real do usu\u00e1rio para medir o atraso de resposta.<\/em><\/p>\r\n\r\n\r\n\r\n<p><a href=\"https:\/\/web.dev\/articles\/optimize-fid?hl=pt-br\" target=\"_blank\" rel=\"noreferrer noopener\">Google via Web.dev sobre FID<\/a><\/p>\r\n<\/blockquote>\r\n\r\n\r\n\r\n<p>Todo o processo de carregamento dos elementos clic\u00e1veis da p\u00e1gina precisa ser conclu\u00eddo em at\u00e9 100 milissegundos, de acordo com as diretrizes do Google. Dessa forma, a experi\u00eancia do usu\u00e1rio n\u00e3o \u00e9 afetada negativamente.\u00a0 Para melhorar o LCP, \u00e9 necess\u00e1rio otimizar o TTB do seu site.<\/p>\r\n\r\n\r\n\r\n<h4 class=\"wp-block-heading\">Interaction to Next Paint (INP)<\/h4>\r\n\r\n\r\n\r\n<p>O INP entra em vigor em mar\u00e7o de 2024 como substituto oficial do FID dentro das m\u00e9tricas do Core Web Vitals. A inten\u00e7\u00e3o \u00e9 proporcionar uma m\u00e9trica mais precisa da experi\u00eancia do usu\u00e1rio, medindo todas as intera\u00e7\u00f5es, e n\u00e3o apenas a primeira como acontece na de First Input Delay.<\/p>\r\n\r\n\r\n\r\n<p>Entre todas as a\u00e7\u00f5es metrificadas por esse indicador, <strong>ser\u00e1 levado em considera\u00e7\u00e3o a mais lenta e o tempo para carregamento do pr\u00f3ximo quadro <\/strong>para indicar se o site est\u00e1 de acordo com as expectativas ou n\u00e3o. Para conseguir um INP considerado bom \u00e9 necess\u00e1rio que o valor seja menor que 200 milissegundos.<\/p>\r\n\r\n\r\n\r\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\r\n<p><em>Os dados de uso do Chrome mostram que 90% do tempo de um usu\u00e1rio em uma p\u00e1gina \u00e9 gasto depois que ela \u00e9 carregada. Assim, \u00e9 importante ter uma medi\u00e7\u00e3o cuidadosa da capacidade de resposta ao longo do ciclo de vida da p\u00e1gina. \u00c9 isso que a m\u00e9trica INP avalia.<\/em><\/p>\r\n\r\n\r\n\r\n<p><a href=\"https:\/\/web.dev\/articles\/inp?hl=pt-br\" target=\"_blank\" rel=\"noreferrer noopener\">Google via Web.dev sobre INP<\/a><\/p>\r\n<p><img decoding=\"async\" class=\"alignnone wp-image-4326 size-large\" src=\"https:\/\/liveseo.com.br\/wp-content\/uploads\/2024\/02\/3cf5667589de358c49c2425c10b90539_ComoverificarsuasmtricasdoCoreWebVitals_-1024x576.webp\" alt=\"Texto centralizado dividido com 3 ret\u00e2ngulos em vertical com \u00edcones representando cada etapa\" width=\"1024\" height=\"576\" srcset=\"https:\/\/liveseo.com.br\/wp-content\/uploads\/2024\/02\/3cf5667589de358c49c2425c10b90539_ComoverificarsuasmtricasdoCoreWebVitals_-1024x576.webp 1024w, https:\/\/liveseo.com.br\/wp-content\/uploads\/2024\/02\/3cf5667589de358c49c2425c10b90539_ComoverificarsuasmtricasdoCoreWebVitals_-300x169.webp 300w, https:\/\/liveseo.com.br\/wp-content\/uploads\/2024\/02\/3cf5667589de358c49c2425c10b90539_ComoverificarsuasmtricasdoCoreWebVitals_-768x432.webp 768w, https:\/\/liveseo.com.br\/wp-content\/uploads\/2024\/02\/3cf5667589de358c49c2425c10b90539_ComoverificarsuasmtricasdoCoreWebVitals_.webp 1280w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/p>\r\n<\/blockquote>\r\n\r\n\r\n\r\n\r\n\r\n<h2 class=\"wp-block-heading\">Como verificar suas m\u00e9tricas do Core Web Vitals?<\/h2>\r\n\r\n\r\n\r\n<p>Existem algumas diferentes ferramentas que fornecem as informa\u00e7\u00f5es sobre as m\u00e9tricas do Core Web Vitals, elencamos as principais. Veja:<\/p>\r\n\r\n\r\n\r\n<ul>\r\n<li><strong>Google Search Console:<\/strong><\/li>\r\n<\/ul>\r\n\r\n\r\n\r\n<ul>\r\n<li>Acesse o <a href=\"https:\/\/search.google.com\/search-console\/\" target=\"_blank\" rel=\"noreferrer noopener\">Google Search Console<\/a>;<\/li>\r\n\r\n\r\n\r\n<li>Escolha seu dom\u00ednio e v\u00e1 para &#8220;Melhorias&#8221; &gt; &#8220;Core Web Vitals&#8221;;<\/li>\r\n\r\n\r\n\r\n<li>Neste local, \u00e9 poss\u00edvel verificar o desempenho de suas p\u00e1ginas tanto nos dispositivos m\u00f3veis quanto em computadores.<\/li>\r\n\r\n\r\n\r\n<li><strong>Google PageSpeed Insights:<\/strong><\/li>\r\n<\/ul>\r\n\r\n\r\n\r\n<ol>\r\n<li>Visite o <a href=\"https:\/\/developers.google.com\/speed\/pagespeed\/insights\" target=\"_blank\" rel=\"noreferrer noopener\">PageSpeed Insights<\/a>;<\/li>\r\n\r\n\r\n\r\n<li>Insira a URL da p\u00e1gina que deseja analisar;<\/li>\r\n\r\n\r\n\r\n<li>Avalie as m\u00e9tricas fornecidas, como LCP (Largest Contentful Paint), FID (First Input Delay) e CLS (Cumulative Layout Shift).<\/li>\r\n<\/ol>\r\n\r\n\r\n\r\n<ul>\r\n<li><strong>Web Vitals Extension \u2013 no Chrome:<\/strong><\/li>\r\n<\/ul>\r\n\r\n\r\n\r\n<ol>\r\n<li>Instale a extens\u00e3o <a href=\"https:\/\/chrome.google.com\/webstore\/detail\/web-vitals\/ahfhijdlegdabablpippeagghigmibma\" target=\"_blank\" rel=\"noreferrer noopener\">Web Vitals<\/a> no Chrome;<\/li>\r\n\r\n\r\n\r\n<li>Visite a p\u00e1gina que deseja avaliar;<\/li>\r\n\r\n\r\n\r\n<li>Clique na extens\u00e3o para visualizar as m\u00e9tricas de Core Web Vitals.<\/li>\r\n<\/ol>\r\n\r\n\r\n\r\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\r\n<p>Conhe\u00e7a algumas ferramentas de SEO para acompanhar altera\u00e7\u00f5es na SERP <a href=\"https:\/\/liveseo.com.br\/seo\/ferramentas-monitoracao-serp\/\" target=\"_blank\" rel=\"noreferrer noopener\">clicando aqui<\/a>!<\/p>\r\n<\/blockquote>\r\n\r\n\r\n\r\n<h2 class=\"wp-block-heading\">Como o Core Web Vitals impacta na experi\u00eancia do usu\u00e1rio?<\/h2>\r\n\r\n\r\n\r\n<p>Como falamos antes, os Web Vitals s\u00e3o indicadores de como est\u00e1 a realidade de carregamento e UX (User Experience) de site. Com isso, podemos entender que <strong>ele n\u00e3o impacta diretamente na experi\u00eancia do usu\u00e1rio, apenas explicita em n\u00fameros como essa experi\u00eancia acontece.<\/strong><\/p>\r\n\r\n\r\n\r\n<p>Os preju\u00edzos na experi\u00eancia de navega\u00e7\u00e3o de um site, como a demora de carregamento, aconteceriam com ou sem o CWV existir. No entanto, com ele temos uma forma de enxergar esses problemas de forma quantitativa e desenvolver estrat\u00e9gias para san\u00e1-los. Isso demonstra o impacto indireto dessas m\u00e9tricas no UX, pois, a partir dela, tra\u00e7amos tarefas para deixar um dom\u00ednio dentro das expectativas do CLS, LCP, FDI ou INP.<\/p>\r\n\r\n\r\n\r\n<p>Temos um conte\u00fado focado apenas em <a href=\"https:\/\/liveseo.com.br\/seo\/ux-dentro-do-seo\/\" target=\"_blank\" rel=\"noreferrer noopener\">UX e seu papel no SEO<\/a>, vale a pena conferir para entender mais do tema!<\/p>\r\n\r\n\r\n\r\n<h2 class=\"wp-block-heading\">Tarefas para melhorar as m\u00e9tricas do Web Vitals<\/h2>\r\n\r\n\r\n\r\n<p>Para otimizar as m\u00e9tricas do Core Web Vitals (CLS, FID e LCP), \u00e9 fundamental implementar ajustes espec\u00edficos em seu site. A seguir, apresentamos algumas tarefas e estrat\u00e9gias para aprimorar cada uma dessas m\u00e9tricas. Mas antes, algumas otimiza\u00e7\u00f5es que impactam na experi\u00eancia do usu\u00e1rio como um todo:<\/p>\r\n\r\n\r\n\r\n<ul>\r\n<li><strong>Cache eficiente:<\/strong> implemente um caching eficiente para recursos est\u00e1ticos, permitindo que os visitantes carreguem recursos diretamente do cache ao retornarem ao seu site;<\/li>\r\n\r\n\r\n\r\n<li><strong>Utilize CDNs:<\/strong> aproveite as Content Delivery Networks (CDNs) para distribuir conte\u00fado est\u00e1tico em servidores pr\u00f3ximos aos usu\u00e1rios, reduzindo o tempo de carregamento;<\/li>\r\n\r\n\r\n\r\n<li><strong>Monitoramento cont\u00ednuo:<\/strong> utilize ferramentas como Google PageSpeed Insights, Lighthouse e Google Search Console para monitorar e identificar oportunidades cont\u00ednuas de otimiza\u00e7\u00e3o.<\/li>\r\n<\/ul>\r\n<p><img decoding=\"async\" class=\"alignright wp-image-4328 size-large\" src=\"https:\/\/liveseo.com.br\/wp-content\/uploads\/2024\/02\/3027355547a2b2e214cd7968435e089a_TarefasparamelhorarasmtricasdoWebVitals-1024x576.webp\" alt=\"texto centralizado com \u00edcones representando cada etapa do processo\" width=\"1024\" height=\"576\" srcset=\"https:\/\/liveseo.com.br\/wp-content\/uploads\/2024\/02\/3027355547a2b2e214cd7968435e089a_TarefasparamelhorarasmtricasdoWebVitals-1024x576.webp 1024w, https:\/\/liveseo.com.br\/wp-content\/uploads\/2024\/02\/3027355547a2b2e214cd7968435e089a_TarefasparamelhorarasmtricasdoWebVitals-300x169.webp 300w, https:\/\/liveseo.com.br\/wp-content\/uploads\/2024\/02\/3027355547a2b2e214cd7968435e089a_TarefasparamelhorarasmtricasdoWebVitals-768x432.webp 768w, https:\/\/liveseo.com.br\/wp-content\/uploads\/2024\/02\/3027355547a2b2e214cd7968435e089a_TarefasparamelhorarasmtricasdoWebVitals.webp 1280w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/p>\r\n\r\n\r\n\r\n\r\n\r\n<h3 class=\"wp-block-heading\">Melhorias para o CLS<\/h3>\r\n\r\n\r\n\r\n<ul>\r\n<li><strong>Defina dimens\u00f5es para elementos multim\u00eddia:<\/strong> ao incorporar imagens, v\u00eddeos ou outros elementos multim\u00eddia, especifique dimens\u00f5es para evitar que a p\u00e1gina seja redesenhada durante o carregamento do conte\u00fado;<\/li>\r\n\r\n\r\n\r\n<li><strong>Priorize carregamento ass\u00edncrono:<\/strong> carregue scripts, fontes e estilos de forma ass\u00edncrona para evitar bloqueios no carregamento de outros recursos, reduzindo a probabilidade de deslocamentos na p\u00e1gina;<\/li>\r\n\r\n\r\n\r\n<li><strong>Adie a inicializa\u00e7\u00e3o de an\u00fancios:<\/strong> se estiver utilizando an\u00fancios, adie a inicializa\u00e7\u00e3o at\u00e9 que o restante da p\u00e1gina tenha carregado para evitar altera\u00e7\u00f5es no layout durante o carregamento.<\/li>\r\n<\/ul>\r\n\r\n\r\n\r\n<h3 class=\"wp-block-heading\">Melhorias para FID<\/h3>\r\n\r\n\r\n\r\n<ul>\r\n<li><strong>Otimiza\u00e7\u00e3o de scripts:<\/strong> reduza e otimize o c\u00f3digo JavaScript para diminuir o tempo necess\u00e1rio para executar scripts durante o carregamento da p\u00e1gina;<\/li>\r\n\r\n\r\n\r\n<li><strong>Carregamento ass\u00edncrono de scripts:<\/strong> carregue scripts de forma ass\u00edncrona para n\u00e3o impedir a renderiza\u00e7\u00e3o da p\u00e1gina;<\/li>\r\n\r\n\r\n\r\n<li><strong>Priorize interatividade do usu\u00e1rio:<\/strong> d\u00ea prioridade a elementos vis\u00edveis e interativos, permitindo que o usu\u00e1rio inicie a intera\u00e7\u00e3o enquanto outros recursos s\u00e3o carregados.<\/li>\r\n<\/ul>\r\n\r\n\r\n\r\n<h3 class=\"wp-block-heading\">Melhorias para LCP<\/h3>\r\n\r\n\r\n\r\n<ul>\r\n<li><strong>Otimiza\u00e7\u00e3o de imagens e v\u00eddeos:<\/strong> comprima e otimize imagens e v\u00eddeos para reduzir o tamanho do arquivo e aprimorar o tempo de carregamento;<\/li>\r\n\r\n\r\n\r\n<li><strong>Carregamento priorit\u00e1rio de elementos visuais:<\/strong> priorize o carregamento de elementos visuais cruciais para a experi\u00eancia do usu\u00e1rio, garantindo que o maior conte\u00fado vis\u00edvel seja carregado o mais rapidamente poss\u00edvel;<\/li>\r\n\r\n\r\n\r\n<li><strong>Minimiza\u00e7\u00e3o de CSS e JavaScript:<\/strong> diminua e otimize os arquivos CSS e JavaScript para acelerar o carregamento e a renderiza\u00e7\u00e3o da p\u00e1gina.<\/li>\r\n<\/ul>\r\n\r\n\r\n\r\n<p>Lembre-se de que as pr\u00e1ticas e estrat\u00e9gias espec\u00edficas podem variar conforme a arquitetura e as tecnologias utilizadas em seu site. Teste as altera\u00e7\u00f5es e as monitore regularmente para garantir que os resultados nas m\u00e9tricas do Core Web Vitals est\u00e3o sendo os esperados.<\/p>\r\n\r\n\r\n\r\n<p>Para conseguir monitorar ainda melhor os n\u00fameros alcan\u00e7ados por seu site, n\u00e3o deixe de assistir nosso webinar sobre <a href=\"https:\/\/liveseo.com.br\/videos-de-seo\/como-analisar-indicadores-para-cada-etapa-de-um-projeto-seo\/\" target=\"_blank\" rel=\"noreferrer noopener\">como analisar indicadores para cada etapa de um projeto SEO <\/a>com nossos especialistas Lucas Maranha e Henrique Zampronio.<\/p>\r\n\r\n\r\n\r\n<p>Nos vemos na pr\u00f3xima aventura!<\/p>\r\n","protected":false},"excerpt":{"rendered":"<p>Otimizar a qualidade da experi\u00eancia do usu\u00e1rio \u00e9 fundamental para o sucesso a longo prazo de qualquer site. N\u00e3o importa se voc\u00ea \u00e9 propriet\u00e1rio de uma empresa, profissional de marketing ou desenvolvedor, o Web vitals pode ajudar a quantificar a experi\u00eancia no seu site e identificar oportunidades de melhoria. Google via Web.Dev sobre o Web [&hellip;]<\/p>\n","protected":false},"author":3,"featured_media":2405,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[18],"tags":[],"ls_data":{"_yoast_wpseo_title":"Core Web Vitals: um guia completo dos indicadores","_yoast_wpseo_metadesc":"Conhe\u00e7a mais sobre o LCP, CLS e FID, m\u00e9tricas do Core Web Vitals para mensurar a qualidade da experi\u00eancia de um usu\u00e1rio dentro do site. Acesse!","_yoast_wpseo_meta-robots-noindex":"","_yoast_wpseo_meta-robots-nofollow":"","_aioseo_title":"","_aioseo_description":"","rank_math_title":"Core Web Vitals: um guia completo dos indicadores","rank_math_description":"Conhe\u00e7a mais sobre o LCP, CLS e FID, m\u00e9tricas do Core Web Vitals para mensurar a qualidade da experi\u00eancia de um usu\u00e1rio dentro do site. Acesse!"},"_links":{"self":[{"href":"https:\/\/liveseo.com.br\/wp-json\/wp\/v2\/posts\/2403"}],"collection":[{"href":"https:\/\/liveseo.com.br\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/liveseo.com.br\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/liveseo.com.br\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/liveseo.com.br\/wp-json\/wp\/v2\/comments?post=2403"}],"version-history":[{"count":0,"href":"https:\/\/liveseo.com.br\/wp-json\/wp\/v2\/posts\/2403\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/liveseo.com.br\/wp-json\/wp\/v2\/media\/2405"}],"wp:attachment":[{"href":"https:\/\/liveseo.com.br\/wp-json\/wp\/v2\/media?parent=2403"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/liveseo.com.br\/wp-json\/wp\/v2\/categories?post=2403"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/liveseo.com.br\/wp-json\/wp\/v2\/tags?post=2403"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}