Product images directly impact conversion rates. Slow or poor-quality images lose sales. Optimize for both performance and visual appeal.
Optimal Specifications
Main images: 1200-1600px, JPEG/WebP, quality 85-90, 100-200KB. Thumbnails: 200-300px, quality 80, 10-20KB. Use white backgrounds for best compression.
Responsive Implementation
Use srcset to serve different sizes: 400px for mobile, 800px for tablets, 1200px for desktop. This reduces mobile data usage by 70%.
Image Gallery Strategy
Load main image immediately, lazy load alternative views. Only load high-res zoom images on user interaction to save bandwidth.
Bulk Processing Workflow
Automate optimization for large catalogs using Sharp (Node.js) or similar tools. Generate main images at 1200px/quality 85 and thumbnails at 300px/quality 80 automatically.