Performance
How to fix a slow Largest Contentful Paint
Identify which element is the LCP, then remove everything delaying it: preload it, stop lazy-loading it, serve it in a modern format at the right size, and eliminate render-blocking resources ahead of it. On most sites the LCP element is one image.
Before you start
- Access to the page templates
- Chrome DevTools
The steps
-
Step 1: Find the LCP element
PageSpeed Insights names it under "Largest Contentful Paint element". Usually the hero image or the headline.
-
Step 2: Remove lazy loading from it
loading="lazy" on the LCP image is the single most common cause of a slow LCP, and it is a one-word fix.
-
Step 3: Preload it
A link rel="preload" for the hero image tells the browser to fetch it before it finds it in the markup.
-
Step 4: Serve it properly sized
A 3000px image displayed at 800px wastes most of its bytes. Use srcset with real breakpoints.
-
Step 5: Convert to AVIF or WebP
With a JPEG fallback via picture. Typically 40–60% smaller at the same visual quality.
-
Step 6: Remove render-blocking resources
Inline critical CSS, defer the rest, and move non-essential scripts out of the head.
-
Step 7: Set explicit dimensions
Width and height attributes prevent the layout shift that often accompanies a slow LCP.
-
Step 8: Re-measure
Field data takes 28 days to catch up. Lab data confirms the change immediately.
The fix that costs nothing and is missed constantly
Lazy-loading the hero image. It is applied globally by a plugin or a build tool, it looks like an optimisation, and it directly delays the exact element the metric measures. Check this first, always.
Fonts are the second suspect
If your LCP is a heading rather than an image, a web font is probably blocking it. Use font-display: swap, preload the font file, and subset it to the characters you actually use.
The background behind this
Core Web Vitals, and the order that actually reduces them covers the reasoning in about 3 minutes — free, ungated, written from client work.
Who wrote this
Anas Bin Masud builds e-commerce sites and does technical SEO for businesses in the UK, Canada, Ireland and Pakistan. These procedures are the ones I run on client work, written down rather than invented — including the ones where the honest answer is that the fix is not available on your current hosting.