Core Web Vitals

Core Web Vitals (CWV) are three specific metrics Google uses to evaluate the real-world user experience of a web page. They measure loading performance, interactivity, and visual stability. As of 2024, the three metrics are: LCP (Largest Contentful Paint), INP (Interaction to Next Paint, which replaced FID), and CLS (Cumulative Layout Shift).

Why it matters: Core Web Vitals are a confirmed Google ranking factor. Pages that pass all three thresholds get a ranking boost relative to pages that fail. Beyond SEO, these metrics directly correlate with business outcomes. Google's own research shows that when a site meets CWV thresholds, users are 24% less likely to abandon page loads. For e-commerce, every 100ms of added load time correlates with roughly a 1% drop in conversion rate.

The three metrics explained: LCP measures how long it takes for the largest visible element (usually a hero image or headline) to render. Target: under 2.5 seconds. INP measures the delay between a user interaction (click, tap, keypress) and the browser's visual response. Target: under 200 milliseconds. CLS measures unexpected layout shifts during the page lifecycle (when elements move after loading). Target: under 0.1.

How to measure: Google Search Console provides a Core Web Vitals report based on real user data (CrUX data). PageSpeed Insights and Lighthouse (built into Chrome DevTools) measure CWV for individual pages. Web-vitals.js is an open-source library you can embed in your site to collect real user CWV data and send it to your analytics tool.

How to improve: for LCP, optimize images (use WebP/AVIF, set explicit dimensions, use priority loading for above-the-fold images), preload critical resources, and use a CDN. For INP, reduce JavaScript execution time, break up long tasks, and defer non-critical scripts. For CLS, always set width and height attributes on images and iframes, avoid dynamically injected content above the fold, and use CSS containment.

Common mistakes: optimizing based on lab data (Lighthouse) while ignoring field data (real users). Lab tests run on fast machines and fast networks. Your actual users may be on slow mobile devices. Also, fixing CWV for the homepage but ignoring inner pages, which is where most organic traffic lands.

Practical example: a content site has LCP of 4.2 seconds on blog posts due to unoptimized hero images. They convert images to WebP, add explicit dimensions, implement lazy loading for below-fold images, and add a priority hint to the hero image. LCP drops to 1.8 seconds. Over the next two months, organic impressions increase 12% as Google rewards the improved experience.