Shopify Image Optimisation: Speed, SEO, and What Most Merchants Get Wrong

Niko MoustoukasUpdated

Quick summary

This post covers how image size, format, alt text, and file naming affect both page speed and SEO on Shopify stores. It includes specific tools, bulk optimisation workflows, and benchmarks for image dimensions and file sizes. Written for Shopify merchants whose stores load slowly or whose product images are not contributing to search visibility.

Slow stores lose sales. Google's own data shows that for every one-second delay in mobile page load time, conversion rates drop by up to 20%. On Shopify, the most common cause of slow load times is unoptimised images: files uploaded at full camera resolution with no compression, in the wrong format, and with no descriptive alt text.

Images are also one of the most underused SEO assets on a Shopify store. Alt text, file naming, and proper image schema all contribute to how well your products appear in Google Images and how accurately Google understands your pages.

Most merchants upload images straight from a camera or supplier, change nothing, and wonder why their store loads slowly and their images never appear in image search. Here is how to do it properly.

How Does Image Size Affect Page Speed and Rankings?

Page speed is a confirmed Google ranking factor. The specific metric that matters most is Largest Contentful Paint (LCP): how quickly the largest visible element on the page (usually a hero image or main product photo) loads for the user. Google's threshold for a "good" LCP score is under 2.5 seconds.

A single uncompressed product image from a modern DSLR camera can easily be 5MB to 8MB. A well-optimised version of the same image at 1,200px wide should be under 150KB in WebP format. That is a 30x to 50x difference in file size, and a proportional difference in how quickly the page loads.

Shopify's CDN (powered by Fastly) does some automatic compression and can serve WebP to supported browsers. But it does not fully compensate for massively oversized source files. If you upload a 7MB image, Shopify's CDN will serve a smaller version, but it will not optimise the image to the level you can achieve by compressing it properly before uploading.

The practical conclusion: optimise images before uploading. Do not rely on the CDN to do it for you.

Does Shopify's Built-in CDN Help?

Yes, and it is worth understanding what it handles so you know where the gaps are.

Shopify's CDN serves your images from servers geographically close to your visitors, which reduces latency. It also supports automatic WebP conversion for browsers that support the format, and it allows image resizing via URL parameters (appending _800x.jpg to a filename serves an 800px-wide version).

What the CDN does automatically:

  • Serves images from a nearby edge server
  • Converts images to WebP for supported browsers
  • Allows responsive image sizing via URL parameters

What the CDN does not do:

  • Strip EXIF metadata from camera files (this adds unnecessary file size)
  • Apply aggressive enough compression for very large source files
  • Implement lazy loading (this requires theme-level work)
  • Fix images uploaded at unnecessarily large dimensions

You still need to do the work at source.

What Is the Right File Format: WebP, JPEG, or PNG?

Format Best use case Typical size vs JPEG
WebP All product and blog photography 25% to 35% smaller
JPEG Fallback for older systems, bulk existing catalogues Baseline
PNG Images requiring transparency (logos, badges, icons) Larger than JPEG/WebP

For Shopify product images, upload JPEG or WebP. Shopify's CDN will serve WebP to browsers that support it regardless of the uploaded format. However, uploading WebP directly reduces file size further and gives you more control.

Avoid uploading PNG files for product photography. PNGs are significantly larger than JPEGs for photographic content and offer no quality benefit for product shots without transparent backgrounds.

How Do You Name Image Files for SEO?

Image filenames are part of the image URL. Google reads these as a relevance signal for what the image contains.

Bad filenames:

  • IMG_4521.jpg
  • DSC00142.jpg
  • product1.jpg

Good filenames:

  • brown-leather-bifold-wallet.jpg
  • mens-merino-wool-crew-neck-navy.jpg
  • cast-iron-skillet-26cm-black.jpg

Rules for image filenames:

  • Lowercase letters only
  • Hyphens to separate words, not underscores or spaces
  • Include the primary keyword for the page the image will appear on
  • Be specific: "red-merino-wool-scarf-mens" beats "red-scarf"
  • Two to four descriptive words is enough. Do not stuff keywords.

For bulk renaming before upload, Renamer (Mac) and Bulk Rename Utility (Windows) can process hundreds of files at once. Build correct naming into your product photography workflow as a standard step.

How Do You Write Alt Text That Helps SEO?

Alt text serves two purposes: it describes images to screen readers for accessibility, and it tells Google what an image contains. Both matter.

In Shopify, add alt text to product images directly in the product editor. Click any product image thumbnail and an alt text field appears in the sidebar.

Good alt text principles:

  • Describe the image accurately. Google can now analyse image content directly, so inaccurate alt text is counterproductive.
  • Include your primary keyword where it fits naturally. Do not force it.
  • Keep it under 125 characters.
  • Do not start with "Image of" or "Photo of". Just describe what is shown.
  • Use different alt text for different images of the same product.

Examples:

Context Bad alt text Good alt text
Product front view wallet Brown leather bifold wallet front view, card slots visible
Lifestyle shot product image 3 Man wearing navy merino crew neck jumper outdoors
Detail shot IMG_4521 Stainless steel watch clasp close-up, brushed finish

For blog post images, Shopify's post editor has an alt text field when you insert any image. Use it every time.

How Many Product Images Should You Have, and What Size?

Multiple product images help SEO by providing more alt text signals covering different keyword angles. They also improve conversion rates by giving shoppers a complete view of the product.

Recommended product image specifications:

Specification Recommendation
Minimum dimensions 800 x 800px
Recommended dimensions 1,200 x 1,200px
High-zoom requirement Up to 2,000 x 2,000px
Maximum file size Under 200KB (under 100KB for WebP is achievable)
Format JPEG or WebP
Images per product 3 to 8

Images below 800px look poor when zoomed. Images above 2,000px add unnecessary load time without visible quality benefit at standard screen sizes.

What Tools Do You Use to Compress Images?

Desktop tools (compress before upload):

  • Squoosh (free, squoosh.app): Google's browser-based compressor. Supports WebP, JPEG, and PNG. Shows a before/after quality comparison at any compression level. Target 82% quality for WebP.
  • ImageOptim (free, Mac): Drag-and-drop batch compression. Strips metadata and applies lossless compression. Straightforward for small batches.
  • ShortPixel Desktop (paid, from £3.99 per 1,000 images): Efficient bulk converter for large catalogues. Worth using for a one-time cleanup of an existing library.

Shopify apps (for existing uploaded images):

  • TinyIMG (free tier, paid from £9/month): Automatically compresses new uploads and can bulk process your existing image library. Also handles alt text automation and broken image detection. The most comprehensive option for most merchants.
  • SEO Image Optimizer (free tier, paid from £13.99/month): Similar scope to TinyIMG. Compression, alt text generation, and sitemap integration. The auto alt text generation is useful for large catalogues but review the output manually for accuracy.
  • Crush.pics (from £3.99/month): Straightforward compression app with lower cost entry. Useful for merchants who only need compression without wider SEO features.

For new stores or merchants starting from scratch: optimise images manually using Squoosh before uploading. For large existing catalogues: a one-time ShortPixel Desktop run followed by TinyIMG for ongoing uploads is cost-effective.

Does Lazy Loading Matter?

Yes, particularly on collection pages with many products. Lazy loading defers loading of images below the fold until the user scrolls down to them. On a collection page with 48 products, this prevents all 48 product images from loading at once, which dramatically improves initial page load speed.

Most current Shopify themes implement lazy loading via the loading="lazy" attribute on image tags. To check yours: right-click on a collection page, select View Page Source, search for loading=. You should see loading="lazy" on product card images.

If your theme does not use lazy loading on collection page images, this is a theme-level change worth making. A developer can add loading="lazy" to the relevant Liquid image tags quickly. The impact on LCP scores on collection pages can be substantial.

The one image that should NOT have lazy loading is the first visible product image on a product page or the hero image on the homepage. This image should load immediately as it is typically the LCP element.

Frequently Asked Questions

Does Shopify automatically optimise images when I upload them? Shopify applies CDN-level processing and serves WebP to supported browsers, but this does not fully replace pre-upload optimisation. If you upload a 6MB file, the CDN reduces it, but not to the level achievable by proper compression before upload. Compress images to target sizes before uploading, or use TinyIMG to process your existing library.

Should I delete old, large images from Shopify to save storage space? Shopify does not charge by storage volume, so there is no financial reason to delete unused images. However, removing unused images from product pages reduces the number of image requests on those pages, which has a marginal positive effect on load time.

Will fixing alt text on existing images improve search rankings quickly? Alt text improvements on product images typically show in Google Image Search within a few weeks of Googlebot re-crawling those pages. For text search rankings, alt text is a supporting signal rather than a primary ranking factor. The bigger, more direct win is usually improved Core Web Vitals from image compression, which affects organic rankings more directly.

Can I bulk update alt text without an app? Yes. Export your product catalogue as a CSV from Shopify admin (Products, then Export). The CSV includes an Image Alt Text column. Fill in the alt text values and reimport the CSV. This updates alt text across your full catalogue without touching the images. Always back up your product data before doing bulk imports.


Key Actions to Take Now

  1. Run your homepage and top three collection pages through Google PageSpeed Insights (pagespeed.web.dev). Note your LCP score. If it is above 2.5 seconds, images are likely a contributing factor.
  2. Download TinyIMG (free tier) and run a bulk compression scan on your existing image library. Review the oversized images it identifies.
  3. Check your top 20 product images: do they have descriptive filenames and alt text? If not, rename and update both.
  4. Confirm your theme uses loading="lazy" on collection page product images by checking the page source.
  5. Set a standard going forward: all new product images uploaded should be JPEG or WebP, maximum 1,200 x 1,200px, under 200KB before upload.
  6. Add alt text to every image in your most visited blog posts that currently has empty or generic alt text.