{"id":2868,"date":"2026-04-27T12:15:35","date_gmt":"2026-04-27T15:15:35","guid":{"rendered":"https:\/\/kangaroo.host\/blog\/?p=2868"},"modified":"2026-04-27T12:15:37","modified_gmt":"2026-04-27T15:15:37","slug":"core-web-vitals-como-impacta-no-seu-site","status":"publish","type":"post","link":"https:\/\/kangaroo.host\/blog\/core-web-vitals-como-impacta-no-seu-site\/","title":{"rendered":"Core Web Vitals &#8211; Como impacta no seu site"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">Ol\u00e1, Kangaroozinho, como vai? Se voc\u00ea ainda n\u00e3o conhece as m\u00e9tricas <strong>Core Web Vitals<\/strong>, neste artigo n\u00f3s vamos te falar sobre elas, como funcionam, o que metrificam, e como elas impactam no seu site, principalmente quando se trata da experi\u00eancia do usu\u00e1rio final.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u00c9 importante dizer que, embora essas m\u00e9tricas indiquem diretamente o desempenho do seu site, o impacto do servidor sobre elas \u00e9 menor do que a constru\u00e7\u00e3o e estrutura do seu site em si. Isso significa que, mesmo que o seu servidor tenha um desempenho extremo, a constru\u00e7\u00e3o do seu site ainda \u00e9 a parte mais importante caso voc\u00ea esteja buscando por melhores resultados com as <strong>Core Web Vitals<\/strong>.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Quais s\u00e3o as m\u00e9tricas Core Web Vitals<\/strong><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Para n\u00e3o restar d\u00favidas sobre quais m\u00e9tricas fazem parte das <strong>Core Web Vitals<\/strong>, elas s\u00e3o <strong>3 no total<\/strong>, sendo elas \u00e0s: <strong>LCP (Largest Contentful Paint), INP (Interaction to Next Paint) e CLS (Cumulative Layout Shift).<\/strong> \u00c9 importante citar essas m\u00e9tricas pois, em testes de PageSpeed, v\u00e1rias outras m\u00e9tricas s\u00e3o avaliadas.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Para testes de PageSpeed, as ferramentas mais conhecidas e utilizadas s\u00e3o as <a href=\"https:\/\/suporte.kangaroo.host\/google-pagespeed-insights\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>PageSpeed Insights<\/strong><\/a> e <a href=\"https:\/\/suporte.kangaroo.host\/entendendo-o-teste-gtmetrix\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>GTMetrix<\/strong><\/a>, e para o GTMetrix, eles mudam um pouco o conceito das <strong>Core Web Vitals<\/strong>, visto que eles <strong>n\u00e3o consideram a m\u00e9trica INP<\/strong>, e no lugar dela eles usam a m\u00e9trica <strong>TBT<\/strong> <strong>(Total Blocking Time<\/strong>), eles consideram uma alternativa plaus\u00edvel, e que n\u00e3o deve prejudicar os testes.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Certo, mas o que cada uma metrifica no seu site? Abaixo falamos um pouco mais sobre cada uma delas:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li style=\"margin-top:20px;margin-bottom:20px\"><strong>Largest Contentful Paint (LCP):<\/strong> A LCP serve para avaliar o tempo que a maior imagem (ou maior objeto vis\u00edvel da p\u00e1gina) leva para carregar para o usu\u00e1rio que est\u00e1 acessando o seu site, ou seja, avalia quanto tempo leva para o maior elemento da p\u00e1gina ser carregado completamente.<br><br>A m\u00e9trica \u00e9 calculada a partir do momento que a p\u00e1gina come\u00e7a a carregar, at\u00e9 o momento em que o maior elemento est\u00e1 100% carregado. Pode ser melhorado ao otimizar as imagens, v\u00eddeos, ou o elemento identificado como o maior da p\u00e1gina do seu site.<\/li>\n\n\n\n<li style=\"margin-top:20px;margin-bottom:20px\"><strong>Interaction to Next Paint (INP):<\/strong> O INP avalia o tempo de resposta geral de uma p\u00e1gina em rela\u00e7\u00e3o \u00e0s intera\u00e7\u00f5es do usu\u00e1rio. Ent\u00e3o, ela avalia quanto tempo a p\u00e1gina, bot\u00e3o, etc, leva para responder a partir do clique ou intera\u00e7\u00e3o do usu\u00e1rio.<\/li>\n\n\n\n<li style=\"margin-top:20px;margin-bottom:30px\"><strong>Cumulative Layout Shift (CLS):<\/strong> O CLS ir\u00e1 avaliar as mudan\u00e7as INESPERADAS que possam ocorrer na visualiza\u00e7\u00e3o ou a\u00e7\u00e3o do usu\u00e1rio no seu site.<br><br>Exemplo: Caso existam dois bot\u00f5es na tela, um para \u201ccontinuar\u201d e outro para \u201csair\u201d, o usu\u00e1rio ao tentar clicar no bot\u00e3o de \u201csair\u201d, pode aparecer uma mensagem de \u201ctem certeza\u201d, e isso acaba jogando o bot\u00e3o de \u201ccontinuar\u201d para baixo, isso pode ocasionar em uma nota ruim na avalia\u00e7\u00e3o do CLS.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Se se voc\u00ea geralmente usa o <strong>GTMetrix<\/strong>, deixamos abaixo tamb\u00e9m especificamente a m\u00e9trica usada por eles (TBT) para substituir o INP:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Total Blocking Time (TBT):<\/strong> O TBT mede o tempo em que a p\u00e1gina est\u00e1 \u201cbloqueada\u201d, em outras palavras, o tempo em que o usu\u00e1rio n\u00e3o consegue interagir com os bot\u00f5es ou elementos do seu site.<br><br>Ele engloba outras duas m\u00e9tricas que vamos ver mais pra frente, a <strong>First Paint<\/strong> e a <strong>Time to Interactive<\/strong>, que em resumo, \u00e9 a primeira renderiza\u00e7\u00e3o na p\u00e1gina (First Paint) at\u00e9 o momento em que algum elemento interativo surge na tela (Time to Interactive).<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Testes na pr\u00e1tica:<\/strong><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Realizamos alguns testes para demonstrar na pr\u00e1tica como as m\u00e9tricas <strong>Core Web Vitals <\/strong>atuam, onde \u00e9 poss\u00edvel ter uma ideia, e inclusive exemplificar como o desempenho bruto n\u00e3o significa que \u00e0s m\u00e9tricas est\u00e3o sendo atingidas. Em nossos testes, usamos a ferramenta <a href=\"https:\/\/pagespeed.web.dev\/\" target=\"_blank\" rel=\"noopener\"><strong>PageSpeed Insights<\/strong><\/a>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\" style=\"margin-bottom:0px\">Em nosso primeiro teste, analisamos um site que, embora tenha um resultado <strong>excelente<\/strong> de desempenho, SEO e boas pr\u00e1ticas, ele ainda acabou sendo reprovado nas <strong>Core Web Vitals<\/strong>:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\" style=\"margin-top:0px\"><img fetchpriority=\"high\" decoding=\"async\" width=\"1350\" height=\"673\" src=\"https:\/\/kangaroo.host\/blog\/wp-content\/uploads\/2026\/04\/image-5.png\" alt=\"Reprovado no Core Web Vitals\" class=\"wp-image-2869\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Nesse exemplo, podemos ver que a \u00fanica m\u00e9trica em que o site foi aprovado foi no <strong>CLS<\/strong>, as demais (LCP e INP) precisam de uma aten\u00e7\u00e3o do desenvolvedor da aplica\u00e7\u00e3o, visto que a LCP est\u00e1 com um desempenho abaixo do ideal, e a INP sequer p\u00f4de ser avaliada, por algum motivo.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\" style=\"margin-bottom:0px\">Agora, segue um exemplo onde as <strong>Core Web Vitals<\/strong> foram <strong>aprovadas<\/strong>, mesmo em um site que n\u00e3o apresenta resultados t\u00e3o bons como o anterior, quando falamos de desempenho:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\" style=\"margin-top:0px\"><img decoding=\"async\" width=\"1352\" height=\"695\" src=\"https:\/\/kangaroo.host\/blog\/wp-content\/uploads\/2026\/04\/image-6.png\" alt=\"Aprovado na Core Web VItals\" class=\"wp-image-2870\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Como pode ver, mesmo com uma nota de desempenho de <strong>74<\/strong>, ainda assim as m\u00e9tricas Web Vitals foram todas aprovadas, e at\u00e9 com certa margem, sendo um resultado, que, se for o seu foco, seria totalmente satisfat\u00f3rio.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Conclus\u00e3o<\/strong><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Para concluir, \u00e9 muito importante que voc\u00ea entenda algumas coisas, a primeira e principal \u00e9 que buscar resultados focados em espec\u00edfico nessas m\u00e9tricas pode n\u00e3o ser o ideal. Dizemos isso pois, embora essas m\u00e9tricas ajudem no SEO e ranqueamento do seu site, se voc\u00ea usar sites bem ranqueados no Google nesses testes, voc\u00ea encontrar\u00e1 v\u00e1rios que s\u00e3o reprovados, mas mesmo assim s\u00e3o bem ranqueados.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Por isso, caso queira utilizar as ferramentas de PageSpeed para validar e encontrar pontos onde seu site pode melhorar, <strong>\u00e9 extremamente v\u00e1lido<\/strong>, mas pode n\u00e3o ser o melhor ficar centrado nessas m\u00e9tricas buscando apenas e somente <strong>notas melhores<\/strong>. A melhor m\u00e9trica que voc\u00ea pode ter \u00e9 o feedback real dos usu\u00e1rios que est\u00e3o acessando o seu site, e os seus testes de navega\u00e7\u00e3o.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">E \u00e9 isso, Kangaroozinho, vamos ficando por aqui. Esperamos que voc\u00ea tenha gostado deste artigo, se gostou, n\u00e3o deixe de dar uma olhada em outras publica\u00e7\u00f5es aqui em <a href=\"https:\/\/kangaroo.host\/blog\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>nosso blog<\/strong><\/a>. Abra\u00e7os =)<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Ol\u00e1, Kangaroozinho, como vai? Se voc\u00ea ainda n\u00e3o conhece as m\u00e9tricas Core Web Vitals, neste artigo n\u00f3s vamos te falar sobre elas, como funcionam, o que metrificam, e como elas impactam no seu site, principalmente quando se trata da experi\u00eancia do usu\u00e1rio final. \u00c9 importante dizer que, embora essas m\u00e9tricas indiquem diretamente o desempenho do [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":2871,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[82],"tags":[642,49,553,643,52,644,32,641],"class_list":["post-2868","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-otimizacao","tag-core-web-vitals","tag-desempenho","tag-metricas","tag-nota","tag-otimizacao","tag-resultado","tag-site","tag-web-vitals"],"_links":{"self":[{"href":"https:\/\/kangaroo.host\/blog\/wp-json\/wp\/v2\/posts\/2868","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kangaroo.host\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kangaroo.host\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kangaroo.host\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/kangaroo.host\/blog\/wp-json\/wp\/v2\/comments?post=2868"}],"version-history":[{"count":1,"href":"https:\/\/kangaroo.host\/blog\/wp-json\/wp\/v2\/posts\/2868\/revisions"}],"predecessor-version":[{"id":2872,"href":"https:\/\/kangaroo.host\/blog\/wp-json\/wp\/v2\/posts\/2868\/revisions\/2872"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/kangaroo.host\/blog\/wp-json\/wp\/v2\/media\/2871"}],"wp:attachment":[{"href":"https:\/\/kangaroo.host\/blog\/wp-json\/wp\/v2\/media?parent=2868"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kangaroo.host\/blog\/wp-json\/wp\/v2\/categories?post=2868"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kangaroo.host\/blog\/wp-json\/wp\/v2\/tags?post=2868"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}