Shopify image alt text and accessibility: informative vs decorative (2026)

August 4, 2026
Shopify Tips
11 min read
a product photo card connected by a line to a screen-reader speech-wave and ear symbol, representing image alt text being read aloud for accessibility on an online store

Short answer: Alt text is a written description a screen reader reads aloud when it reaches an image, and a fallback when the image fails to load. Informative images need a short, specific description. Purely decorative images should carry an empty alt="" so assistive tech skips them. SEO is a side benefit, not the point.

Most Shopify advice treats alt text as an SEO trick: stuff a keyword in, rank in Google Images, move on. That gets it backwards. Alt text exists so a blind shopper using a screen reader knows what your product photo shows. Get that right and the SEO takes care of itself. Get it wrong and you have keyword soup that helps nobody and can read as spam.

This guide is the accessibility-first version. When does an image need a description, when should it stay silent, how long is too long, and where does the law actually stand for a Shopify store in 2026? Let’s go in order.

In this post

What alt text is actually for

Alt text (the alt attribute on an <img>) does two jobs. First, a screen reader announces it so a shopper who cannot see the image still knows what it shows. Second, if the image fails to load, the browser shows the alt text in its place. Everything else, including any SEO value, rides on top of those two.

Google is refreshingly plain about its own use of it: it reads alt text “along with computer vision algorithms and the contents of the page to understand the subject matter of the image.” That mostly helps you in Google Images, not in general web ranking. So write the description a person needs, and you have also written the text Google wants. The reverse, writing for Google first, produces alt text that fails the person and, past a point, gets flagged as keyword stuffing.

Doing this by hand across a few products is easy. Across a catalog of thousands it is a slog, which is why a free alt text generator can give you a consistent first draft to edit rather than a blank field to dread. Draft with a tool, then fix the ones that matter by hand.

Informative, decorative, or functional?

The single decision that changes how you write alt text is what the image is doing on the page. The W3C’s own decision tree sorts images into a few buckets, and each one gets a different treatment:

  • Informative. It carries meaning a sighted shopper would get: the product, a diagram, a size chart. Describe it briefly and specifically.
  • Functional. It is a link or a button (a logo that links home, an icon that adds to cart). The alt text describes the action or destination, not the picture.
  • Decorative. It adds visual polish but no information: a background texture, a divider, a mood shot that repeats what the text already says. It gets an empty alt="".
  • Complex. A chart or infographic with real data. A short alt points to a full text version elsewhere on the page, because you cannot cram a chart into one attribute.
  • Image of text. If the picture is words (a promo banner), the alt repeats those words. Better still, use real text instead of an image where you can.

Here is the part that trips people up: the same image can be informative on one page and decorative on another. A close-up of fabric weave is informative on a product page where texture is the selling point, and decorative in a footer collage. Context decides, not the file.

When should Shopify alt text be blank?

Leave alt text blank when the image is purely decorative and the page already says everything the image would. A screen reader then glides past it instead of stopping to read something pointless. Announcing every divider and background flourish makes the page exhausting to listen to, which is its own accessibility failure.

But blank means one exact thing, and this is the mistake to avoid: the attribute must be present and empty, written as alt="". Do NOT delete the attribute entirely. When the attribute is missing, many screen readers fall back to reading the file name out loud, character by character, so your shopper hears the raw “I M G 4 7 2 9 dot j p g” instead of blessed silence. Present and empty is silence. Absent is noise.

Why does Shopify sometimes leave variant images with blank alt on its own? Because the theme, not the admin, controls what actually renders, and some themes hardcode an empty alt on gallery images. We dug into that specific quirk in why Shopify leaves variant images with blank alt text.

How to write alt text that works

For an informative product image, name the attributes a shopper would actually search or want to hear: type, color, material, pattern, cut. Shopify’s own example says it best. Weak: “shirt.” Strong: “Men’s navy and white floral Hawaiian short-sleeve button-down shirt.” One of those tells a blind shopper what they are buying. The other tells them nothing.

  • Skip “image of” and “photo of.” The screen reader already announces that it is an image. Those two words waste the listener’s time on every single photo.
  • Keep it succinct. There is no hard character limit in the spec, but a screen reader cannot pause or skim mid-attribute, so around 125 characters is the practical ceiling. Shopify’s field allows up to 512 and recommends 125 or fewer.
  • Do not stuff keywords. Google calls it out directly: filling alt attributes with keywords “results in a negative user experience and may cause your site to be seen as spam.”
  • Do not repeat the caption. If a line of text right next to the image already says it, the alt should add something or stay out of the way, not echo word for word.
  • Describe the variant, not just the product. For a red version of a shoe, the useful detail is the color and the angle, which doubles as the search-relevant text and the accessible description.

Filenames matter too, for a related but separate reason. A descriptive file name (navy-hawaiian-shirt.jpg, not IMG_4729.jpg) helps Google and is a courtesy to anyone who hears it as a fallback. We cover that side in the product image SEO guide and the image filename guide.

Alt text and the law: WCAG and ADA

Alt text is not just polite, it is the very first thing accessibility standards ask for. WCAG Success Criterion 1.1.1, “Non-text Content,” is a Level A requirement (the base level, not even the middle tier), and it says all meaningful non-text content needs a text alternative that serves the same purpose. Decorative content must be marked so assistive tech can ignore it. Missing alt on an informative image is a straightforward failure of the most fundamental rule in the book.

Now the part everyone gets wrong. It is not accurate to say “the ADA legally requires WCAG 2.1 AA for online stores.” For private businesses, which is what a Shopify store is under ADA Title III, there is no codified web-accessibility technical standard. What exists is a pattern: courts and settlements treat WCAG 2.1 Level AA as the de facto benchmark, and the Ninth Circuit let a website accessibility case (Robles v. Domino’s) proceed when the Supreme Court declined to review it in 2019. The 2024 Department of Justice rule that names WCAG 2.1 AA applies to state and local government, not to merchants.

The practical reality is blunter than the legal theory. Thousands of website accessibility lawsuits are filed in the US every year, the number has been climbing, and ecommerce is the most common target. Missing alt text and poor color contrast are among the easiest violations for a plaintiff to document, because a scan finds them in seconds. Fixing alt text is not a legal guarantee, but it removes one of the cheapest reasons to get a demand letter. If contrast is your worry, run your palette through the free color contrast checker and read our Shopify WCAG accessibility guide.

How to add and check alt text in Shopify

  1. Go to Products, open a product, and click a media item.
  2. Click Add alt text, write the description, and save. Shopify may suggest alt text for images that lack it; treat the suggestion as a draft to check, not a finished answer.
  3. For theme images (banners, section backgrounds) that are not product media, add alt text in the theme editor instead, or set decorative ones to blank.
  4. Verify what actually renders. The admin field and the live page can disagree, because some themes hardcode alt="" on gallery images regardless of what you typed. Right-click a product image on the live storefront, choose Inspect, and read the real alt on the <img>.

That last step is the one people skip, and it is where accessibility audits catch stores by surprise. What you saved in the admin is not always what a screen reader receives. Check the output, not the input.

Frequently asked questions

Does every Shopify image need alt text?

No. Every informative image needs a description, but purely decorative images should carry an empty alt (alt="") so screen readers skip them. The rule is not “describe everything,” it is “describe what carries meaning and silence what does not.”

How long should Shopify alt text be?

There is no hard limit in the spec, but keep it around 125 characters because screen readers cannot skim mid-attribute. Shopify’s field allows up to 512 characters and recommends 125 or fewer. Specific and short beats long and vague.

Is alt text a Google ranking factor?

It mainly helps Google understand images and rank them in Google Images, not general web rankings. Google reads alt text alongside computer vision and page content. Write for the shopper who cannot see the image, and you get the SEO value as a byproduct. Keyword stuffing can backfire as a spam signal.

Does the ADA require alt text on my Shopify store?

There is no codified ADA web standard for private businesses, but courts treat WCAG 2.1 AA as the de facto benchmark, and alt text is its most basic requirement (WCAG 1.1.1, Level A). Thousands of accessibility lawsuits target ecommerce each year, and missing alt text is one of the easiest violations to document, so adding it lowers real risk.

Should I write “image of” in alt text?

No. Screen readers already announce that the element is an image, so “image of” or “photo of” just wastes the listener’s time on every photo. Start straight with the description: “Navy suede ankle boot, side view,” not “Image of a navy suede ankle boot.”

Why do my Shopify images show blank alt text even though I filled it in?

Usually the theme, not the admin, is the culprit. Some themes hardcode alt="" on gallery or variant images, so the alt you typed never reaches the page. Inspect the live image to see the real attribute, and if it is blank, the fix belongs in the theme template, not the product editor.

Start with the images that carry the most meaning: your product photos. Get their alt text specific and human, mark the decoration blank, then check what the theme actually renders. That order fixes accessibility and image SEO in one pass. Next, walk the rest of the page in the WCAG accessibility guide.

Co-Founder at Craftshift

You may also like