How to fix image alt on Adobe Commerce (Magento)

Add a descriptive `alt` attribute to every `<img>` element on your store so screen readers and search engines can understand what each image shows.

Steps for Adobe Commerce (Magento)

  1. **Product images:** Admin → Catalog → Products → select a product → scroll to the 'Images and Videos' section → hover over an image → click the gear icon → fill in the 'Alt Text' field → Save.
  2. **CMS page / block images:** Admin → Content → Pages (or Blocks) → edit a page → in the WYSIWYG editor, click an image → click 'Insert Image' properties (the image icon) → fill in the 'Image Alt Text' field → Insert.
  3. **Theme template files:** Via SSH or file manager, locate the relevant `.phtml` template (e.g., `app/design/frontend/<Vendor>/<theme>/Magento_Catalog/templates/product/image.phtml`) and ensure the `alt` attribute is output using the product's `$block->getImageAlt()` or similar helper.
  4. **Bulk import:** Admin → System → Import → Entity Type: Products → download a sample CSV, fill in the `image_label` column (which maps to image alt text for the base image), and re-import.
  5. **Magento Open Source / Adobe Commerce CLI:** Use a data patch or upgrade script to programmatically set the `image_label` attribute on existing product images in bulk via the product repository.
Official Adobe Commerce (Magento) documentation ↗
<img src="blue-leather-wallet.jpg" alt="Blue leather wallet with card slots, open view">

<!-- Decorative image — intentionally empty alt -->
<img src="divider-ornament.png" alt="">

What is image alt?

Every image on a webpage can carry a short text description called "alt text" (alternative text), written inside the image's HTML tag as `alt="your description here"`. When an image has no `alt` attribute at all, assistive technologies like screen readers — used by people who are blind or have low vision — have nothing to announce, so they may read out a raw file name like "img_38472.jpg" or skip the image entirely. WCAG Success Criterion 1.1.1 ("Non-text Content") requires that all meaningful images have a text alternative, and decorative images are explicitly marked as decorative using an empty `alt=""` so they are silently skipped.

**Accessibility & legal risk:** Failing WCAG 1.1.1 is one of the most commonly cited issues in accessibility lawsuits and demand letters under the ADA (US), AODA (Canada), EAA (EU), and similar laws worldwide. A single missing `alt` attribute on a product image can be enough to trigger a complaint. **SEO & organic traffic:** Search engine crawlers cannot "see" images — they rely entirely on alt text to understand image content. Well-written alt text helps your product images rank in Google Image Search and reinforces keyword relevance on product and category pages, driving incremental organic traffic. **Conversions:** When images fail to load (slow connections, CDN errors), the alt text is displayed in place of the image, keeping shoppers informed about what they were looking at and reducing bounce rate.

See the complete Image alt guide for every platform and the full background.

Not sure if your Adobe Commerce (Magento) store has this?

Run a free SEOLZ audit — we’ll find image alt and every other issue across your whole site.

Scan my site free

Fix image alt on another platform