Why LCP Is the Metric That Actually Hurts Rankings
Of the three Core Web Vitals — LCP, INP, and CLS — Largest Contentful Paint is the one most WordPress sites fail, and the one most directly tied to a single cause: images.
LCP measures how long it takes for the largest visible element on the page to render. On the vast majority of WordPress sites — blogs, product pages, agency portfolios — that element is an image: a hero banner, a featured image, a product photo above the fold.
If your LCP score is red in PageSpeed Insights or Search Console, there's a good chance the fix isn't a new host or a caching plugin. It's the image itself.
The Checklist
Work through these in order. Each one targets a specific way images slow down LCP.
1. Identify your actual LCP element
Before fixing anything, confirm what's actually being measured. Open Chrome DevTools → Performance tab → record a page load → look for the "LCP" marker in the timeline. It will point to the exact element.
Alternatively, run the page through PageSpeed Insights — the report names the LCP element directly under "Diagnostics."
Don't guess. Optimizing the wrong image wastes time and won't move the score.
2. Check the file format
JPEG and PNG are 1990s formats still being served on far too many sites. WebP is roughly 25–35% smaller than JPEG at equivalent quality, and AVIF goes further — often 50% smaller than JPEG.
If your LCP image is still a raw JPEG or PNG, this is almost always the highest-leverage fix available. See our full guide to converting WordPress images to WebP for the mechanics — the short version is that Erdo Image Optimizer does this automatically, using your server's own GD or Imagick library, with no API key.
3. Check the actual rendered dimensions
A 4000×3000px photo displayed in a 800px-wide hero container is wasting roughly 90% of its downloaded bytes. The browser still has to download the full file before it can scale it down.
Check this by right-clicking the image → Inspect → look at the natural size vs. the rendered width/height in the computed styles. If natural size is more than ~1.5x the rendered size, the image needs resizing — not just compression.
4. Set explicit width and height attributes
Missing width/height attributes don't directly hurt LCP, but they do hurt CLS (the layout shift metric), and a page that shifts layout while loading often delays LCP measurement too. Every <img> tag should have explicit dimensions so the browser can reserve space before the file downloads.
5. Never lazy-load the LCP candidate
This is the mistake we see most often: a "performance" plugin adds loading="lazy" to every image on the page, including the hero image. Lazy loading tells the browser to wait until the image is near the viewport before fetching it — which is the opposite of what you want for the image that determines your LCP score.
The fix: above-the-fold images should load eagerly (no loading="lazy" attribute, or explicit loading="eager"), ideally with fetchpriority="high". Only images below the fold should be lazy-loaded.
6. Preload the LCP image if it's not the first thing the browser sees
If your LCP image is loaded via CSS background-image, or buried inside a slider/carousel that JavaScript renders after page load, the browser doesn't discover it until late in the loading process. Adding a <link rel="preload" as="image"> tag for that specific image in the <head> tells the browser to fetch it immediately, in parallel with everything else.
7. Check server response time for the image itself
A correctly sized, correctly formatted WebP image still won't load fast if it's served from an unoptimized origin with no caching headers. Confirm your images are served with long cache lifetimes (Cache-Control: max-age=31536000 for static assets) and, if you have meaningful traffic from multiple regions, consider a CDN.
8. Re-test after each change
Don't batch all eight steps and test once at the end. Fix the format, re-test. Fix the dimensions, re-test. This tells you which change actually moved the needle — useful if you're troubleshooting a site where multiple things are wrong at once.
Doing This at Scale
Auditing every image on a 50-page site by hand isn't realistic. This is exactly the gap Erdo Image Optimizer's built-in SEO audit closes — it scans every image on your site and flags oversized files, missing lazy-loading attributes (and the opposite mistake — lazy-loading above-the-fold images), wrong formats, and missing alt text, all from one report.
Combined with automatic WebP/AVIF conversion on upload, most of this checklist becomes a one-time setup rather than a recurring manual audit.
Wrapping Up
LCP problems feel like a hosting or caching problem because that's what most generic "speed up your site" advice assumes. In practice, on a typical WordPress site, the fix is almost always: serve the right format, at the right size, loaded with the right priority. Work through the checklist above before reaching for a more expensive host or a server-level caching layer — it's usually not where the problem lives.