Image Optimization
Image optimization is the process of reducing image file sizes and delivering them efficiently without visible quality loss, improving page speed and user experience.
Images typically account for 50-70% of a web page's total file size, making image optimization one of the highest-impact performance improvements you can make. The goal is to deliver the smallest file size that still looks good on the user's device and screen. Modern image optimization involves several techniques.
Responsive images serve different sizes based on the user's screen (a phone doesn't need a 4K image). Lazy loading defers loading images until they're about to scroll into view. Compression reduces file size by removing unnecessary data.
In practice
- An e-commerce site converted 10,000 product images from JPEG to WebP and reduced total image bandwidth by 45%, saving $500/month in CDN costs alone
- A real estate website implemented responsive images, serving 400px wide photos on mobile instead of 2400px desktop versions, reducing mobile page load by 4 seconds
- A travel blog reduced their homepage from 15MB to 1.2MB by lazy loading gallery images and using modern formats, improving their Google PageSpeed score from 28 to 92
- A news outlet implemented an image CDN that auto-formats and auto-sizes images, eliminating the need for their editorial team to manually optimize photos before publishing
Not sure how this applies to you?
A senior engineer walks your site, your search presence and the way enquiries reach you, then writes down the three things worth fixing first. You keep the document either way.