Core Web Vitals and Page Experience

Core Web Vitals are three metrics Google uses to quantify how a page feels to use, each answering one question a visitor would ask. Largest Contentful Paint (LCP): did the main content appear quickly? Interaction to Next Paint (INP): when I tapped or typed, did the page react immediately? Cumulative Layout Shift (CLS): did things jump around while I was reading?

Google evaluates each metric at the 75th percentile of real visits — three out of four visitors must have a good experience for the page to pass. This matters because a fast test on your office connection says nothing about a visitor on a mid-range phone over a weak signal, and it is the visitor's experience that is scored.

The data comes from two sources. Field data, collected from real Chrome users and reported in Search Console's Core Web Vitals report, is what rankings use. Lab data, from tools like Lighthouse, is what you use to diagnose — it is reproducible and immediate, but it is a simulation.

LCP is almost always one element — the hero image, the main heading block or a large video poster — so the first step is identifying which element it is, which Lighthouse reports directly. Then the fixes follow a short decision tree.

If the element is an image: compress it, serve it in a modern format, size it for the device instead of shipping a 2400-pixel original to a 390-pixel screen, and preload it so the browser starts fetching before layout. A hero image converted from a 2MB JPEG to a sized AVIF routinely takes LCP from four seconds to under two on its own.

If the element is text delayed by other resources: the usual culprits are render-blocking stylesheets, web fonts that hide text while loading, and client-side rendering that leaves the HTML empty until JavaScript runs. Server-rendering the main content — as every page on this site is — removes the whole class of problem at once.

INP measures the delay between a user's interaction and the browser painting the response, and it fails when the main thread is busy with JavaScript when the tap arrives. The score is only as good as the worst interactions, so one heavy event handler poisons the metric.

The most common cause on content sites is not your code at all — it is third-party scripts. Tag managers, ad networks, chat widgets and analytics suites all compete for the main thread, and each one added without a performance budget nudges INP upward. Audit what loads, defer everything that is not needed for the first screen, and remove what is not earning its place.

In your own code, the fixes are to break long tasks into smaller ones so input can be handled between them, move heavy computation off the main thread, and avoid attaching expensive handlers to high-frequency events like scroll and input without debouncing.

CLS punishes pages where content moves after the user starts reading — the paragraph that jumps just as you tap it. The causes are predictable: images and embeds without declared dimensions, ads that inject into the flow, web fonts that swap in at a different size, and banners inserted above existing content.

The fixes are mechanical. Give every image and iframe explicit width and height (or an aspect-ratio) so the browser reserves the space before the asset arrives. Reserve a slot for ads and embeds rather than letting them push content. Set font-display and match fallback font metrics so text does not reflow when the web font lands.

One rule covers most of the remainder: never insert content above what the user is already viewing, except in direct response to their action. A late-loading cookie banner or signup bar that shoves the article down is a CLS failure and an annoyed reader in one package.

Less than their reputation suggests, and more than zero. Google describes page experience as a signal applied when many pages of similar relevance compete — a tie-breaker, not a primary ranking factor. Passing vitals will not lift thin content past a thorough competitor, and failing them will not bury a page that is clearly the best answer.

The stronger reason to fix them is the direct effect on people. Every second of load delay measurably raises abandonment; every layout shift during a tap causes misclicks and lost trust. Ad-driven sites feel it twice, because visitors who leave before the page settles see no ads at all.

The sensible posture is a floor, not an obsession: get all three metrics into the good range on field data for your important pages, monitor the Search Console report monthly, and spend the effort saved beyond that on the content itself.