Core Web Vitals explained in plain English: three numbers Google uses to grade how real visitors feel about your site. If you sell anything online, those three numbers move money. I have spent 16 years and 250+ projects building and rescuing websites for businesses, and Core Web Vitals are the fastest place I find revenue hiding in plain sight. This guide is for business owners, not developers. No code. No jargon. Just what to measure, what good looks like, and what to tell whoever maintains your site.
TL;DR
- Core Web Vitals are three Google metrics that measure loading speed (LCP), responsiveness (INP), and visual stability (CLS).
- Poor scores hurt your Google rankings and your conversion rate. Every extra second of load time drops conversions by about 7% (the same number I cite on my home page, backed by the Imohub case study).
- You can check your scores for free using Google PageSpeed Insights in under 60 seconds.
- Image and font work usually fixes 60% to 70% of LCP problems. Most layout-shift issues take a single CSS change.
- You do not need a rebuild. Targeted fixes on the worst metric first give you the biggest return.
Table of contents
- What are Core Web Vitals
- The three metrics, one at a time
- LCP: how fast your page loads
- INP: how fast your site responds
- CLS: how stable your layout is
- Why these metrics affect your revenue
- How to check your scores (free, 60 seconds)
- How to improve Core Web Vitals
- Cuez: 3 seconds to 300ms in practice
- What to tell your developer
- Reflecting on what owners actually need to know
- FAQ
What are Core Web Vitals
Core Web Vitals are three performance metrics Google uses to measure how real people experience your website. They went live in 2020, became an official ranking factor in 2021, and have been refined since. The idea has stayed the same. If your site is slow, unresponsive, or visually jumpy, you sit lower in search results.
Think of it as a restaurant health inspection. The food can taste great, the room can look beautiful, but a failed kitchen check still drags the rating down. Core Web Vitals are Google's kitchen check for websites.
Three metrics. Each one targets a different visitor frustration. Each has a clear pass/fail threshold. Hit all three and Google calls your page experience "good." Miss one and the whole score suffers.
| Metric | Measures | Good score | Plain English |
|---|---|---|---|
| LCP (Largest Contentful Paint) | Loading speed | Under 2.5 seconds | How long until customers see your page |
| INP (Interaction to Next Paint) | Responsiveness | Under 200 milliseconds | How fast buttons and menus react |
| CLS (Cumulative Layout Shift) | Visual stability | Under 0.1 | Whether the page jumps around while loading |
The rest of this guide breaks each one down, with no code anywhere.
The three metrics, one at a time
Each Core Web Vital targets one specific complaint that visitors actually voice. Google picked these three because their research team found they correlate most strongly with whether someone stays on the page or leaves. I will explain each one with an analogy, no developer tools required.
LCP: how fast your page loads
LCP stands for Largest Contentful Paint. It measures how long it takes for the biggest visible thing on your page to finish loading. Usually that is your hero image, a banner, or the main block of text above the fold.
The restaurant analogy
You walk in, sit down, and wait for a menu. LCP is how long the menu takes to arrive. Ten seconds and you are already annoyed. Two seconds and you barely notice.
Your website is the same. When someone clicks a link to your home page, LCP measures the gap between that click and the moment they can see your main content. Anything before that is a blank or half-loaded screen.
What good looks like
| LCP score | Rating | What visitors experience |
|---|---|---|
| Under 2.5 seconds | Good | Page feels instant; visitors start reading right away |
| 2.5 to 4.0 seconds | Needs improvement | Noticeable wait; some visitors reach for the back button |
| Over 4.0 seconds | Poor | Most mobile visitors are gone |
What causes bad LCP
The usual suspects: large unoptimized images (a 4MB hero photo where a 200KB version would look identical), slow server response times, render-blocking scripts that force the browser to stop and wait, and web fonts that take too long to load.
When I audit websites, unoptimized images account for the majority of LCP problems. A single hero image saved as a PNG instead of WebP can add 2 to 3 seconds. That is the difference between "good" and "poor" in Google's eyes.
INP: how fast your site responds
INP stands for Interaction to Next Paint. It replaced FID (First Input Delay) in March 2024. INP measures how quickly your site reacts when someone interacts with it. Tapping a menu, clicking a button, picking a filter, submitting a form. INP tracks all of them.
The elevator analogy
You press the elevator button. INP is the gap between pressing it and seeing the light come on. Press it once, nothing happens for a full second, you wonder if it is broken. Press it again. Maybe a third time.
That is what happens on a slow website. A visitor clicks "Add to Cart" and nothing visible happens for 400 milliseconds. They click again. Now they have two items in their cart. Or worse, they have already navigated away because they assumed the button was dead.
What good looks like
| INP score | Rating | What visitors experience |
|---|---|---|
| Under 200ms | Good | Interactions feel instant |
| 200 to 500ms | Needs improvement | Slight lag, especially on mobile |
| Over 500ms | Poor | Buttons feel broken; forms feel stuck |
What causes bad INP
Heavy JavaScript is the main offender. While the browser is busy running code, it cannot respond to taps or clicks. Common causes: analytics scripts loading all at once, animations running in the background, third-party widgets (chat popups, social embeds) blocking the main thread, and custom code that runs expensive calculations on every interaction.
INP is often the hardest of the three to fix because it touches code, not just configuration. The payoff is real, though. Sites with good INP see meaningfully fewer abandonments than sites with poor INP, according to Google's own Chrome UX research.
CLS: how stable your layout is
CLS stands for Cumulative Layout Shift. It measures how much your layout moves around unexpectedly while it loads, and while visitors interact with it. Every shift that happens without the user causing it counts against your score.
The newspaper analogy
You are reading a newspaper article. Mid-sentence, an ad drops in above the paragraph and shoves the text down. You lose your place. You hunt for the line you were on. It is annoying.
That is CLS on a website. You are about to tap "Read More," an image loads above it, the link slides down, and you tap an ad instead. Or a cookie banner pushes in from the bottom. Or a font swaps and the text resizes mid-sentence.
What good looks like
| CLS score | Rating | What visitors experience |
|---|---|---|
| Under 0.1 | Good | Page feels solid and stable |
| 0.1 to 0.25 | Needs improvement | Occasional jarring shifts |
| Over 0.25 | Poor | Page constantly jumping; visitors mistap |
What causes bad CLS
Images and ads without defined dimensions are the top cause. When the browser does not know how tall an image will be, it renders the page, then shifts everything down once the image arrives. Other common causes: late-loading fonts that swap and reflow text, dynamically injected content above the viewport, and cookie banners that push page content down rather than overlay it.
The good news is CLS is usually the easiest of the three to fix. Adding width and height attributes to images, reserving space for ads, and preloading fonts solves most of it in a single deployment.
Why these metrics affect your revenue
Core Web Vitals hit your business in two measurable ways: search rankings and conversion rates.
Search rankings
Google has explicitly stated that Core Web Vitals are a ranking signal. In competitive markets, where two pages have equally strong content, page experience metrics act as a tiebreaker. If your CLS is 0.35 and your competitor's is 0.05, they get the edge.
Top-10 results consistently post measurably better LCP, CLS, and INP than results on page two and beyond. The correlation is not subtle.
Conversion rates
Performance directly affects whether visitors become customers. A few specifics:
- The original web.dev "milliseconds make millions" study tied tenths of a second of LCP improvement to single-digit-percent revenue gains across major retailers.
- Vodafone's case study showed an 8% sales lift after a 31% LCP improvement.
- Akamai's commerce research has shown that even 100 millisecond delays can drag conversion rates down by ~7%.
I wrote a longer breakdown of the speed-to-revenue math, including a per-second cost calculation you can run on your own funnel, in my website speed optimization guide.
Mobile matters most
Google uses mobile-first indexing. It primarily looks at the mobile version of your site when ranking. Mobile devices are slower, have less memory, and run on flakier networks. A site that scores "good" on desktop can easily score "poor" on mobile. If you are only checking from your office laptop, you are probably missing the problem. According to Statcounter, more than 60% of web traffic now comes from mobile.
For specific mobile work, my guide on mobile-friendly website design covers responsive design, touch targets, and mobile performance testing.
How to check your scores (free, 60 seconds)
You do not need to hire anyone to find out where you stand. Here is how to check your Core Web Vitals right now.
Step 1: Google PageSpeed Insights
Go to pagespeed.web.dev, paste your URL, click Analyze. Within about 30 seconds you get scores for all three Core Web Vitals plus recommendations ranked by impact.
The tool shows two kinds of data:
- Field data (top section) — real measurements from actual Chrome users visiting your site over the past 28 days. This is what Google actually uses for rankings.
- Lab data (bottom section) — a simulated test run at the moment you click Analyze. Useful for debugging, not used for ranking.
If your site does not have enough traffic for field data, lean on lab data and fix any red or orange items.
Step 2: Google Search Console
If you have Search Console connected (and you should), go to "Core Web Vitals" under "Experience." It groups your URLs by issue type and rates them Good, Needs Improvement, or Poor. That gives you the picture across the whole site, not just one page.
Step 3: Prioritize
Check your most important pages first: home page, top landing pages, product or service pages, and the contact page. Fix the worst-scoring metric on your highest-traffic pages before anything else.
How to improve Core Web Vitals
You do not need to rebuild. Most improvements are targeted fixes against specific bottlenecks. Here is the priority order I use, sorted by typical impact.
Improving LCP (loading speed)
- Compress and resize images. Convert to WebP or AVIF. Serve different sizes for different screens. This single change fixes 60% to 70% of LCP problems.
- Use a CDN (content delivery network). A CDN delivers your content from a server close to each visitor instead of one location. Think branch offices instead of shipping everything from headquarters.
- Reduce server response time. If your hosting takes more than 600ms to respond, no amount of front-end work saves you. Moving from shared hosting to a managed platform often halves it.
- Preload critical resources. Tell the browser to start loading your hero image and main font right away, instead of waiting until it bumps into them later.
Improving INP (responsiveness)
- Defer non-essential JavaScript. Analytics, chat widgets, social embeds. None of these need to load before a visitor can interact with the page. Load them after the page becomes interactive.
- Break up long tasks. Any JavaScript that runs longer than 50ms freezes the browser. Your developer can split those into smaller chunks that let the browser respond between them.
- Audit third-party scripts. Every tracker, A/B test, and marketing tag adds weight. I regularly find sites loading 15 to 20 third-party scripts when they actually use 5 or 6.
Improving CLS (visual stability)
- Set image dimensions. Every
<img>tag should have width and height so the browser reserves space before the image loads. - Reserve space for ads and embeds. If something loads after the page renders, wrap it in a container with a fixed minimum height.
- Preload fonts. A late-loading custom font causes the browser to swap from a fallback, which reflows the text. Preloading prevents the swap.
- Avoid inserting content above existing content. Cookie banners and notification bars should overlay the page, not push it down.
Cuez: 3 seconds to 300ms in practice
Let me show you what fixing performance looks like in practice. At Cuez, a SaaS platform I worked with, API responses (the behind-the-scenes data calls that power every page) averaged around 3 seconds. That meant LCP was poor, INP was sluggish because the interface could not update until data arrived, and users were leaving.
What I found
I ran a full audit and found the typical accumulation of technical debt that builds up when a product ships fast and never circles back to performance:
- Unused libraries still loading on every page
- Custom code that duplicated things the framework handled natively
- Database queries pulling more data than the page actually needed
- A dependency footprint that had quietly doubled
What I did
Instead of rebuilding the application (the expensive option), I kept it targeted:
- Removed unused libraries and outdated dependencies
- Replaced custom code with the framework's built-ins
- Rewrote the most expensive database queries
- Trimmed the overall dependency footprint
The result
API response times dropped from 3 seconds to 300ms — 10x faster. Pages that took 4+ seconds to become interactive were suddenly under 1 second. Bounce rate fell. Engagement rose. Infrastructure cost dropped roughly 40% as a side effect, because we were no longer brute-forcing the slow path with bigger machines.
The total cost was a fraction of what a rebuild would have been. That is the approach I recommend to every business owner. Measure first. Fix the specific bottlenecks. Only rebuild when targeted fixes do not move the needle. Full write-up on the Cuez case study page, and the same playbook is documented in my website speed guide.
What to tell your developer
If you do not write code yourself, here is what to copy-paste to whoever maintains your site.
- "Run PageSpeed Insights on our top 10 pages by traffic. Send me the LCP, INP, and CLS for each."
- "Identify which metric is worst across the site. Fix that one first."
- "Convert all images to WebP. Add width and height attributes."
- "Defer all non-essential JavaScript, including analytics and chat widgets."
- "Set up a monthly Core Web Vitals check so we catch regressions before they hit rankings."
If you want a senior engineer who speaks both performance and business, my website design and development service includes Core Web Vitals work as a standard part of every project, starting at $2,000. For ongoing product work, my applications service bundles performance into the monthly subscription. If your site is already live and you only want a focused audit, let's talk.
Reflecting on what owners actually need to know
Across 250+ projects, I have noticed that Core Web Vitals are the rare technical topic where the right action is almost always smaller than the explanation. Owners read about LCP and INP and assume they need a rebuild, a new agency, a six-figure budget. Most of the time, they need someone to compress the hero image, drop two third-party scripts, and add width attributes to the gallery. That is it. The "complicated" version is what gets sold to people who do not know better.
If you remember one thing from this article, it is the order: measure with PageSpeed Insights, fix the worst metric on the highest-traffic page, then move on. Anyone who wants to skip that order and quote you a redesign is not solving your problem. They are solving theirs.
FAQ
What are Core Web Vitals in simple terms?
Core Web Vitals are three measurements Google uses to judge your site's user experience. They check how fast your page loads (LCP), how quickly it reacts to clicks and taps (INP), and whether the layout stays stable while loading (CLS). All three feed into your Google search ranking.
Do Core Web Vitals really affect SEO rankings?
Yes. Google confirmed Core Web Vitals as an official ranking signal in 2021. They act as a tiebreaker. When two pages have similar content quality, the one with better Core Web Vitals scores ranks higher. Sites with poor scores risk losing positions to competitors with the same content but a faster, more stable page.
How do I check my Core Web Vitals score for free?
Go to pagespeed.web.dev, enter your URL, click Analyze. You see your LCP, INP, and CLS scores within about 30 seconds. For a site-wide view, use Google Search Console under Experience, then Core Web Vitals. Both tools are free and require no technical knowledge.
What is a good LCP score?
Google considers an LCP under 2.5 seconds "good." 2.5 to 4 seconds is "needs improvement." Over 4 seconds is "poor." Most LCP problems come from unoptimized images. Converting images to WebP and sizing them correctly fixes the bulk of LCP issues without other changes.
How much does it cost to fix Core Web Vitals?
It depends on what is broken. Simple fixes like image optimization and adding dimensions usually cost $500 to $1,500 and take a day or two. Heavier work like JavaScript optimization or server upgrades typically runs $2,000 to $8,000. A focused performance audit and fix from me starts at $2,000, in line with my website service. The ROI usually shows up in 4 to 6 weeks through better rankings and conversion rates.
Does INP replace FID for ranking?
Yes. INP became the official Core Web Vital in March 2024, replacing FID. It is a stricter measurement because it tracks every interaction across a page session, not just the first one.
Should I fix LCP, INP, or CLS first?
Fix whichever is worst on your highest-traffic page. If you have to choose at random, start with LCP. It is the metric most often in the red, the one most often caused by image issues, and the easiest to move with a small change.
Related reading:
- Websites service — fixed-price from $2,000
- Applications service — monthly subscription from $3,499/mo
- Cuez case study — 3 seconds to 300ms, 10x faster
- Imohub case study — 120k+ properties, sub-half-second queries
- Slow website cost in 2026
- Performance budgets for founders
- How I made an API 10x faster
- Mobile-friendly website design