Core Web Vitals are a set of three measurements Google uses to describe how a page feels to a real visitor: how fast the main content appears, how quickly the page responds to input, and how stable the layout is while loading. They are part of Google’s page experience signals, so they matter for rankings, but their bigger value is simple: faster, steadier pages convert better.
The three metrics and their thresholds
Google judges each metric at the 75th percentile of real visits, separately for mobile and desktop.
- Largest Contentful Paint (LCP) measures when the biggest visible element, usually a hero image or headline, finishes rendering. Good is 2.5 seconds or less. Poor is over 4 seconds.
- Interaction to Next Paint (INP) measures how quickly the page responds when someone taps, clicks or types. Good is 200 milliseconds or less. Poor is over 500 milliseconds. INP replaced First Input Delay as a Core Web Vital in March 2024.
- Cumulative Layout Shift (CLS) measures how much content jumps around while the page loads. Good is 0.1 or less. Poor is over 0.25.
Lab data versus field data
Lighthouse and PageSpeed Insights run a simulated test, which is called lab data. The Chrome User Experience Report collects real visits, which is called field data. Google uses field data for ranking, and it only exists once a page has enough traffic. Use lab tests to find and fix problems, and Search Console’s Core Web Vitals report to confirm real users are better off.
How to improve LCP
LCP problems are usually one of four things: a slow server, render-blocking files, a heavy hero image, or a late-discovered resource.
- Speed up the server. Use page caching and a CDN. Read more in our guide to Time to First Byte.
- Optimize the hero image. Use modern formats such as WebP or AVIF, size it to the space it fills, and do not lazy-load it.
- Preload what matters. Preload the LCP image and the main font so the browser finds them early.
- Reduce render-blocking CSS and JavaScript. Inline the small critical styles and defer scripts that are not needed straight away. See our post on render-blocking resources.
How to improve INP
INP gets worse when the main thread is busy. Too much JavaScript is almost always the cause.
- Remove scripts you do not need. Old chat widgets, trackers and sliders are common offenders.
- Break up long tasks. Heavy work should run in small chunks so the browser can respond between them.
- Delay third-party scripts until after the page is interactive.
- Keep the DOM small. Pages with thousands of nested elements are slower to update.
How to improve CLS
Layout shift happens when something loads and pushes other content out of the way.
- Set width and height on every image and video so space is reserved.
- Reserve space for ads, embeds and banners, including cookie notices.
- Load fonts carefully. Use
font-display: swapand preload your main font to limit the jump when it replaces the fallback. - Avoid inserting content above existing content after load.
A practical order of work on WordPress
- Measure with PageSpeed Insights and note which metric fails.
- Turn on caching and put a CDN in front of the site.
- Compress and resize images, and fix the hero image first.
- Remove unused plugins and scripts.
- Defer or inline CSS and JavaScript where it is safe.
- Re-test, then check Search Console after a few weeks of real traffic.
Page builders add weight, but a well-built Elementor site can pass all three metrics. The fixes above are the same ones we apply on client projects.
Want us to fix your Core Web Vitals?
If your report shows red or orange scores, our WordPress speed optimization service covers all of the steps above. Contact us for a free review of your site.
