Core Web Vitals: Optimize LCP, INP & CLS
Core Web Vitals (CWV) are a set of specific factors that Google considers highly important in a webpage's overall user experience. They measure real-world user experience for loading performance, interactivity, and visual stability of the page.
1. What are Core Web Vitals?
Introduced by Google, Core Web Vitals were originally part of the broader “page experience” system. Google has since retired that as a standalone ranking system and discontinued its Search Console report – the Core Web Vitals now stand on their own. Instead of just looking at generic page load time, CWV focuses on metrics that directly impact how a user feels when interacting with your site. Are they waiting too long to see the main image? Is the site unresponsive when they click a button? Is the text jumping around while they try to read?
2. Largest Contentful Paint (LCP)
What it measures: Loading Performance.
LCP measures the time it takes for the largest text block or image element visible within the viewport to fully render on the screen. It tells the user that the main content of the page has actually loaded.
- Good: 2.5 seconds or less
- Needs Improvement: 2.5 to 4.0 seconds
- Poor: Longer than 4.0 seconds
How to improve LCP:
- Optimize and compress images (use modern formats like WebP or AVIF).
- Implement lazy loading (but never lazy-load your LCP image!).
- Improve server response times (Time to First Byte - TTFB) via caching or a CDN.
- Eliminate or defer render-blocking JavaScript and CSS.
3. Interaction to Next Paint (INP)
What it measures: Interactivity and Responsiveness.
Note: INP officially replaced First Input Delay (FID) in March 2024.
INP observes the latency of all click, tap, and keyboard interactions a user has with a page throughout its lifespan. It reports the longest single delay. If a user clicks an "Add to Cart" button, INP measures how long it takes for the page to visually update and acknowledge that click.
- Good: 200 milliseconds or less
- Needs Improvement: 200 to 500 milliseconds
- Poor: Longer than 500 milliseconds
How to improve INP:
- Minimize main thread work by reducing JavaScript execution time.
- Break up long, complex JavaScript tasks into smaller chunks.
- Remove unused third-party scripts (like heavy tracking pixels or chat widgets).
4. Cumulative Layout Shift (CLS)
What it measures: Visual Stability.
Have you ever been about to click a link, but suddenly the page loads an ad, pushes the text down, and you accidentally click something else? That is a layout shift. CLS measures the sum total of all unexpected layout shifts that occur during the entire lifespan of the page.
- Good: 0.1 or less
- Needs Improvement: 0.1 to 0.25
- Poor: Higher than 0.25
How to improve CLS:
- Always include
widthandheightsize attributes on your images and video elements. - Reserve space for ads, embeds, and iframes using CSS aspect ratios.
- Never insert new content above existing content dynamically, unless in response to a user interaction.
- Ensure custom web fonts load smoothly without causing FOUT/FOIT (Flash of Unstyled Text) layout shifts.
Pro Tip: Rank-O-Saur allows you to quickly view the structural elements of your page to ensure images have their dimensions properly declared, helping you prevent CLS issues before they happen.
5. How to Measure Core Web Vitals
Google provides several tools to measure your CWV. It's important to understand the difference between Field Data (real users) and Lab Data (simulated tests):
- Google Search Console: Shows field data based on the Chrome User Experience Report (CrUX) – real measurements from Chrome users, and the authoritative reporting source. Whether Google uses exactly these values as its ranking input is not confirmed; assessment is based on the 75th percentile over 28 days, split by mobile and desktop.
- PageSpeed Insights (PSI): Shows both Field Data (if available) and Lab Data (a simulated Lighthouse run).
- Chrome DevTools (Lighthouse): Shows Lab Data only. Great for debugging issues locally before pushing to production.
6. Why CWV Matters for SEO
Google has explicitly stated that Core Web Vitals are a ranking factor. However, they are part of a tie-breaker system.
Important: Content is still king. A fast website with terrible content will not outrank a slower website with highly relevant, authoritative content. Core Web Vitals act as a tie-breaker when multiple pages have similarly high-quality content.
Beyond rankings, optimizing your CWV drastically improves user retention, lowers bounce rates, and increases e-commerce conversion rates. Users hate waiting, and they hate glitchy websites. Optimizing for CWV is optimizing for your customers.
7. Quick reference: thresholds
Each metric has to meet its threshold at the 75th percentile of real page loads, measured over the trailing 28 days. Meeting it on average is not sufficient.
| Metric | Good | Needs improvement | Poor |
|---|---|---|---|
| LCP - Largest Contentful Paint | up to 2.5 s | 2.5 s to 4.0 s | over 4.0 s |
| INP - Interaction to Next Paint | up to 200 ms | 200 ms to 500 ms | over 500 ms |
| CLS - Cumulative Layout Shift | up to 0.1 | 0.1 to 0.25 | over 0.25 |
8. Frequently asked questions
Are Core Web Vitals actually a ranking factor?
Yes, as part of the page experience signals — but a comparatively small one. They act mainly as a tiebreaker between pages of similar relevance. Strong content on a slow page usually still outranks weak content on a fast one.
What is the difference between lab data and field data?
Lab data (for example Lighthouse) comes from a single simulated run under fixed conditions and is useful for debugging. Field data comes from the Chrome UX Report and reflects real visits over the trailing 28 days. Google uses field data for ranking purposes.
Which metric replaced First Input Delay?
Interaction to Next Paint (INP) replaced FID in March 2024. INP measures the full latency of interactions throughout the visit rather than only the first one, which makes it a far stricter and more representative responsiveness metric.
What are the thresholds for a good rating?
LCP at 2.5 seconds or less, INP at 200 milliseconds or less, and CLS at 0.1 or less. Each threshold has to be met at the 75th percentile of page loads, so it is not enough for the average visit to be fast.
Read next
