{"id":25741,"date":"2021-08-20T11:13:59","date_gmt":"2021-08-20T09:13:59","guid":{"rendered":"https:\/\/www.kodlogy.at\/what-are-core-web-vitals\/"},"modified":"2021-08-20T11:13:59","modified_gmt":"2021-08-20T09:13:59","slug":"what-are-core-web-vitals","status":"publish","type":"post","link":"https:\/\/www.kodlogy.at\/en\/what-are-core-web-vitals\/","title":{"rendered":"What Are Core Web Vitals? LCP, INP and CLS Explained Simply"},"content":{"rendered":"<div class=\"k-kurz\" style=\"background:#F5F9FF;border:1px solid #dce8f5;border-left:4px solid #0072FF;border-radius:12px;padding:18px 22px;margin:0 0 28px\">\n<p style=\"margin:0 0 6px;font-weight:600;color:#002450\">In brief<\/p>\n<p style=\"margin:0\">Core Web Vitals are three metrics Google uses to assess the user experience of a web page: Largest Contentful Paint (LCP) for loading time, Interaction to Next Paint (INP) for responsiveness and Cumulative Layout Shift (CLS) for visual stability. Since March 2024, INP has replaced the former First Input Delay (FID) metric.<\/p>\n<\/div>\n<p>What are Core Web Vitals and why should businesses care about them? The Core Web Vitals are a set of metrics Google uses to measure how fast, responsive and stable a web page feels for real visitors. Since 2021 they have been part of the page experience used to evaluate web pages. If you achieve good values, you offer visitors a better experience \u2013 and create a solid technical basis for rankings and enquiries.<\/p>\n<p>In this article we explain the three metrics clearly, show the current thresholds and name the most common causes of and solutions for poor results.<\/p>\n<h2>Why are Core Web Vitals important?<\/h2>\n<p>Search engines have always evaluated web pages by many criteria: relevance of the content, trustworthiness, security through an SSL certificate (HTTPS), mobile usability and speed. The Core Web Vitals do not replace these criteria; they add a clear view of the actual user experience.<\/p>\n<p>This matters for two reasons:<\/p>\n<ul>\n<li><strong>Ranking:<\/strong> with content of comparable quality, the better user experience can make the difference. The higher a page ranks, the more visitors it reaches.<\/li>\n<li><strong>Revenue and enquiries:<\/strong> slow or jumping pages are frustrating. Visitors leave before they fill in a form or buy a product. Good Core Web Vitals therefore also help when your ranking is already fine.<\/li>\n<\/ul>\n<p>Google measures the values using anonymised data from real Chrome users. The 75th percentile is decisive: a page is considered good if at least three quarters of page views meet the thresholds.<\/p>\n<h2>What are Core Web Vitals? The three metrics at a glance<\/h2>\n<table>\n<thead>\n<tr>\n<th>Metric<\/th>\n<th>What is measured?<\/th>\n<th>Good<\/th>\n<th>Needs improvement<\/th>\n<th>Poor<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr>\n<td>LCP \u2013 Largest Contentful Paint<\/td>\n<td>Loading time of the largest visible element<\/td>\n<td>up to 2.5 s<\/td>\n<td>2.5\u20134 s<\/td>\n<td>over 4 s<\/td>\n<\/tr>\n<tr>\n<td>INP \u2013 Interaction to Next Paint<\/td>\n<td>Response time to clicks, taps and keyboard input<\/td>\n<td>up to 200 ms<\/td>\n<td>200\u2013500 ms<\/td>\n<td>over 500 ms<\/td>\n<\/tr>\n<tr>\n<td>CLS \u2013 Cumulative Layout Shift<\/td>\n<td>Unexpected shifts in the layout<\/td>\n<td>up to 0.1<\/td>\n<td>0.1\u20130.25<\/td>\n<td>over 0.25<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<figure class=\"k-img\" style=\"margin:28px 0\"><img loading=\"lazy\" decoding=\"async\" width=\"1600\" height=\"1067\" src=\"https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/responsive-website-laptop-tablet-smartphone.jpg\" alt=\"Responsive website on laptop, tablet and smartphone\" class=\"wp-image-24204\" style=\"width:100%;height:auto;border-radius:16px\" loading=\"lazy\" srcset=\"https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/responsive-website-laptop-tablet-smartphone.jpg 1600w, https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/responsive-website-laptop-tablet-smartphone-300x200.jpg 300w, https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/responsive-website-laptop-tablet-smartphone-1024x683.jpg 1024w, https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/responsive-website-laptop-tablet-smartphone-768x512.jpg 768w, https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/responsive-website-laptop-tablet-smartphone-1536x1024.jpg 1536w\" sizes=\"auto, (max-width: 1600px) 100vw, 1600px\" \/><\/figure>\n<h2>What is Largest Contentful Paint (LCP)?<\/h2>\n<p>Largest Contentful Paint, LCP for short, measures how long it takes until the largest visible element in the browser window has loaded \u2013 usually a hero image, a video thumbnail or a large heading. For visitors, this is the moment the page is \u201cthere\u201d. A good value is no more than 2.5 seconds.<\/p>\n<h3>Common causes of a poor LCP<\/h3>\n<ul>\n<li>slow server response time (Time to First Byte), often due to cheap shared hosting or missing caching<\/li>\n<li>large, uncompressed images or images in the wrong format<\/li>\n<li>JavaScript and CSS files that block the rendering of the page<\/li>\n<li>client-side rendering, where content is only built via JavaScript<\/li>\n<li>fonts and third-party scripts that load late<\/li>\n<\/ul>\n<h3>How to improve LCP<\/h3>\n<ol>\n<li>Deliver images in modern formats such as WebP or AVIF and scale them to the size actually needed.<\/li>\n<li>Do not delay the LCP image with lazy loading; load it with priority instead (e.g. with <code>fetchpriority=\"high\"<\/code>).<\/li>\n<li>Use page caching and a content delivery network (CDN).<\/li>\n<li>Remove unused third-party scripts and minify CSS.<\/li>\n<li>If the server response is permanently slow, switch to a more powerful <a href=\"https:\/\/www.kodlogy.at\/en\/managed-hosting-vienna\/\">managed hosting<\/a> plan.<\/li>\n<\/ol>\n<h2>INP instead of FID: what is Interaction to Next Paint?<\/h2>\n<p>Until March 2024, Google assessed responsiveness with First Input Delay (FID). FID only measured the delay until the <em>first<\/em> interaction was processed \u2013 and was therefore not very meaningful, because most pages passed this test easily. Since 12 March 2024, <strong>Interaction to Next Paint (INP)<\/strong> has been the official Core Web Vitals metric for responsiveness.<\/p>\n<p>INP observes all clicks, taps and keyboard inputs during a visit and measures how long it takes until the browser displays the next frame after an interaction. What is reported is roughly the slowest interaction. A good value is no more than 200 milliseconds. If you tap \u201cAdd to basket\u201d, for example, and see no response for half a second, you are experiencing a poor INP.<\/p>\n<h3>Common causes of a poor INP<\/h3>\n<ul>\n<li>long JavaScript tasks that block the main thread<\/li>\n<li>heavy page builders, sliders and animations<\/li>\n<li>many third-party tracking, chat and advertising scripts<\/li>\n<li>very large DOM structures with thousands of elements<\/li>\n<\/ul>\n<h3>How to improve INP<\/h3>\n<ul>\n<li>Remove unused plugins and scripts and load scripts with a delay (<code>defer<\/code>).<\/li>\n<li>Split long tasks into smaller parts so that the browser can respond in between.<\/li>\n<li>Only load third-party scripts after consent or interaction \u2013 this also helps with GDPR (DSGVO) compliance.<\/li>\n<li>Slim down the page structure and avoid unnecessary nesting.<\/li>\n<\/ul>\n<div class=\"k-cta\" style=\"background:#002450;border-radius:16px;padding:26px 28px;margin:32px 0;color:#fff\">\n<p style=\"margin:0 0 6px;font-size:21px;font-weight:600;color:#fff\">Are your Core Web Vitals red?<\/p>\n<p style=\"margin:0 0 16px;color:#CFE6FF\">We analyse the LCP, INP and CLS of your website and implement the optimisations in a technically clean way.<\/p>\n<p><a href=\"https:\/\/www.kodlogy.at\/en\/seo-audit-vienna\/\" style=\"display:inline-block;background:linear-gradient(to right,#00C6FF,#0072FF);color:#fff;font-weight:600;padding:12px 24px;border-radius:10px;text-decoration:none\">Request an SEO audit<\/a> &nbsp; <a href=\"tel:+436605403636\" style=\"color:#fff;font-weight:600\">+43 660 540 3636<\/a><\/div>\n<h2>What is Cumulative Layout Shift (CLS)?<\/h2>\n<p>Cumulative Layout Shift measures the visual stability of a page. Everyone knows the problem: you want to tap a link, suddenly an image or banner loads, the text slides down and you hit the wrong element. Google rates values up to 0.1 as good, up to 0.25 as needing improvement and anything above that as poor.<\/p>\n<h3>Common causes of a poor CLS<\/h3>\n<ul>\n<li>images, videos and iframes without specified width and height<\/li>\n<li>adverts and embedded content without reserved space<\/li>\n<li>dynamically inserted elements such as pop-ups, cookie banners and notification bars<\/li>\n<li>web fonts that change the text size while loading<\/li>\n<\/ul>\n<h3>How to improve CLS<\/h3>\n<ul>\n<li>Specify dimensions for all images and videos or work with <code>aspect-ratio<\/code>.<\/li>\n<li>Reserve fixed placeholders for adverts, for example via Google Ads, and for embeds.<\/li>\n<li>Show banners and pop-ups so that they overlay the content instead of pushing it.<\/li>\n<li>Load fonts with <code>font-display: swap<\/code> and suitable fallback fonts.<\/li>\n<\/ul>\n<h2>How do you measure Core Web Vitals?<\/h2>\n<p>Free tools from Google are available for measuring:<\/p>\n<ul>\n<li><strong>PageSpeed Insights:<\/strong> shows field data from real users (if enough data is available) and a lab measurement with specific recommendations.<\/li>\n<li><strong>Google Search Console:<\/strong> the \u201cCore Web Vitals\u201d report groups all URLs of your website into good, needs improvement and poor \u2013 separately for mobile and desktop.<\/li>\n<li><strong>Lighthouse and Chrome DevTools:<\/strong> are suitable for troubleshooting during development.<\/li>\n<\/ul>\n<p>Google offers detailed technical documentation of the metrics on <a href=\"https:\/\/web.dev\/articles\/vitals\" target=\"_blank\" rel=\"noopener\">web.dev<\/a>. Important: for rankings, the field data counts, not the Lighthouse score alone. A lab score of 100 is nice, but not a goal in itself. If you want the values assessed in the context of content and technology, an <a href=\"https:\/\/www.kodlogy.at\/en\/seo-audit-vienna\/\">SEO audit in Vienna<\/a> is a good choice.<\/p>\n<figure class=\"k-img\" style=\"margin:28px 0\"><img loading=\"lazy\" decoding=\"async\" width=\"1600\" height=\"1067\" src=\"https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/google-suche-smartphone-seo.jpg\" alt=\"Google search on a smartphone\" class=\"wp-image-24214\" style=\"width:100%;height:auto;border-radius:16px\" loading=\"lazy\" srcset=\"https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/google-suche-smartphone-seo.jpg 1600w, https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/google-suche-smartphone-seo-300x200.jpg 300w, https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/google-suche-smartphone-seo-1024x683.jpg 1024w, https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/google-suche-smartphone-seo-768x512.jpg 768w, https:\/\/www.kodlogy.at\/wp-content\/uploads\/2026\/11\/google-suche-smartphone-seo-1536x1024.jpg 1536w\" sizes=\"auto, (max-width: 1600px) 100vw, 1600px\" \/><\/figure>\n<h2>Core Web Vitals and WordPress<\/h2>\n<p>Many WordPress websites struggle with weak values because plugins, page builder elements and external scripts accumulate over the years. The good news: with a lean theme, clean caching, optimised images and a tidy plugin list, most problems can be solved. We describe how this works in detail on our page about <a href=\"https:\/\/www.kodlogy.at\/en\/wordpress-seo-services\/\">WordPress SEO<\/a>.<\/p>\n<p>Good Core Web Vitals are not a one-off project. Every new plugin, every tracking script and every large image can make the values worse again. Regular monitoring is therefore part of professional support.<\/p>\n<h2>How Kodlogy helps with Core Web Vitals<\/h2>\n<p>As an <a href=\"https:\/\/www.kodlogy.at\/en\/seo-agency-vienna\/\">SEO agency in Vienna<\/a>, we combine technical optimisation with content that sells. Specifically, this means:<\/p>\n<ul>\n<li>Analysis of the field data from Search Console and PageSpeed Insights<\/li>\n<li>A prioritised list of measures: what has the greatest effect with the least effort?<\/li>\n<li>Implementation of image, caching, script and server optimisation<\/li>\n<li>Monitoring of the results until the field data is in the green<\/li>\n<\/ul>\n<div class=\"k-cta\" style=\"background:#002450;border-radius:16px;padding:26px 28px;margin:32px 0;color:#fff\">\n<p style=\"margin:0 0 6px;font-size:21px;font-weight:600;color:#fff\">Faster website, more enquiries<\/p>\n<p style=\"margin:0 0 16px;color:#CFE6FF\">Let us check together where your website is losing time and customers. The initial assessment is free of charge.<\/p>\n<p><a href=\"https:\/\/www.kodlogy.at\/en\/contact\/\" style=\"display:inline-block;background:linear-gradient(to right,#00C6FF,#0072FF);color:#fff;font-weight:600;padding:12px 24px;border-radius:10px;text-decoration:none\">Get in touch<\/a> &nbsp; <a href=\"tel:+436605403636\" style=\"color:#fff;font-weight:600\">+43 660 540 3636<\/a><\/div>\n<p><!-- k-faq --><\/p>\n<h2>Frequently asked questions about Core Web Vitals<\/h2>\n<details style=\"border:1px solid #dce8f5;border-radius:8px;padding:14px 18px;margin-bottom:10px;background:#fff\">\n<summary><strong>What are Core Web Vitals in one sentence?<\/strong><\/summary>\n<p>Core Web Vitals are three Google metrics that assess the loading speed (LCP), responsiveness (INP) and visual stability (CLS) of a web page from the point of view of real users.<\/p>\n<\/details>\n<details style=\"border:1px solid #dce8f5;border-radius:8px;padding:14px 18px;margin-bottom:10px;background:#fff\">\n<summary><strong>What changed in the Core Web Vitals in 2024?<\/strong><\/summary>\n<p>In March 2024, Google replaced the First Input Delay (FID) metric with Interaction to Next Paint (INP). INP assesses not only the first but all interactions during a page visit and is therefore far more meaningful.<\/p>\n<\/details>\n<details style=\"border:1px solid #dce8f5;border-radius:8px;padding:14px 18px;margin-bottom:10px;background:#fff\">\n<summary><strong>Which values are considered good?<\/strong><\/summary>\n<p>An LCP of no more than 2.5 seconds, an INP of no more than 200 milliseconds and a CLS of no more than 0.1 are considered good. Google evaluates the 75th percentile of page views, i.e. the experience of the majority of your visitors.<\/p>\n<\/details>\n<details style=\"border:1px solid #dce8f5;border-radius:8px;padding:14px 18px;margin-bottom:10px;background:#fff\">\n<summary><strong>Are Core Web Vitals a ranking factor?<\/strong><\/summary>\n<p>Yes, they are part of the page experience signals. Relevant, helpful content remains more important, however. With comparable content, good values can tip the balance \u2013 and they always improve the conversion rate.<\/p>\n<\/details>\n<details style=\"border:1px solid #dce8f5;border-radius:8px;padding:14px 18px;margin-bottom:10px;background:#fff\">\n<summary><strong>How can I measure my Core Web Vitals?<\/strong><\/summary>\n<p>With PageSpeed Insights, the \u201cCore Web Vitals\u201d report in Google Search Console and Lighthouse in Chrome. Field data shows real user experiences, lab data helps with troubleshooting. We are happy to take this on as part of an <a href=\"https:\/\/www.kodlogy.at\/en\/seo-audit-vienna\/\">SEO audit in Vienna<\/a>.<\/p>\n<\/details>\n<details style=\"border:1px solid #dce8f5;border-radius:8px;padding:14px 18px;margin-bottom:10px;background:#fff\">\n<summary><strong>Why do lab data and field data differ?<\/strong><\/summary>\n<p>Lab data is generated in a simulated environment with a defined device and network. Field data comes from real Chrome users with different devices and connections. For rankings, the field data counts.<\/p>\n<\/details>\n<details style=\"border:1px solid #dce8f5;border-radius:8px;padding:14px 18px;margin-bottom:10px;background:#fff\">\n<summary><strong>Can I improve Core Web Vitals on WordPress myself?<\/strong><\/summary>\n<p>Partly: compressing images, using a caching plugin and removing unnecessary plugins often achieves a lot already. For INP problems, theme code and server optimisation, professional help pays off, for example as part of our <a href=\"https:\/\/www.kodlogy.at\/en\/wordpress-maintenance-vienna\/\">WordPress maintenance<\/a>.<\/p>\n<\/details>\n<details style=\"border:1px solid #dce8f5;border-radius:8px;padding:14px 18px;margin-bottom:10px;background:#fff\">\n<summary><strong>How quickly do improvements take effect?<\/strong><\/summary>\n<p>Lab measurements show improvements immediately. The field data in Search Console is based on a rolling 28-day period, so it takes a few weeks until optimisations are fully reflected there.<\/p>\n<\/details>\n<p><!-- \/k-faq --><\/p>\n","protected":false},"excerpt":{"rendered":"<p>In brief Core Web Vitals are three metrics Google uses to assess the user experience of a web page: Largest Contentful Paint (LCP) for loading time, Interaction to Next Paint (INP) for responsiveness and Cumulative Layout Shift (CLS) for visual stability. Since March 2024, INP has replaced the former First Input Delay (FID) metric. What [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":16606,"comment_status":"","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_joinchat":[],"footnotes":""},"categories":[209],"tags":[],"class_list":["post-25741","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-seo-search-engine-optimisation"],"_links":{"self":[{"href":"https:\/\/www.kodlogy.at\/en\/wp-json\/wp\/v2\/posts\/25741","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.kodlogy.at\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.kodlogy.at\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.kodlogy.at\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.kodlogy.at\/en\/wp-json\/wp\/v2\/comments?post=25741"}],"version-history":[{"count":0,"href":"https:\/\/www.kodlogy.at\/en\/wp-json\/wp\/v2\/posts\/25741\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.kodlogy.at\/en\/wp-json\/wp\/v2\/media\/16606"}],"wp:attachment":[{"href":"https:\/\/www.kodlogy.at\/en\/wp-json\/wp\/v2\/media?parent=25741"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.kodlogy.at\/en\/wp-json\/wp\/v2\/categories?post=25741"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.kodlogy.at\/en\/wp-json\/wp\/v2\/tags?post=25741"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}