Quick answer: Image SEO on Shopify is mostly a speed problem, not a keyword problem. Product photos are usually the largest thing on the page and the Largest Contentful Paint element, so compression, dimensions and lazy-loading move rankings more than filenames do. This page covers the file and delivery side. For alt text see product image alt text; for the share preview image see social sharing images.

Shopify serves images through its own CDN and generates responsive variants automatically, which means a lot of generic image-SEO advice does not apply here. What is left is a short list, and most of it is about weight.

Why images dominate Shopify Core Web Vitals

On a typical product page the hero image is the LCP element — the largest thing in the viewport, and the thing Google times. If it takes 3.5 seconds to paint, the page fails LCP no matter how fast the rest of the theme is.

Two things make it slow: the file is bigger than the space it renders into, and it is not prioritised. A 2400px image displayed at 800px wastes three quarters of the bytes. Shopify's image_url filter with a width parameter fixes this, and most modern themes already use it — but images inserted into rich-text fields, blog bodies and custom sections usually bypass it entirely.

What to actually do

Upload at 2048px on the longest edge. Shopify generates smaller variants from the original, so uploading larger wastes storage without improving anything. Uploading smaller means the zoom view is soft.

Let Shopify serve WebP. It does this automatically based on the browser's Accept header. Manually converting before upload gains nothing and costs you the JPEG fallback.

Set width and height attributes. Missing dimensions cause layout shift as the image loads, which is a direct CLS penalty. Themes that use image_tag get this free; hand-written <img> in a custom section usually does not.

Lazy-load everything below the fold — and nothing above it. loading="lazy" on the hero image delays the LCP element and makes the score worse. The first image should carry fetchpriority="high" instead.

Image Position Loading Strategy Reason
Above the fold (hero / LCP element) fetchpriority="high" (no loading="lazy") Prevents LCP delay; lazy-load moves the largest visible paint element later and makes the score worse
Above the fold (other images) No loading="lazy" (loads eagerly by default) Visible images should not be deferred; they paint immediately without triggering avoidable layout shifts
Below the fold loading="lazy" Off‑screen images are deferred, reducing initial page weight and preventing them from competing with the LCP element

Compress before upload if the source is a camera file. Shopify's processing is not aggressive. A 6 MB DSLR JPEG becomes a 900 KB variant; the same image run through a compressor first becomes 200 KB with no visible difference.

Filenames and alt text: the honest version

Filenames are a weak signal. Renaming IMG_4821.jpg to blue-merino-scarf.jpg is worth doing when you are uploading anyway, and is not worth a bulk re-upload project — re-uploading breaks existing image URLs and any links to them.

Alt text matters more, mostly for accessibility and Google Images, and it is covered properly in product image alt text.

The one thing worth measuring

Run a product page through PageSpeed Insights and look at only two numbers: the LCP element (it will name the image) and its size. If the LCP element is an image over 200 KB, that is the whole project.

Everything else — filenames, sitemaps, EXIF data — is rounding error next to the image that takes two seconds to paint.

Doing it across a catalogue

The per-page version of this is straightforward. The catalogue version is not: on 800 products the oversized images are a subset, usually the oldest ones or a batch imported from a supplier feed.

RankEngine's speed audit reports per-URL LCP with the offending image named, and its image tools flag oversized files and missing dimensions across the catalogue rather than per page.

Related