ratemysite.ai

How to get Largest Contentful Paint under 2.5 seconds

Largest Contentful Paint should be under 2.5 seconds. It measures how long the biggest image or heading takes to appear, so it is the moment a page feels loaded. Preload the hero image, serve modern image formats and remove render-blocking CSS and scripts to bring it down.

By . Updated .

How do you fix it?

  1. Find the LCP element in PageSpeed Insights or the Chrome DevTools Performance panel; it is usually the hero image or main heading.
  2. Preload the hero image with <link rel="preload" as="image"> and add fetchpriority="high" to it; never lazy-load it.
  3. Serve it as AVIF or WebP at the right size, and compress it to under 200 KB if you can.
  4. Remove or defer render-blocking CSS and JavaScript in the head, and inline only the critical CSS.
  5. Re-run the audit and confirm the LCP check passes.

What is Largest Contentful Paint?

LCP is a Core Web Vitals metric that records when the largest image, video poster or block of text in the viewport finishes rendering. It is the closest simple measure of when a visitor feels the page has loaded. Google uses it as a page experience signal. Sites with good LCP see lower bounce rates, and each extra second of delay on mobile tends to cost a noticeable share of visitors.

What slows LCP down most?

Four delays add up: a slow server response, late discovery of the hero image, a large image file, and render-blocking resources. Start with the biggest. If the hero image is set by CSS or by JavaScript, the browser finds it late, so use a normal img tag or preload it. If the file is 1.5 MB, resize it to the display size and use a modern format. Together these fixes usually remove 1 to 2 seconds from LCP.

How much does this check matter?

What else do people ask?

What is a good LCP score?
Under 2.5 seconds at the 75th percentile is good, 2.5 to 4 seconds needs improvement, and over 4 seconds is poor.
Does LCP differ between lab and field data?
Yes. Lab tests use a fixed device and network. Field data from real users in the Chrome UX Report shows what visitors actually experience and is what Google uses.

Sources