Technical SEO & Website Performance

Core Web Vitals Explained: LCP, INP and CLS

What the three Core Web Vitals measure, the current “good” thresholds, how to read field and lab data, and practical fixes for slow loading, slow responses and layout shifts on WordPress sites.

Last reviewed: 14 October 2026

Core Web Vitals are three measurements Google uses to describe the real-world experience of loading and using a web page: how quickly the main content appears, how quickly the page responds to people, and how stable the layout is. They are part of Google’s page experience guidance. Good scores will not make a weak page rank on their own, but a slow, jumpy page frustrates visitors and can lose enquiries.

The three Core Web Vitals and their thresholds

These are the current metrics and the thresholds for a “good” experience, as published on web.dev (checked October 2026):

MetricWhat it measuresGood
Largest Contentful Paint (LCP)Loading: when the largest image or text block becomes visible2.5 seconds or less
Interaction to Next Paint (INP)Responsiveness: how quickly the page visibly reacts after a tap, click or key press200 milliseconds or less
Cumulative Layout Shift (CLS)Visual stability: how much content moves around unexpectedly0.1 or less

A page is assessed at the 75th percentile of real visits, separately for mobile and desktop. In simple terms, at least three out of four visits should meet each threshold.

What happened to FID?

Interaction to Next Paint replaced First Input Delay (FID) as a Core Web Vital on 12 March 2024. FID only measured the delay before the browser started handling the first interaction; INP looks at the responsiveness of interactions throughout the visit. If an older article or tool still lists FID as a Core Web Vital, it is out of date.

Field data and lab data

There are two kinds of measurement, and it is important not to confuse them:

  • Field data comes from real Chrome users visiting your pages (the Chrome User Experience Report). It is what the Core Web Vitals assessment uses. You can see it in PageSpeed Insights and in the Core Web Vitals report in Google Search Console, if your site has enough traffic.
  • Lab data comes from a simulated test, for example Lighthouse in Chrome DevTools or the lab section of PageSpeed Insights. It is useful for finding causes and testing fixes, but it is not the same as real-user results. Lighthouse cannot measure INP directly because there is no real user; it reports Total Blocking Time as a related signal.

A small site may have no field data at all. In that case, use lab tests to find problems and check the experience yourself on a mid-range phone with a mobile connection.

How to improve LCP (loading)

The largest element is often a hero image, banner or large heading.

  • Optimise the main image: use a sensible size for the screen, a modern format such as WebP or AVIF, and compression.
  • Do not lazy-load the main above-the-fold image; lazy-load images further down the page instead.
  • Reduce render-blocking CSS and JavaScript, for example by removing unused plugins and scripts.
  • Use caching and good hosting. A slow server response delays everything else.
  • Avoid sliders and large videos at the top of important landing pages unless they are essential.

How to improve INP (responsiveness)

INP problems usually come from too much JavaScript running when someone interacts.

  • Remove or delay non-essential scripts, such as unused chat widgets, heavy tracking tags and unused plugin features.
  • Be careful with page builders and add-ons that load large scripts on every page.
  • Keep menus, accordions and forms simple. Native HTML elements, such as the details element for an accordion, are often lighter than custom scripts.
  • Test real interactions: open the menu, submit a form, open an accordion, and use the Performance panel in Chrome DevTools to see long tasks.

How to improve CLS (visual stability)

Layout shifts happen when something appears or resizes after the page has started showing.

  • Set width and height on images and videos so the browser reserves space. WordPress adds these automatically for images inserted through the editor.
  • Reserve space for banners, embeds and ads instead of inserting them above existing content.
  • Load web fonts carefully so text does not jump when the font changes.
  • Avoid pop-ups that push content down; if you use one, overlay it instead.

A simple workflow for a WordPress site

  1. Run PageSpeed Insights on your home page and one or two key landing pages, for mobile first.
  2. Note which metric fails and which element is identified as the LCP element or the source of shifts.
  3. Fix one cause at a time, for example compress the hero image, then retest.
  4. After real users have visited for a few weeks, check the Core Web Vitals report in Search Console to confirm improvement in field data.
  5. Recheck after adding new plugins, widgets or design changes.

Keep it in perspective

Google’s guidance is to focus on overall page experience and on content that helps people. Core Web Vitals are one part of that picture. A fast page with unhelpful content will still struggle, and a very useful page is not usually held back by small differences in scores. Fix clear problems, especially on mobile, without chasing a perfect lab score.

Common questions

Why do my PageSpeed Insights scores change every time I test?

The performance score at the top comes from a lab test, which can vary with network conditions and server response. The field data section (from real users) changes more slowly because it covers a 28-day period. Make decisions based on repeated tests and field data, not a single run.

My site has no field data. What should I do?

Small sites often do not have enough Chrome users for field data. Use lab tests to find problems, fix obvious issues such as oversized images and heavy scripts, and test on a real mid-range phone.

Is a score of 100 necessary?

No. Aim to pass the Core Web Vitals thresholds and give people a fast, stable experience. Chasing a perfect lab score often costs time that is better spent on content and usability.

Next step

Performance is one part of technical SEO. Continue with how search engines crawl, index and rank pages and structured data and schema markup. For practice auditing real sites, see SEO portfolio projects and interview preparation. This guide is part of Module 4 of our free SEO course (Technical SEO). Image optimisation, caching and page speed for WordPress sites are practised in Module 5 of our WordPress Course in Pune.

Sources (checked 14 October 2026): web.dev: Web Vitals and web.dev: INP becomes a Core Web Vital on March 12.