Shopify's CDN auto-converts your images to WebP on delivery — but the quality of that WebP depends entirely on the source image you uploaded. Pre-compressing before upload gives you control over quality and dramatically reduces what customers actually download.
Compress to 85–88% quality at 2048px before upload — Shopify's CDN does the rest.
When you upload a product image to Shopify, several things happen automatically. Shopify stores your original file on its servers, then generates multiple resized versions for different display contexts — thumbnails, cart images, product page images, and full-size zoom views. These are all derived from your original upload.
Shopify's CDN (powered by Fastly) automatically delivers images in WebP format to browsers that support it. When a customer views your product page in Chrome or Safari, they receive the WebP version — typically 25–35% smaller than the JPEG equivalent. This happens transparently without any store configuration on your part.
Here's the critical point: Shopify doesn't compress your source images before storing them. If you upload a 12 MB studio photo at maximum quality, Shopify stores 12 MB and derives all thumbnails from that high-quality source. The WebP it delivers is based on your uncompressed source — it can still be 3–5 MB per product image for high-resolution photos.
| Image Type | Recommended Dimensions | File Size Target | Quality | Notes |
|---|---|---|---|---|
| Product images | 2048×2048 px (square) | 300–600 KB | 85–88% | Supports Shopify zoom; 1:1 aspect ratio works across all themes |
| Product thumbnails | Generated from product images | Auto | — | Shopify auto-generates; quality depends on source |
| Collection / category images | 1000×600 px (or theme spec) | 150–300 KB | 80–85% | Check your specific theme's recommended dimensions |
| Banner / hero images | 2000×800 px (or theme spec) | 200–400 KB | 80–84% | LCP element on homepage — pre-compress aggressively |
| Blog images | 1200×800 px | 100–250 KB | 75–82% | Not product images; can be more aggressively compressed |
| Logo | 500×200 px (or theme max) | <50 KB | Lossless PNG or SVG | Sharp edges need lossless; SVG is best if logo is vector |
| Favicon | 32×32 px | <5 KB | PNG | Shopify uses 32×32 for browser tab |
E-commerce conversion rates and page load times are tightly correlated. Google's research consistently shows that each 100ms reduction in mobile load time improves conversion rates by 0.5–1%. For a Shopify store doing $50,000/month, that means a 500ms speed improvement — achievable through image optimization alone — could add $2,500–$5,000 per month in additional revenue.
Product images are the largest assets on most Shopify product pages. A product page with 6 uncompressed product photos at 3 MB each has 18 MB of image payload — regardless of how fast your theme code is or how good your hosting is. Compressing those images to 400 KB each (a realistic target at 85% quality) reduces the image payload from 18 MB to 2.4 MB. On a typical 4G mobile connection, that's the difference between an 8-second load and a 2-second load.
Go to convertlo.pro/compress.html. Everything runs in your browser — no files uploaded to any server.
Drop all product images at once — no file count limit. JPEG, PNG, WebP, and HEIC from iPhone all work.
Use 85% for standard product photos, 88% for high-end products where buyers scrutinize detail. Don't go below 82% for product images.
Use the Max Size dropdown to cap at 2048px if your source photos are larger. 2048px fully supports Shopify's zoom feature.
Download all as a ZIP, extract, and upload to Products → [Product] → Media. Shopify's CDN handles WebP delivery automatically.
Run your product page through Google PageSpeed Insights. Optimized product images typically move scores from 40–60 into 70–85 range on mobile.