8 Best Practices in Image Optimization Used by Top Brands

Profile Picture
by
Alfredo Deambrosi
April 4, 2025
  |  
3 minute read
best practices in image optimization

Image optimization often sounds like a design or UX concern. But images affect much more than aesthetics—they impact page speed, SEO, user behavior, and even conversion rates.

For many websites, images make up more than 75% of total page weight. Poorly optimized images lead to longer load times, frustrated users, and lower rankings in search results. But optimized images do the opposite: they create faster, more efficient, and more effective websites.

Here are eight practices that top brands use to optimize images—and the real-world results they’ve seen.

1. Reduce page weight by using responsive images

Responsive image delivery reduces the total amount of data users need to download. Instead of serving the same large image to every visitor, responsive techniques send the most efficient version based on screen size.

Swimply, a fast-growing marketplace, reduced image sizes by 38% and cut image response time by 50% after switching to responsive images. The result: improved Core Web Vitals, better SEO performance, and faster pages—especially for mobile users.

2. Choose next-gen formats to improve speed and quality

Modern image formats like AVIF and WebP offer superior compression compared to JPEG and PNG. They deliver smaller files without compromising visual quality, which means faster websites.

Nikkei, one of the largest financial news outlets, switched to WebP and saw a 38% reduction in file size across their site. Smaller files led to faster loading, higher SEO rankings, and a better experience for readers on all devices.

3. Optimize images for mobile-first experiences

Most online traffic comes from mobile devices. Optimizing for mobile first means sending images that match the size and resolution of a user’s screen—not more, not less.

Zadig&Voltaire, a luxury fashion brand, improved their mobile page speed by 66% by delivering responsive images sized appropriately for smartphones. This significantly reduced page weight and load time, resulting in smoother user experiences and lower bounce rates. When image optimization reflects how users actually browse, the payoff is immediate.

4. Automate image workflows to save time and scale

When image management is manual, teams lose time on repetitive tasks like cropping and resizing. Automation removes these bottlenecks and ensures consistency.

Chronext, a luxury watch marketplace, automated their workflows to reduce image response time by 80% and eliminate repetitive manual work. With background removal and resizing handled automatically, their developers gained time back to focus on strategic projects.

5. Add premium features without engineering lift

Dynamic image services can enable advanced features like background removal and text overlays without custom development. These capabilities add value for users—and in some cases, generate revenue.

Greetings Island used background removal to support a premium subscription tier and added text overlays to personalize email images—all via URL parameters. These enhancements required no engineering lift and directly contributed to subscription growth.

6. Lazy-load images to improve initial load times

Lazy loading speeds up initial page loads by loading only the images currently in view. Offscreen images are deferred until the user scrolls to them, reducing time-to-interactive.

The New Republic implemented lazy loading using a React component and saw significantly reduced load times. For a news site with high publishing frequency and image volume, deferring offscreen content made a measurable impact on performance.

7. Use intelligent cropping to highlight what matters

Images are more effective when they center on the right subject. Smart cropping techniques—especially face detection—ensure visual focus aligns with viewer expectations.

Nikkei used face detection to automatically crop news images so that key subjects were always in frame. This reduced load times by over a second on average and created a more polished, consistent visual experience.

8. Connect image tools to your CMS to reduce bottlenecks

When editors can crop, resize, and preview images directly within the CMS, publishing becomes faster and more accurate. This also frees up developers to focus on higher-impact work.

The New Republic eliminated image-related publishing issues entirely by integrating image controls into their WYSIWYG CMS interface. This efficiency allowed the editorial team to work faster and publish with confidence—even during breaking news events.

Image optimization drives real business results

Optimizing images isn’t just a technical best practice—it’s a business necessity. Faster websites rank higher, engage users more effectively, and convert better. Automation frees up developer time. Dynamic features create new opportunities to add value.

By following these image optimization strategies, companies can improve performance, save time, and deliver a better experience—across devices, across channels, and at scale.

Get a custom report on your image performance

I​​mages often make up the majority of a page’s weight. If they’re not optimized, they can slow down load times, frustrate users, and lower SEO rankings.

A page weight report gives you a detailed analysis of how your images are impacting performance. It shows where you can reduce file sizes, how much faster your site could load, and what improvements could drive better engagement.

See how your images are affecting speed, experience, and search visibility—get your custom report today.