Skip to main content
Message Virgo Creative Solutions on WhatsApp (opens in a new tab)

Core Web Vitals, explained without the jargon

Virgo Creative Solutions article artwork: Core Web Vitals, explained without the jargon

Core Web Vitals are three measurements Google uses to judge whether a page feels good to use. They are reported in tools like PageSpeed Insights and Search Console, usually alongside a colour and a number that nobody explains.

They are worth understanding, because they are one of the few technical measures that correspond directly to something a visitor actually experiences.

LCP — how long until the page looks ready

Largest Contentful Paint measures how long it takes for the biggest visible thing on the screen to appear. Usually that is a hero image, a heading, or a block of text at the top of the page.

Google considers 2.5 seconds or less to be good. Beyond four seconds is poor.

The usual causes of a bad LCP are an oversized hero image, a slow server response, or a chain of stylesheets and fonts that must all load before anything can be drawn.

INP — how quickly the page responds to you

Interaction to Next Paint measures the delay between someone doing something — tapping a menu, opening an accordion, ticking a box — and the page visibly responding.

Good is 200 milliseconds or less. Above 500 milliseconds is poor and feels, to the person using it, like the page has ignored them.

Poor INP is nearly always caused by too much JavaScript competing for the browser’s attention: several plugins each running their own scripts, a heavy framework, chat widgets, tracking tags and pop-up tools all initialising at once.

CLS — how much the page moves while loading

Cumulative Layout Shift measures how much content jumps around as the page loads. It is the reason you sometimes tap the wrong thing because a banner appeared and pushed everything down.

Good is 0.1 or below.

The common causes are images and video without declared dimensions, adverts or embeds inserted after load, and web fonts that swap in at a different size to the fallback.

What to fix first

In our experience the order that produces the most improvement for the least work is:

  • Size and compress images properly, and serve modern formats such as WebP
  • Set explicit width and height on every image and embed, which usually fixes CLS outright
  • Remove plugins and third-party scripts that are not earning their place
  • Load only the CSS a page needs rather than one large stylesheet for the whole site
  • Enable server-level page caching — on LiteSpeed hosting this is a configuration change, not a plugin decision
  • Self-host fonts, preload the ones used above the fold, and use font-display: swap

A note on scores

PageSpeed Insights gives you two things: lab data from a simulated test, and field data from real visitors over the previous 28 days. Field data is what actually counts for search, and it is the one to watch. A perfect lab score on a page that real users experience as slow is not a win.

It is also worth keeping perspective. Moving from poor to good is valuable. Chasing the last few points of a lab score rarely is — that effort is almost always better spent on the content and the offer.

If your site is scoring badly and you are not sure why, we can run through it with you. See how we approach SEO or get in touch.

Start a project

Tell us what you are building

Share the outline of your project and we will come back with a clear view of scope, approach and timeline — no obligation, no jargon.