The 2.5-second deadline
Google grades every page on Core Web Vitals — measurable user-experience numbers. The one images dominate is LCP (Largest Contentful Paint): the time until the largest visible element renders. Under 2.5 seconds is "good", over 4 seconds is "poor". On a typical website the largest element is the hero or featured image, so that single file often decides your grade.
How one photo ruins the score
An unedited phone photo is 4000+ px wide and 5–10 MB. On a 4G connection that's several seconds of download for one image — before rendering even starts. PageSpeed's advice ("Properly size images", "Serve images in next-gen formats") is written for developers, but it translates to two plain actions: make the image the size it's displayed at, and save it as WebP.
The numbers that pass
- Hero / header: 1920 px wide, WebP, under 200 KB
- Content images: 1200 px wide, WebP, under 100–150 KB
- Thumbnails: 300–600 px, under 30 KB
Rule of thumb: your whole page — HTML, CSS, scripts and all images — should weigh less than 2 MB. A single unoptimized photo can exceed that alone.
Beyond file size: two free wins
Lazy loading: images below the fold shouldn't load upfront — WordPress and most builders do this automatically now, but the LCP image itself must NOT be lazy-loaded. Dimensions in HTML: when width and height are set, the browser reserves the space and the page doesn't jump while loading (that jumping is CLS, another Core Web Vital). Your CMS handles both correctly if you upload properly sized images — which brings it back to the same fix.