What are Core Web Vitals?

Core Web Vitals are a set of real-world performance metrics that Google uses to measure user experience on websites. They became official ranking signals as part of Google's Page Experience update, and as of 2024 they include three metrics: LCP, INP, and CLS.

Google measures these from real Chrome user data (called the Chrome User Experience Report, or CrUX). A site doesn't just need to score well in a lab test - it needs to deliver good experiences to its actual visitors. That distinction matters.

Loading speed
LCP
Largest Contentful Paint
Good: <= 2.5 seconds
How long it takes for the largest visible element (usually a hero image or heading) to load.
Responsiveness
INP
Interaction to Next Paint
Good: <= 200ms
How quickly the page responds visually after a user clicks, taps, or types. Replaced FID in March 2024.
Visual stability
CLS
Cumulative Layout Shift
Good: <= 0.1
How much elements on the page unexpectedly move around as it loads - the "jumping text" problem.

FID is gone. Here's why your INP score might surprise you.

If you haven't reviewed your Core Web Vitals since 2023, there's one critical change: FID (First Input Delay) was retired and replaced by INP (Interaction to Next Paint) on 12 March 2024.

FID only measured the delay before a browser started processing the first user interaction. INP is more demanding - it measures the full visual response time across all interactions on a page during a visit, and uses the worst-performing one as the score. Many sites that had a "Good" FID score discovered they had a "Poor" INP when they switched.

Check your INP now: Open Google Search Console -> Core Web Vitals report. Sites that haven't checked since early 2024 often find unexpected INP failures. The biggest culprits: heavy JavaScript, third-party scripts (live chat, analytics, ads), and unoptimised event handlers.

Three tools, three different answers - use all of them

Three tools, used in combination, give you the full picture:

  1. Google Search Console -> Core Web Vitals report. Shows real-user data segmented by mobile and desktop. This is the authoritative score Google uses for ranking.
  2. PageSpeed Insights (pagespeed.web.dev). Enter any URL to see lab measurements plus the real-user data from CrUX. Gives specific fix recommendations.
  3. Chrome DevTools -> Performance panel. Lets you profile individual interactions and diagnose INP issues at a code level.

Fixing LCP: the fastest wins

LCP is almost always a loading problem. The biggest gains come from:

  • Image optimisation: Compress hero images to WebP format. A 2MB JPEG becoming a 60KB WebP can shave 2+ seconds from LCP alone.
  • Preload the LCP element: Add <link rel="preload"> to tell the browser to fetch the hero image immediately, before parsing other resources.
  • Eliminate render-blocking resources: Scripts and stylesheets that load in the <head> delay page rendering. Defer non-critical JS, inline critical CSS.
  • Use a CDN: For Australian audiences, a CDN with AU edge nodes (Cloudflare, Fastly) reduces time-to-first-byte significantly versus hosting only in the US or Singapore.

Fixing INP: hunt down what's blocking the main thread

INP failures are usually JavaScript-related. The browser's main thread gets blocked by long tasks (anything over 50ms), making the page feel unresponsive to taps and clicks.

  • Audit third-party scripts: Live chat widgets, tag managers, marketing pixels - these are the most common INP killers. Test with them blocked to isolate the culprit.
  • Break up long tasks: Large JS bundles that run synchronously block the main thread. Use setTimeout(0) or the Scheduler API to yield control back to the browser between tasks.
  • Lazy-load off-screen content: Defer loading components that aren't visible on first paint - especially carousels, widgets, and comment sections.
  • Reduce DOM size: Pages with 1,000+ DOM elements become slow to update. Virtualise long lists; remove unused elements from the HTML.

Fixing CLS: set dimensions, prevent shifts

CLS is the most solvable of the three. Most layout shifts have straightforward fixes:

  • Always specify width and height on images. This lets the browser reserve space before the image loads. Without dimensions, images cause layout shifts as they pop in.
  • Reserve space for ads and embeds. If an ad slot loads content asynchronously, give the container a minimum height so it doesn't push content down.
  • Avoid inserting content above existing content. Banners, cookie notices, or dynamic elements added above the fold after page load are the most disruptive CLS sources.
  • Use font-display: optional or preload web fonts. Custom fonts that load late can cause text to reflow and shift surrounding elements.

Do Core Web Vitals actually affect rankings?

Yes - but they're a tiebreaker, not a primary signal. Google has been clear that content relevance and authority outweigh CWV. A page with "Poor" vitals can still rank #1 if it's the best answer to a query. But between two equally relevant pages, the one with better CWV wins. And in competitive industries where pages are close in quality, that tiebreaker matters.

More practically: this isn't really an SEO problem. Google's own research shows mobile bounce probability jumps 90% as LCP goes from 1 to 5 seconds - that's lost revenue whether or not it moves your rankings.

Know your scores are bad but not sure which fix to prioritise?

That's the actual hard part. Our technical SEO service audits every page against LCP, INP, and CLS, then fixes the ones costing you rankings and conversions - not just a report telling you what you already suspected.