Core Web Vitals for small sites, without the jargon

Core Web Vitals are three measurements of how a page feels to the person loading it: how quickly the main content appears, how quickly it responds when they interact, and how much it moves around while it loads. Google publishes a threshold for each, measured at the 75th percentile of real visits. This is the short version; the full Core Web Vitals guide walks through every fix in depth.

LCP — Largest Contentful Paint

The time until the biggest element in the viewport has rendered. On most business sites that is the hero image or the headline. Good is 2.5 seconds or less.

What usually fixes it, in the order worth trying:

• Serve the hero image in a modern format at the size it is actually displayed — an oversized JPEG is the single most common cause
• Stop lazy-loading the hero; it is above the fold, so lazy-loading it delays exactly the thing being measured
• Cut render-blocking CSS and fonts in the head
• Turn on server-side caching so the HTML is not rebuilt on every request

INP — Interaction to Next Paint

How long the page takes to visibly respond after a tap or click, across the whole visit. Good is 200 milliseconds or less. INP replaced First Input Delay in March 2024, and it is stricter: it looks at every interaction, not just the first.

Poor INP is almost always JavaScript. On a typical WordPress site the culprits are a stack of plugins each adding their own scripts, a heavy slider, and third-party tags — chat widgets, analytics, ad and heatmap scripts — competing for the main thread. Audit what you load before you optimise what you wrote.

CLS — Cumulative Layout Shift

How much the page jumps around as it loads. Good is 0.1 or less. This one is usually cheap to fix and very noticeable to visitors.

• Set width and height on every image so the browser reserves the space
• Reserve space for anything injected after load: banners, cookie notices, embedded video
• Use font-display: swap with a fallback that is close in metrics, so the swap does not reflow the text

Measure the field, not the lab

For a small site, the honest priority order is: get the hosting response time down, then fix the images, then remove the JavaScript you are not using. Those three account for most of the gap on most sites, and none of them require a rebuild.