Guide · Fix

Alt text for Shopify product images

The most common accessibility issue in e-commerce, and the one you can fix today without touching code.

Why it matters

A screen reader cannot look at a photo. When an image has no text alternative, the user hears either nothing or the file name — IMG_4471.jpg tells a blind shopper nothing about the product they are considering buying. This maps to WCAG 2.1 success criterion 1.1.1 (Non-text Content), which EN 301 549 — the standard behind the European Accessibility Act — adopts directly.

Where to add it in Shopify

  1. Product images: Products → open a product → hover an image → Add alt text (or the ALT badge on the image).
  2. Theme images (banners, hero sections, logos): Online Store → Themes → Customize → select the image block; most themes expose an alt or “image description” field.
  3. Content pages and blog posts: in the rich text editor, select the image → edit → alt text field.

What a good description actually says

Describe what matters for this page, not everything visible. On a product page, the alt text should carry the information a sighted shopper gets from the photo.

WeakBetterWhy
“shoe”“Grey wool sneaker, side view, white rubber sole”Carries colour, material and angle — the buying details
“image of product”“Ceramic mug, 350 ml, matte black, with handle”“Image of” is noise — the screen reader already says it is an image
“buy running shoes cheap online”“Red running shoe with reflective laces”Keyword stuffing in alt is a usability failure and an SEO risk

When empty alt is the right answer

Purely decorative images — background textures, dividers, spacer graphics — should have an empty alt attribute (alt=""), not a description. That tells assistive technology to skip them. Describing decoration is worse than describing nothing: it clutters the page for the people you are trying to help.

Rule of thumb: if you removed the image, would the page lose information? If yes, describe it. If no, empty alt.

Doing it at scale

A catalogue with hundreds of images is the reason this issue stays open in most stores. Two things make it tractable:

How to verify

Re-run an accessibility scan after your changes: the image-alt rule should drop to zero occurrences on the pages you fixed. Keep in mind that a scan can only confirm that alt text exists — whether it is meaningful is a judgement only a person can make.

See where your store stands — free

Check your storefront against WCAG 2.1 AA and EN 301 549 in about 30 seconds. No install, no account.

Run the free check

This guide is information, not legal advice, and does not guarantee compliance with the EAA, the BFSG or any national law. Automated testing detects only a portion of accessibility issues and does not replace an expert audit or testing with people who use assistive technology.

Related