Core Web Vitals became a confirmed Google ranking factor in 2021 and the metric set has evolved since then — most significantly with the replacement of FID by INP in March 2024. I cover the current state of these metrics in Phoenix SEO training as part of the technical SEO module. Most people involved in SEO have heard of Core Web Vitals. Far fewer have a working understanding of what they actually measure, how to diagnose failures accurately, or which specific fixes produce meaningful improvements versus which ones just move the score in a test tool without changing real-user experience. I cover this in my SEO training because the misinformation here is dense and the implementation mistakes are expensive.

The Three Metrics and What They Actually Measure

LCP — Largest Contentful Paint: How long it takes for the largest visible content element to render completely for the user. In practice, the LCP element is almost always a hero image or a large headline block. The threshold is under 2.5 seconds for ‘Good’ status; 2.5 to 4.0 seconds is ‘Needs Improvement’; above 4.0 seconds is ‘Poor.’ LCP is the metric most sites fail and it is almost always an image delivery or server response time problem at its root.

INP — Interaction to Next Paint: Measures the latency between any user interaction (click, tap, keypress) and the browser’s next visual response. A poor INP means the page feels sluggish and unresponsive to the user even if it loaded quickly. The threshold is under 200ms for ‘Good’; 200 to 500ms is ‘Needs Improvement’; above 500ms is ‘Poor.’ Long JavaScript execution tasks on the main thread are the primary culprit.

CLS — Cumulative Layout Shift: Measures how much visible content shifts unexpectedly as the page loads and as additional resources arrive. Images without explicit dimensions, ads injected into the content flow, and late-loading web fonts all cause layout shift. The threshold is under 0.1 for ‘Good’; 0.1 to 0.25 is ‘Needs Improvement’; above 0.25 is ‘Poor.’ CLS is typically the easiest to diagnose and the easiest to fix once you know where the shifts are coming from.

Lab Data vs. Field Data: A Critical Distinction

There are two types of Core Web Vitals data and confusing them leads to wasted effort. Lab data comes from tools like Google PageSpeed Insights or Lighthouse — they simulate a page load in a controlled environment with defined network conditions and device specs. Field data comes from real users visiting your actual site over the previous 28 days, reported through the Chrome User Experience Report (CrUX) and surfaced in Google Search Console and PageSpeed Insights.

Field data is what Google uses as a ranking signal. Lab data is useful for diagnosing what to fix. Do not optimize exclusively for lab scores — a page can score well in Lighthouse while real users on slower connections and older devices have a poor experience. This gap matters especially for small business SEO, where many customers are browsing on mid-range mobile devices over variable connections. Do not ignore lab data either — it is the fastest diagnostic tool available. Use both, and anchor your success metric to field data improvement in Search Console. I explain how to read both data sources in my Google Search Console training resource where the Core Web Vitals report lives.

Diagnosing and Fixing LCP

The first step in fixing LCP is identifying which element is the LCP element for your key pages. PageSpeed Insights will tell you what it is. On most content sites and ecommerce stores, it is the hero image. On text-heavy pages, it may be a large heading block. On pages with video, it could be the video thumbnail.

For hero images, the highest-impact interventions:

  • Preload the LCP image with <link rel=’preload’ as=’image’> in the page head so the browser discovers and fetches it before it finishes parsing the full HTML document
  • Serve the image in WebP or AVIF format at the appropriate dimensions for each viewport — do not serve a 2400px desktop image to a 390px mobile screen and rely on CSS to scale it down (a fix I walk through hands-on in Tempe SEO training sessions using participant sites)
  • Serve images through a CDN so they are delivered from a location geographically near the user, reducing transfer time
  • Ensure your server’s Time to First Byte (TTFB) is under 800ms — a slow server delays every subsequent resource and a slow TTFB will drag LCP regardless of image optimization

The Salterra team handles Core Web Vitals remediation for clients who have been stuck in the ‘Needs Improvement’ range and cannot identify the root cause through tools alone. The diagnosis process is systematic, not intuitive.

Diagnosing and Fixing CLS

Every image, video, and embedded element on your page should have explicit width and height attributes defined in the HTML so the browser can reserve the correct space before those resources load. This single change resolves the majority of CLS issues on content sites and ecommerce product pages — images loading and pushing content down is the most common CLS source by far.

Other common CLS sources:

  • Ad slots injected dynamically into the content flow after initial render — reserve the space explicitly in your layout even before the ad loads
  • Web fonts causing text reflow (FOUT — flash of unstyled text, or FOIT — flash of invisible text) — use font-display: swap and preload your critical web fonts
  • Dynamic banners, cookie notices, or chat widgets that push page content down after the initial render
  • Lazy-loaded images that do not have reserved dimensions — lazy loading the image is correct, but the space still needs to be reserved

Diagnosing and Fixing INP

A poor INP almost always means your JavaScript is running long tasks on the browser’s main thread that delay its ability to respond to user input. The diagnostic tool is Chrome DevTools’ Performance panel — record an interaction, look for long tasks (tasks over 50ms shown as red in the timeline), and identify what scripts are running during those tasks.

Common INP culprits: large third-party scripts (live chat, session recording, tag managers firing many tags), inefficient event listeners that do too much work synchronously, and heavy client-side rendering frameworks that re-render large component trees in response to small state changes. Solutions include breaking long tasks into smaller asynchronous chunks, moving expensive computation to web workers, deferring non-critical scripts, and auditing your third-party tag footprint.

This is developer-level work, but understanding what to diagnose and what to request is a trainable skill. If you want in-person instruction on this and similar topics, SEO classes in Phoenix covers the structured options available in the area. Inside the SEO University cohort, I cover INP diagnosis in enough depth that a marketing lead can have a productive technical conversation with their developer about what to fix and why. The full Core Web Vitals curriculum is part of my broader SEO training program.