Optimize images for Core Web Vitals and LCP
Images drive two of the three Core Web Vitals: Largest Contentful Paint (usually an image) and Cumulative Layout Shift (images without dimensions). Fix the images and you fix most of your CWV score. Here’s the exact sequence.
What Core Web Vitals measure
Core Web Vitals are Google’s page-experience metrics. Largest Contentful Paint (LCP) measures how fast the largest visible element renders — most often an image — and should be under 2.5 seconds. Cumulative Layout Shift (CLS) measures unexpected movement and should be under 0.1; images without declared dimensions are a frequent cause.
Fix Core Web Vitals images step by step
- 1
Find the LCP image
Identify the largest above-the-fold image — the LCP element. An image audit can detect the likely candidate for you.
- 2
Make it modern and right-sized
Convert the LCP image to WebP/AVIF and resize it to its real display dimensions to minimize its bytes.
- 3
Preload it with high priority
Eagerly load the LCP image and give it high fetch priority; never lazy-load it.
- 4
Set width and height everywhere
Declare dimensions on every image so the browser reserves space and CLS stays near zero.
- 5
Lazy-load the rest
Defer below-the-fold images so they don’t steal bandwidth from the LCP image.
- 6
Re-measure
Confirm LCP is under 2.5s and CLS under 0.1, then repeat on your next-worst page.
Turn it into a ranked task list
Optimagio’s free website image audit identifies the likely LCP image, oversized assets, missing dimensions, and render-blocking signals on any URL — then the optimizer produces the modern, right-sized assets you need. It converts diagnosis into a concrete, prioritized fix list.
Frequently asked questions
How do I improve LCP with images?
Identify the LCP image (the largest above-the-fold element), convert it to WebP/AVIF, resize it to its real display dimensions, and preload it with high priority. These steps minimize the bytes and delay of the element LCP measures.
What is a good LCP score?
Largest Contentful Paint should be under 2.5 seconds for a "good" rating. Because the LCP element is usually an image, optimizing that image is the most direct way to hit the target.
How do images cause CLS?
Images without declared width and height don’t reserve space, so content shifts as they load — increasing Cumulative Layout Shift. Setting explicit dimensions (or aspect ratios) on every image prevents it.
Start optimizing your images today
Try the free public tool now, then upgrade for higher limits, bulk batches, the API, storage, and reports.
Free tier available · No card required to start · Cancel anytime