Guides / Websites, stores & conversion

Core Web Vitals explained: what LCP, INP and CLS mean for your website

Core Web Vitals are three measures of real visitors' experience: Largest Contentful Paint (how fast the main content appears, good within 2.5 s), Interaction to Next Paint (how quickly the page responds to taps, good within 200 ms) and Cumulative Layout Shift (how much the page jumps around, good within 0.1). They're judged at the 75th percentile of visits. Check them in Search Console and PageSpeed Insights, then fix the usual causes: heavy images, too many scripts and apps, and content that loads late without reserved space.

By Ahmed Mohamed · Updated · Prices and features checked 23 October 2026

“Is our website fast enough?” is hard to answer by feel. Google’s Core Web Vitals give a measurable answer, based on what real visitors experience.

The three metrics

Metric Measures Good Poor
LCP (Largest Contentful Paint) How long until the main content (usually the hero image or headline) appears ≤ 2.5 s > 4 s
INP (Interaction to Next Paint) How quickly the page responds when someone taps or clicks ≤ 200 ms > 500 ms
CLS (Cumulative Layout Shift) How much content jumps around while loading ≤ 0.1 > 0.25

Google’s guidance is to look at the 75th percentile of page loads, split by mobile and desktop: a page passes if at least 75% of visits meet the “good” threshold.

INP replaced the older First Input Delay (FID) metric as a Core Web Vital in 2024.

Lab data vs field data

  • Field data comes from real Chrome users (the Chrome UX Report). It’s what Search Console’s Core Web Vitals report and the top of PageSpeed Insights show, when your site has enough traffic.
  • Lab data is a simulated test (Lighthouse) from one device and connection. Useful for diagnosing, but it can differ from real visitors.

Small sites often don’t have enough traffic for page-level field data. Then use the origin-level data and lab tests on key templates.

How to check

  1. Search Console → Core Web Vitals: pages grouped as Good, Needs improvement or Poor, by mobile and desktop.
  2. PageSpeed Insights on your key templates: homepage, a service or product page, a collection or blog page, checkout or contact.
  3. Test on a real mid-range phone over mobile data, not only on office Wi-Fi.

Common causes and fixes

Slow LCP

  • Huge images: compress, resize to the display size, use modern formats (WebP/AVIF).
  • Hero image loaded late: don’t lazy-load the main image above the fold; consider preloading it.
  • Slow hosting or no caching / CDN.
  • Render-blocking scripts and fonts: fewer fonts, load non-essential scripts later.

Poor INP

  • Too much JavaScript: chat widgets, trackers, pop-ups, sliders, and on stores, apps that each add scripts.
  • Long tasks on tap: heavy menus, filters or add-to-cart scripts.
  • Remove what you don’t use; delay non-essential scripts until after interaction.

High CLS

  • Images without dimensions: set width and height so space is reserved.
  • Banners, cookie bars and pop-ups pushing content down: overlay them or reserve space.
  • Web fonts swapping with different sizes.
  • Ads or embeds without reserved space.

How much do they matter?

Core Web Vitals are part of Google’s page experience signals, but good content that matches the search still matters most. The bigger reason to care is people: slow, jumpy pages lose visitors before they read your offer or tap your button. See website conversion optimisation.

Platform notes

  • Shopify: theme choice and apps decide most of it. Remove unused apps and check for leftover code.
  • WordPress: hosting quality, caching, a lightweight theme and fewer plugins.
  • Website builders: fewer levers, so keep pages simple and images light.

Frequently asked questions

Our PageSpeed score is 60. Is that bad?

The score is a lab summary. Look first at whether field data passes the three thresholds. A modest lab score with passing field data is fine.

Do we need a developer?

Images, apps and plugins you can often handle yourself. Script loading, theme code and hosting changes usually need a developer.

How often should we check?

Monthly in Search Console, and after any theme change, new app or plugin, or redesign.

If you’d like your site’s speed checked and fixed, that’s part of our website service.

Free download · Excel checklist

Core Web Vitals check and fix list

Record LCP, INP and CLS for your key page templates from PageSpeed Insights, see which pass, and work through the common fixes for each metric.

Download it

No sign-up. Opens in Excel, Google Sheets or Numbers.

Rather have it done?

This is the kind of work our website service covers. Tell us where you are today and we’ll reply with a plan and a fixed price.

Let’s talk

Sources

  1. web.dev: Web Vitals
  2. web.dev: Largest Contentful Paint (LCP)
  3. web.dev: Interaction to Next Paint (INP)
  4. web.dev: Cumulative Layout Shift (CLS)
  5. PageSpeed Insights

Written by

Ahmed Mohamed, Growth marketer, Jinnflow. Ahmed has worked in growth marketing for 6 years. At Jinnflow, Ahmed builds the systems behind client work (websites, stores, CRMs and the integrations that connect them) and writes the technical guides.