Google has been telling us page experience matters for rankings since 2021. Most site owners nodded, ran PageSpeed Insights once, saw a bunch of numbers they didn’t understand, and moved on.
Meanwhile, their pages load in 4+ seconds, shift around while loading, and take forever to respond to clicks. And they wonder why a technically weaker competitor with faster pages is outranking them.
Core Web Vitals aren’t vanity metrics. They’re the three specific measurements Google uses to evaluate how your pages feel to real users. And they’re a confirmed ranking signal.
What Are Core Web Vitals?
Core Web Vitals are three metrics that measure the loading performance, interactivity, and visual stability of your pages:
LCP (Largest Contentful Paint)
How long it takes for the biggest visible element — usually a hero image, video thumbnail, or large text block — to finish rendering. This is the user’s perception of “the page loaded.”
-
Good: under 2.5 seconds
-
Needs improvement: 2.5 to 4 seconds
-
Poor: over 4 seconds
INP (Interaction to Next Paint)
Replaced FID (First Input Delay) in March 2024. INP measures the delay between a user interaction (click, tap, keypress) and the visual response. It captures the full page lifecycle, not just the first interaction.
-
Good: under 200 milliseconds
-
Needs improvement: 200 to 500 milliseconds
-
Poor: over 500 milliseconds
CLS (Cumulative Layout Shift)
Measures how much the page layout shifts unexpectedly during loading. Those annoying jumps when an ad loads, a font swaps, or an image renders without reserved dimensions — that’s CLS.
-
Good: under 0.1
-
Needs improvement: 0.1 to 0.25
-
Poor: over 0.25
Why Core Web Vitals Matter for SEO
Core Web Vitals are a ranking factor. Not the biggest one — content relevance and backlinks still dominate — but they’re a tiebreaker. When two pages are otherwise equal in authority and relevance, the one with better Core Web Vitals wins.
More importantly, Core Web Vitals affect user behavior, which affects SEO indirectly:
-
Slow pages have higher bounce rates. A 1-second delay in LCP correlates with roughly a 7% drop in conversions.
-
Janky layouts (high CLS) frustrate users and erode trust. If your page shifts and the user clicks the wrong button, they’re gone.
-
Sluggish interactions (poor INP) make your site feel broken, even if it’s not.
Users don’t separate “slow site” from “untrustworthy site.” They just leave. And Google measures that behavior.
How to Check Your Core Web Vitals
Lab data vs. field data
This distinction trips people up. Lab data (from PageSpeed Insights, Lighthouse) is synthetic — it simulates a page load under controlled conditions. Field data (from Chrome User Experience Report) comes from real users visiting your site.
Google uses field data for rankings. Lab data is useful for debugging, but your CrUX scores are what count.
Tools for checking
PageSpeed Insights — shows both lab and field data. The top section (if available) shows real-user data from CrUX. The bottom shows Lighthouse lab results.
Google Search Console — Core Web Vitals report groups your URLs by good, needs improvement, or poor. Shows aggregate field data across your entire site.
Chrome DevTools — Performance panel gives detailed lab data with waterfall timelines. Best for diagnosing specific issues on specific pages.
Or check your Core Web Vitals with our tool for a quick assessment alongside your other SEO health signals.
How to Fix Poor LCP
LCP is usually the easiest to improve because it’s a loading problem with well-known solutions:
Optimize your largest image. If your LCP element is a hero image, compress it (WebP or AVIF format), serve the right size for the viewport, and add fetchpriority="high" and loading="eager" attributes.
Eliminate render-blocking resources. CSS and JavaScript in the <head> block rendering. Inline critical CSS, defer non-critical CSS, and add defer or async to script tags.
Use a CDN. Serve assets from edge locations close to your users. Cloudflare, Fastly, or CloudFront can cut hundreds of milliseconds off LCP.
Preconnect to critical origins. If your fonts come from Google Fonts or your images from a CDN, add <link rel="preconnect"> tags so the browser starts the connection early.
Fix server response time. If your Time to First Byte (TTFB) is over 600ms, your server is the bottleneck. Upgrade hosting, add caching, or move to a static site generator.
How to Fix Poor INP
INP is harder to fix because it’s about JavaScript execution — the main thread being blocked by heavy scripts.
Break up long tasks. Any JavaScript task that runs longer than 50ms blocks the main thread. Use requestAnimationFrame, setTimeout, or the Scheduler API to break long tasks into smaller chunks.
Reduce JavaScript. Audit your bundle. Remove unused libraries, lazy-load non-critical scripts, and consider lighter alternatives (e.g., Preact instead of React for simple pages).
Debounce input handlers. If your click/scroll/input handlers do heavy work, debounce them so they don’t fire on every event.
Use web workers. Move heavy computation off the main thread entirely. Web workers run in the background and don’t block user interactions.
How to Fix Poor CLS
CLS is usually the simplest to fix but requires attention to detail:
Set explicit dimensions on images and videos. Always include width and height attributes (or use CSS aspect-ratio). This reserves space before the content loads.
Reserve space for ads and embeds. If you have ads, set minimum height on ad containers so the layout doesn’t shift when the ad renders.
Avoid inserting content above existing content. Banners, cookie notices, and notification bars that push content down cause CLS. Use sticky positioning or overlays instead.
Preload fonts or use font-display: swap with size-adjust. Font loading causes layout shifts when the fallback font has different dimensions than the web font. The size-adjust CSS property can match fallback dimensions to minimize the shift.
Core Web Vitals by Page Type
Different pages have different challenges:
Homepage — usually image-heavy. Focus on LCP (hero image optimization) and CLS (above-the-fold stability).
Blog posts — ad-heavy blogs struggle with CLS and INP. Reserve ad space, lazy-load below-fold images, minimize third-party scripts.
Product pages — image carousels, reviews, and recommendation widgets cause CLS and INP issues. Lazy-load below-fold content, optimize carousel interactions.
Landing pages — often loaded with analytics and marketing scripts. Defer everything non-essential, inline critical CSS, optimize the primary CTA’s responsiveness.
Measure, Fix, Verify
Core Web Vitals aren’t a one-time fix. New features, updated libraries, and content changes can regress your scores. Build performance checks into your deployment pipeline.
Check your Core Web Vitals now to see where your site stands. For the full picture of your site’s health, run a free marketing audit — it covers Core Web Vitals alongside technical SEO, content quality, and everything else that affects your search visibility.
Fast, stable, responsive pages don’t just rank better. They convert better. Every millisecond counts.