The E-Commerce Image Checklist I Wish Every Store Followed

In twenty-odd years of consulting on web projects, image handling is the problem I've fixed most often — because it's never one catastrophic mistake, it's eight small ones stacked up. This is the checklist version of those fixes, ordered the way you'd actually do the work: format, size, compress, name, describe, deliver.

1. Pick the format before anything else

Get this wrong and every later step compounds the mistake — a product photo saved as PNG stays 5–10× too big no matter how carefully you handle it afterwards.

• Product photos: JPEG at quality 80–85. Smallest files for photographic content, universally accepted by every platform's uploader.
• Logos, badges, graphics with text or transparency: PNG, always.
• Your own storefront (not marketplaces): serve WebP — 25–35% smaller. My full reasoning is in the format comparison guide.
• Never for web delivery: BMP, TIFF, or camera raw. These are studio formats.

2. Resize to the platform's numbers

Each platform has a size where zoom works, thumbnails look sharp, and nothing extra is wasted:

The universal rule behind the table: never upload camera originals. A modern camera produces 6000×4000 files of 5–25 MB; no platform displays anything close to that, and several will double-compress your image on the way down. Resize first, on your machine, with an algorithm you chose.

3. Compress — the highest-value five minutes

• Targets: under 200KB for product images, under 500KB for hero banners. These are achievable for virtually any photo at the sizes above.
• Quality: 80–85 for main product photos, 70–75 for thumbnails. Don't chase lower — the savings shrink and the artifacts grow.
• Progressive encoding: free perceived-speed win on slow connections.
• Strip EXIF: 10–50KB saved per image, plus you stop publishing the GPS coordinates of wherever you photograph inventory.
• One setting per image type: compress your whole catalog's worth of main photos at the same quality so the grid looks uniform. Test on five images before running five hundred.

4. Name files like you want to be found

Google reads filenames; IMG_4523.jpg tells it nothing.

• blue-leather-wallet-front.jpg — descriptive, hyphenated, 3–5 words
• Put the product keyword in naturally; skip the stuffing
• Encode the variant: -red, -side-view, -in-hand
• Do the renaming before upload — most platforms won't let you rename afterwards without re-uploading

5. Write alt text for humans first

Alt text serves shoppers using screen readers, image search, and anyone whose connection drops the image. The habits that cover all three:

• Specific beats generic: “Women's blue leather bifold wallet, open showing card slots” — not “wallet”
• Mention color, material, and context when they're relevant to the shot
• Skip “image of” — screen readers already announce it
• Unique text per angle — ten photos with identical alt text help no one

6. Know which Google metrics your images move

Core Web Vitals are ranking signals, and images influence all three of the big ones:

7. Deliver intelligently

• Lazy-load below the fold (loading="lazy") — but never the hero image. Lazy-loading the hero is the most common self-inflicted LCP wound I see; preload it instead with <link rel="preload">.
• Responsive sizes via srcset so phones don't download desktop images.
• CDN: Shopify and Amazon do this for you. On WooCommerce, put Cloudflare or BunnyCDN in front.
• Long cache headers (a year) with hashed filenames for cache-busting.

8. Platform quirks worth knowing

• Shopify auto-converts uploads to WebP at the CDN — so upload high-quality JPEGs and let it do its job. Keep aspect ratios consistent (1:1 is safest) or your collection grid turns ragged.
• Amazon has the strictest main-image rules on the internet — pure white background, no text, 85% frame fill. I've written a dedicated Amazon guide because the suppression rules deserve their own page.
• Etsy crops search thumbnails to 4:3 landscape, so compose your first image for that crop. Scale reference shots matter more here than anywhere — handmade buyers can't gauge size from a listing.
• WooCommerce gives you nothing for free: install an optimization plugin (ShortPixel, Imagify) and check that your theme actually emits srcset.

The five mistakes I keep finding in store audits

Related guides

• Speeding up a Shopify store with optimized images
• Amazon listing photo size guide
• WebP vs JPEG vs PNG: how I choose