What are Core Web Vitals?
Core Web Vitals (CWV) are three website performance metrics that Google officially recognised as a ranking factor in 2021 under the Page Experience Update. They measure real user experience: how quickly you see the main content (LCP), whether the page jumps around while loading (CLS), and how quickly it responds to your clicks (INP). Poor CWV scores are a double problem: worse Google rankings and a higher bounce rate, because users abandon slow-loading pages.
The three Core Web Vitals metrics — what they measure and the thresholds
| Metric | What it measures | Good score | Poor score |
|---|---|---|---|
| LCP (Largest Contentful Paint) | Time to display the largest visible element on screen (hero image, H1 heading) | ≤ 2.5s | > 4.0s |
| CLS (Cumulative Layout Shift) | Total layout shifts during loading (elements jumping around) | ≤ 0.1 | > 0.25 |
| INP (Interaction to Next Paint) | Page response time to a click, tap or keypress | ≤ 200ms | > 500ms |
LCP — the most important metric and how to improve it
LCP (Largest Contentful Paint) measures the time until the largest visible element on the page is displayed. Most often this is a hero image or a large heading. For SEO and UX it is the key metric — users judge page speed by when they see something meaningful, not when the entire page has finished loading.
The most common causes of a poor LCP: the hero image served in JPEG format without compression and without a CDN, missing fetchpriority="high" or loading="eager" attribute on the LCP image, a slow server (TTFB above 600ms), or rendering blocked by CSS and JS loaded in the <head>. In Next.js, the Image component with a priority attribute automatically adds fetchpriority="high" and a preload link — which is why LCP on my Next.js projects naturally falls below 1.5s.
CLS — why pages jump around and how to fix it
A CLS above 0.1 means elements shift during loading — text you started reading suddenly moves down because a banner loaded above it. This is frustrating for users and penalised by Google. The most common causes: images without defined width/height attributes (the browser does not know how much space to reserve), web fonts causing FOUT (Flash of Unstyled Text), and ads or embeds loaded dynamically without reserved space.
Solutions: always define width and height on <img> elements, use font-display: swap for external fonts (Google Fonts), reserve space for dynamic elements (min-height on the container before loading). In WordPress, the main culprits for CLS are often slider and pop-up plugins loaded without dimensions.
Max Mazurkiewicz
FounderIs your site losing Google rankings due to poor Core Web Vitals?
I diagnose and fix performance issues on WordPress and Next.js. Get in touch to discuss what can be done with your PageSpeed.
Get in touchINP — the new metric that replaced FID
In March 2024 Google replaced FID (First Input Delay) with INP (Interaction to Next Paint). The difference is significant: FID only measured the time to the first interaction, while INP measures responsiveness to all interactions throughout the entire page session. Pages with large amounts of JavaScript, CSS animations and heavy widgets often have INP above 500ms.
Improving INP is primarily about reducing main thread blocking: code splitting (load JS only when needed), deferred loading of heavy components (Calendly, chatbots, maps), and avoiding long JavaScript tasks (Long Tasks in DevTools). In WordPress, INP is most often broken by JS files from plugins that load at startup without offering lazy loading.
How to measure your site's Core Web Vitals
The most important distinction is between lab data and field data. Lab data (Lighthouse, PageSpeed Insights) is a simulation under controlled conditions. Field data is real data from actual users, collected via the Chrome User Experience Report (CrUX). Google uses field data as a ranking factor, not lab data.
The best tools: PageSpeed Insights (psi.web.dev) shows both data types simultaneously, Google Search Console → Core Web Vitals report shows which pages have issues in real traffic, Chrome DevTools → Performance and Lighthouse for debugging specific problems. Core Web Vitals optimisation starts with analysing field data in GSC, not the Lighthouse score — which many people mistakenly treat as the only truth.
Does improving CWV actually improve Google rankings?
This is a question I hear often — and the answer is more nuanced than a simple "yes" or "no". Core Web Vitals are a ranking factor, but a tiebreaker one: when content quality and link profile are equal, the page with better CWV wins. If your site has poor content or few links, improving PageSpeed from 50 to 90 will not jump you from position 40 to position 3.
However, the indirect impact of CWV on SEO is real and often more important than the direct one: a faster site = lower bounce rate = better user signals for Google, better crawl budget (the Google bot explores more pages of a faster site), and a higher conversion rate (business results). Improving CWV rarely works miracles on its own, but it is always a worthwhile investment as part of a comprehensive SEO strategy.