What Are Core Web Vitals?
Core Web Vitals are a standardized set of user experience metrics Google uses as ranking signals in its search algorithm. They measure three dimensions of page experience: loading speed, interactivity, and visual stability. Since the May 2021 Page Experience update, they have been official ranking factors — and their weight has increased in every subsequent core update.
LCP: Largest Contentful Paint
LCP measures the time from page load start until the largest visible content element (typically a hero image, video thumbnail, or large text block) is fully rendered. It's Google's proxy for "how fast does this page feel to load?"
| LCP Score | Rating | SEO Impact |
|---|---|---|
| < 2.5 seconds | 🟢 Good | No ranking penalty |
| 2.5 – 4.0 seconds | 🟡 Needs Improvement | Moderate penalty |
| > 4.0 seconds | 🔴 Poor | Significant ranking penalty |
How to Fix LCP
- Preload your LCP element: Add
<link rel="preload" as="image" href="hero.webp">in<head> - Serve images in WebP or AVIF — 30-50% smaller than JPEG with equivalent quality
- Use a CDN to serve assets from edge nodes near the user
- Eliminate render-blocking CSS/JS — defer non-critical scripts
- Upgrade hosting — shared hosting TTFB above 600ms is a common LCP killer
INP: Interaction to Next Paint
INP replaced FID (First Input Delay) in March 2024 as a Core Web Vital. It measures the responsiveness of all user interactions (clicks, taps, key presses) throughout the entire page session, not just the first one. Target: under 200ms.
How to Fix INP
- Break up long JavaScript tasks into smaller chunks using
setTimeoutorrequestIdleCallback - Avoid heavy event handlers — don't put complex logic in click handlers
- Use CSS animations instead of JavaScript for visual effects — they run on the GPU compositor thread
- Reduce third-party scripts (chat widgets, analytics) — these are responsible for ~40% of INP failures
CLS: Cumulative Layout Shift
CLS measures unexpected visual layout shifts — elements that jump around as the page loads. A CLS score above 0.1 means users are accidentally clicking the wrong things as content shifts.
Common CLS Causes & Fixes
| Cause | Fix |
|---|---|
| Images without width/height attributes | Always set explicit dimensions: width="800" height="450" |
| Late-loading ads or embeds | Reserve space with min-height or aspect-ratio CSS |
| Web fonts causing FOUT/FOIT | Use font-display: swap and preload critical fonts |
| Dynamic content injected above fold | Inject below existing content or use fixed-height containers |
Interaction Value: Google's Experimental New Metric
Google is currently testing an experimental metric called Interaction Value — an AI-derived score that measures the utility a page delivers per second of user engagement. Unlike CWV which measure technical performance, Interaction Value attempts to quantify whether the user actually accomplished their goal.
Core Web Vitals Audit Tools
- Google Search Console → Core Web Vitals report — real user data (CrUX), segmented by mobile/desktop
- PageSpeed Insights — lab data + field data for any URL
- Chrome DevTools → Performance tab — frame-by-frame analysis
- WebPageTest.org — advanced waterfall analysis, multi-step user journeys
- Lighthouse CI — automated auditing in your CI/CD pipeline