
How to Add Alt Text to Shopify Product Images: 4 Methods (Manual + Bulk + AI)
Missing alt text is the single most-cited violation in ADA Title III digital accessibility lawsuits. It is also one of the easiest violations to fix at scale on Shopify — the platform supports per-image alt text natively, the CSV export/import workflow handles bulk edits, and AI-driven tools write alt text via the Admin API. This guide covers every method that actually works in 2026, with the exact WCAG criterion, Liquid template snippet, and legal-defense angle for each.
Why alt text matters — three layers
1. Accessibility (the original purpose)
Screen readers — JAWS, NVDA, VoiceOver, TalkBack — convert on-screen content to synthesized speech for blind and low-vision users. When a screen reader encounters <img> without an alt attribute, it announces "image" or reads the filename. When it encounters <img alt="">, it skips silently. When it encounters <img alt="Navy linen wide-leg trousers">, it announces the description as if it were the visual content.
For ecommerce specifically, missing alt text on product photos is functionally a denial of access — the screen-reader user cannot tell what they are buying.
2. ADA + EAA legal exposure
Missing alt text is the violation most commonly cited in ADA Title III digital-accessibility demand letters in the United States and in EAA / market-surveillance complaints in the European Union. Plaintiff law firms run automated scanners (typically axe-core or open-source equivalents) that flag every <img> without an alt attribute, then bundle those findings into the complaint as evidence of inaccessibility.
The DOJ's 2024 Title II web rule explicitly references WCAG 2.0 / 2.1 AA as the federal standard for state and local government websites; private-sector ecommerce sites are held to the same de-facto standard under Title III case law (Robles v Domino's Pizza, 9th Cir. 2019). EAA enforcement (live since 28 June 2025) uses EN 301 549 v3.2.1 which incorporates WCAG 2.1 AA by reference.
3. SEO + AI shopping discovery
Google Image Search uses alt text alongside the surrounding HTML, file name, and structured-data Product schema to understand what an image depicts. ChatGPT, Perplexity, and Google's AI Overview shopping experiences increasingly rely on this same alt-text layer when extracting product details for shopping queries.
Descriptive alt text on Shopify product photos lifts indexing in image-led search, AI shopping discovery, and accessibility compliance simultaneously.
What "good alt text" looks like
The W3C's alt-text decision tree breaks images into four categories:
- Functional: describes the function, not the visual. A magnifying-glass icon button →
alt="Open search", notalt="magnifying glass". - Informative product photo: describes the product. →
alt="Navy linen wide-leg trousers, model wearing size M". - Decorative: adds no information beyond visual flourish. →
alt=""(empty, intentional). Screen readers skip silently. - Complex: charts, infographics, sizing guides need a longer description in adjacent text plus a short alt.
For Shopify product images specifically:
- Include the product name + a visually-distinguishing detail.
- Avoid filler ("image of...", "photo of...") — screen readers already announce that it is an image.
- Avoid stuffing keywords for SEO — Google penalizes this and screen-reader users get a worse experience.
- Match length to image complexity — typical product photo: 8-15 words.
Method 1 — Per-image, in the Shopify admin
Best for: small catalogs, one-off image updates, the merchant editing manually.
- Log in to Shopify admin.
- Open Products → click the product → scroll to Media.
- Click the image. The image preview opens.
- Click Edit alt text (button under the image).
- Type the alt text. Save.
The text is stored on the MediaImage GraphQL object as alt. Every Online Store 2.0 theme passes it through to <img alt=""> automatically. No theme code change required.
The Shopify Admin API exposes the same field at productMedia.alt, accessible via mutation { productImageUpdate { ... } } for programmatic updates.
Method 2 — Bulk via Shopify Products CSV
Best for: catalogs of 50+ products, one-time backfill, no app installs.
- Shopify admin → Products → Export. Choose "All products" + "Plain CSV file for Excel, Numbers, etc."
- Open the CSV. The column you want is
Image Alt Text(column AC in the standard export, may shift in future Shopify schema changes). - Edit the alt-text column. Tip: use a spreadsheet formula like
="Navy "&B2&", model wearing size M"to template alt text from the existing product title column. - Save the CSV.
- Shopify admin → Products → Import. Choose the edited CSV and check "Overwrite any current products that have the same handle".
- Shopify processes the import; alt text updates on every image with a matching
Image PositionandHandle.
The CSV approach has a hard limit at very large catalogs (10K+ SKUs) where the import takes hours and times out. For those, use Method 4 (AI auto-fix via API) or Matrixify.
Method 3 — Bulk via Matrixify (third-party app)
Best for: 1K-50K SKU catalogs, ongoing alt-text maintenance, multilingual stores.
Matrixify (formerly Excelify) is the Shopify app most operators reach for when the native CSV is too limited. It exposes more granular columns (per-language alt text, per-image position alt text, image source URL alongside alt) and handles much larger imports.
The workflow is identical to Method 2: export → edit Variant Image Alt Text and Image Alt Text columns → import.
Matrixify is paid (starts ~$20/month). For one-time backfills you can use the free trial.
Method 4 — AI auto-fix via the Shopify Admin API (AccessComply)
Best for: any catalog where the merchant does not want to write alt text manually.
AccessComply's AltTextAgent runs in three steps:
- Scan the storefront with axe-core via Playwright. Identify every
<img>rendered withalt=""or noaltattribute that resolves to a Shopify-hosted CDN URL. - For each image, generate alt text using a vision model trained on product photography. The output describes the product, not the visual surface.
- Write the alt text via the Shopify Admin API's
productImageUpdatemutation (or the equivalentproductMediamutation for media items). Backup the previous state first, write the change, re-scan to verify the violation is resolved, log the fix in the audit trail.
The audit trail (scan history + fix records + accessibility statement) is the operative legal-defense documentation in ADA Title III proceedings and in EAA market-surveillance actions.
The Liquid template — what your theme should be doing
Every Online Store 2.0 Shopify theme should render product images with the alt-text passthrough:
{% assign image = product.featured_image %}
<img
src="{{ image | image_url: width: 800 }}"
alt="{{ image.alt | escape | default: product.title }}"
width="{{ image.width }}"
height="{{ image.height }}"
loading="lazy"
decoding="async">
The key line is alt="{{ image.alt | escape | default: product.title }}". This:
- Reads the alt text from the image record.
- Escapes any HTML to prevent XSS.
- Falls back to the product title if no per-image alt text exists.
Themes that hardcode alt="" or omit the attribute entirely fail WCAG 1.1.1 even when the merchant has filled in alt text in the admin. AccessComply detects this in its scan and patches the Liquid template directly.
Common alt-text mistakes on Shopify
- Filename as alt text:
alt="IMG_4567.JPG"— happens when the theme falls back to the file name. Always set explicit alt text. - Keyword stuffing:
alt="navy trousers buy navy trousers cheap navy trousers Shopify"— Google penalizes this and screen-reader users get a worse experience. - Repeating the product title verbatim: technically valid but adds no information for screen-reader users beyond what the surrounding HTML already provides. Add a visually-distinguishing detail.
alt="image"oralt="photo": zero information — equivalent to no alt text from the screen-reader user's perspective.- Different alt text on every variant of the same product: typically wrong unless the variants visually differ. Use the product-level alt text and let variants inherit unless visually different.
- Decorative-image alt text: spacer GIFs, ornamental flourishes, and brand-mark icons next to a labeled link should use
alt="", not a description. Screen readers skip silently.
Quick checklist
- Every product's featured image has alt text describing the product.
- Variant-specific images that look different from the master have variant-specific alt text.
- Decorative images (background flourishes, spacer GIFs, ornamental icons) use
alt="". - Functional images (icon-only buttons) use
aria-labelon the button +aria-hidden="true"on the inner SVG. - Theme
<img>tags readimage.altnot hardcoded strings. - The accessibility statement on
/pages/accessibility-statementdocuments the alt-text remediation effort.
Verify your work — free scan
Run a free AccessComply scan on your storefront. The scan output lists every <img> failing WCAG 1.1.1 with the exact URL and the violation reason. Free tier covers 3 scans per month with no signup.
Further reading
- W3C — Alt text decision tree
- WCAG 2.1 SC 1.1.1 Non-text Content
- WCAG glossary — alt text
- WCAG glossary — empty alt attribute
- Shopify Help — Add alt text to product images
- Shopify GraphQL — productMedia mutation reference
- AccessComply — Why accessibility overlays don't work
- AccessComply — How to fix accessibility issues on Shopify
- AccessComply — WCAG 2.1 AA checklist for Shopify
Scan your store free, fix violations at the source
AccessComply scans your Shopify store for ADA + EAA / WCAG 2.1 + 2.2 AA violations and applies real source-code fixes — no overlays, no widgets.