Core Web Vitals
Session 7.3 · ~5 min read
Core Web Vitals (CWV) are Google's metrics for measuring real-world user experience on web pages. Since 2021, they have been a ranking factor. While CWV alone will not make or break your search rankings, poor performance can hurt your visibility, and that includes the entity pages that carry your most important signals.
Google cares about Core Web Vitals because users care about page experience. A page that loads slowly, shifts around while loading, or takes too long to respond to interactions creates frustration. Google does not want to rank pages that frustrate users, regardless of how good the content is.
The Three Core Web Vitals
Google measures page experience through three specific metrics. Each targets a different aspect of the user experience.
Largest Contentful Paint
Loading Speed"] A --> C["INP
Interaction to Next Paint
Responsiveness"] A --> D["CLS
Cumulative Layout Shift
Visual Stability"] B --> B1["Measures how fast
the main content loads"] C --> C1["Measures how fast
the page responds to clicks"] D --> D1["Measures how much
the page layout shifts"] style A fill:#222221,stroke:#c8a882,color:#ede9e3 style B fill:#222221,stroke:#6b8f71,color:#ede9e3 style C fill:#222221,stroke:#6b8f71,color:#ede9e3 style D fill:#222221,stroke:#6b8f71,color:#ede9e3
CWV Thresholds
Each metric has three performance ranges: Good, Needs Improvement, and Poor. Google evaluates your pages using the 75th percentile of real user data, meaning the threshold that 75% of your visitors experience.
| Metric | Good | Needs Improvement | Poor | What It Measures |
|---|---|---|---|---|
| LCP (Largest Contentful Paint) | ≤ 2.5 seconds | 2.5s - 4.0s | > 4.0 seconds | Time until the largest visible content element renders (hero image, heading block, etc.) |
| INP (Interaction to Next Paint) | ≤ 200 milliseconds | 200ms - 500ms | > 500 milliseconds | Time from user interaction (click, tap, key press) to the next visual update |
| CLS (Cumulative Layout Shift) | ≤ 0.1 | 0.1 - 0.25 | > 0.25 | Total of unexpected layout shifts during the page's lifespan (unitless score) |
Key concept: Core Web Vitals are measured on real user data, not lab tests. Google uses the Chrome User Experience Report (CrUX) to collect field data from actual visitors. If your site does not have enough traffic for field data, Google uses lab estimates from Lighthouse.
LCP: Largest Contentful Paint
LCP measures loading performance. Specifically, it measures the time from when a user navigates to a page until the largest content element in the viewport finishes rendering. This is usually a hero image, a large heading, or a block of text.
Common LCP problems and fixes:
- Slow server response time: Optimize your hosting, use a CDN, implement server-side caching.
- Large hero images: Compress images, use WebP format, set explicit width and height attributes, use responsive images with srcset.
- Render-blocking resources: Defer non-critical CSS and JavaScript. Inline critical CSS.
- Lazy-loaded LCP element: Never lazy-load the element that will be measured as the LCP. It should load immediately.
INP: Interaction to Next Paint
INP replaced First Input Delay (FID) in March 2024 as the responsiveness metric. It measures how quickly the page responds to all user interactions throughout the page visit, not just the first one.
Common INP problems and fixes:
- Long JavaScript tasks: Break large JavaScript functions into smaller tasks using
requestAnimationFrameorsetTimeout. - Heavy third-party scripts: Audit your third-party scripts. Analytics, chat widgets, and ad scripts are common offenders.
- Excessive DOM size: Pages with thousands of DOM elements are slower to update. Simplify your page structure.
CLS: Cumulative Layout Shift
CLS measures visual stability. When elements on a page move unexpectedly after loading, that is a layout shift. A common example: you start reading text, then an ad loads above it and pushes everything down. CLS captures the severity of these shifts.
Common CLS problems and fixes:
- Images without dimensions: Always include width and height attributes on images and videos.
- Ads or embeds without reserved space: Use CSS to reserve space for elements that load asynchronously.
- Web fonts causing flash: Use
font-display: swapand preload important fonts. - Dynamic content insertion: Avoid inserting content above existing content after page load.
CWV Impact on Rankings
Google has been clear that Core Web Vitals are a ranking signal but not the strongest one. Relevant, high-quality content will still outrank a page with perfect CWV scores. However, when two pages have similar content quality and relevance, CWV can be the tiebreaker.
Sites with all Core Web Vitals in the "Good" range see approximately a 33% rate of top-10 rankings (for their target keywords) and a 22% bounce rate. Sites with all CWV in the "Poor" range see roughly a 19% top-10 rate and a 49% bounce rate. The correlation is not purely causal (better-maintained sites tend to have both good CWV and good content), but the user experience impact is real and measurable.
How to Measure Your Core Web Vitals
| Tool | Data Type | Best For | URL |
|---|---|---|---|
| PageSpeed Insights | Field + Lab | Quick check of any URL, shows CrUX data if available | pagespeed.web.dev |
| Google Search Console | Field (CrUX) | Site-wide CWV overview, identifies problematic URL groups | search.google.com/search-console |
| Chrome DevTools (Lighthouse) | Lab | Detailed diagnostics on a single page, simulated conditions | Built into Chrome browser |
| Web Vitals Extension | Field (your device) | Real-time CWV monitoring as you browse your own site | Chrome Web Store |
| CrUX Dashboard | Field | Historical CWV trends for your domain over time | g.co/chromeuxdash |
For entity authority purposes, focus on the CWV scores of your entity-critical pages: homepage, about, contact, and service pages. These pages carry your structured data, entity descriptions, and NAP information. If they load slowly or shift unexpectedly, both users and Google have a degraded experience of your entity.
Further Reading
- Google. "Web Vitals." web.dev/articles/vitals
- Google. "Interaction to Next Paint (INP)." web.dev/articles/inp
- Google. "Core Web Vitals Report." Google Search Central. support.google.com/webmasters/answer/9205520
- Barry, Philip Walton. "Optimizing Largest Contentful Paint." web.dev. web.dev/articles/optimize-lcp
Assignment
- Run PageSpeed Insights (pagespeed.web.dev) on your homepage, About page, and one service page. Record the LCP, INP, and CLS scores for each. Note whether they fall into Good, Needs Improvement, or Poor.
- Open Google Search Console and check the Core Web Vitals report (Experience > Core Web Vitals). Record the number of URLs with Good, Needs Improvement, and Poor status for both mobile and desktop.
- For any page with a "Poor" CWV score, identify the primary issue using the PageSpeed Insights diagnostics section. Write down the specific fix needed.
- Check if your homepage hero image has explicit width and height attributes set. If not, add them to prevent CLS.
- Install the Web Vitals Chrome extension and browse your entity-critical pages. Note any pages where CLS or INP spikes during interaction.