Web

LCP (Largest Contentful Paint)

Short definition

LCP is the Core Web Vitals metric that measures how long a page's largest image or text block takes to become visible.

The browser identifies which element covers the largest area as the page loads, usually a hero image, banner or heading block. LCP is the time until that element is fully rendered on screen.

It appears in PageSpeed Insights and Search Console reports. The official threshold is 2.5 seconds: under that is good, 2.5 to 4 seconds needs improvement, above that is poor.

It is often confused with First Contentful Paint (FCP). FCP is the moment any content first appears, while LCP is the moment the largest, usually the actual expected content appears.

The most common mistake is lazy-loading the above-the-fold hero image along with every other image, which delays the browser's discovery of it and stretches LCP. The correct approach is to lazy-load only images further down the page and mark the visible hero image so the browser fetches and renders it as early as possible.

Why it matters

A visitor who waits for a slow hero image or heading assumes the page has nothing for them and leaves. Shortening LCP reduces that loss and gives a direct advantage in search rankings.

Illustrative example

A workwear manufacturer's homepage hero photo loaded uncompressed and pushed LCP to five seconds; switching the image format brought it down to 1.8 seconds.

Related terms

Related article

If you don’t know where to start, that’s fine; you’re in the right place.

Your project might already be clear in your head, or still just an idea. Either works. On a short call we talk through where you are and where you could go, together.

Let’s set up a call
Let’s talk about your project