Theory is useful. Real numbers are better.
Over the last 12 months we have helped dozens of sites climb from poor PageSpeed scores into the green. In most cases the single biggest lever was image optimization.
Case Study 1 – SaaS Landing Page
What we did: Converted the large hero and three product screenshots to AVIF + WebP, added correct srcset/sizes, set fetchpriority="high" on the LCP image, and removed one oversized background image.
Case Study 2 – Content / Blog Site
The site had dozens of high-resolution JPEG articles images. We batch-converted everything to AVIF (quality 50), generated three widths, and updated the template. Total image weight dropped by 62%.
Case Study 3 – E-commerce Category Page
Product grid images were the main problem. After switching to responsive AVIF/WebP and lazy-loading correctly, the score moved from 47 to 91 on mobile while maintaining visual quality.
Common Patterns Across All Wins
- Hero image was almost always the LCP element
- Files were far larger than needed for the display size
- Modern formats (especially AVIF) delivered the biggest size reductions
- Correct
width/height+fetchpriorityprevented layout shift and prioritisation issues
What We Didn’t Touch
In these case studies we deliberately limited changes to images only. No JavaScript removal, no font changes, no CDN upgrades. This proves how powerful image work still is in 2026.
If your score is stuck in the 40s–60s and you have large images, start here. The returns are still excellent.
