How to fix image alt on Adobe Commerce (Magento)

Add descriptive alt text to every meaningful image, and mark purely decorative images with an empty alt attribute or role="presentation".

Steps for Adobe Commerce (Magento)

  1. Product images: Admin → Catalog → Products → [Product name] → Images and Videos section → hover over an image → click the pencil icon → fill in the 'Alt Text' field → Save.
  2. CMS Page/Block images: Content → Pages (or Blocks) → [Page/Block] → open the WYSIWYG editor → click an image → click 'Insert/Edit Image' (the image icon) → fill in the 'Image Description' (alt text) field.
  3. Theme/layout images added via XML or templates: locate the relevant .phtml template file in app/design/frontend/[Vendor]/[Theme]/ → find the <img> tag and add or update the alt attribute, using a translatable string where appropriate (e.g., alt="<?= $block->escapeHtmlAttr(__('Description here')) ?>").
  4. For bulk product image alt text updates, use the Magento Import/Export feature (System → Data Transfer → Import) with the 'Catalog Products' entity, including the 'small_image_label', 'thumbnail_label', and 'base_image_label' columns.
Official Adobe Commerce (Magento) documentation ↗

What is image alt?

Every `<img>` element on a web page should carry an `alt` attribute that describes what the image shows or does. This text is read aloud by screen readers for visitors who are blind or have low vision, and it appears in place of the image when it fails to load. Meaningful images (products, banners, infographics) need a short, accurate description. Purely decorative images (background shapes, dividers, icons used only for visual flair) should have an empty `alt=""` or `role="presentation"` so screen readers skip them entirely. WCAG Success Criterion 1.1.1 "Non-text Content" requires this for all conformance levels (A, AA, AAA).

Missing alt text directly harms your store in three ways. First, it excludes customers who rely on screen readers — they cannot understand what your products look like, which damages conversions and exposes you to legal risk under accessibility laws (ADA Title III in the US, EAA in Europe, AODA in Canada). Second, search engines like Google read alt text to understand and index your images; missing alt text means your product and category images are invisible to image search, costing you free organic traffic. Third, automated accessibility audits flag missing alt text as a critical failure, and regulators, plaintiff attorneys, and audit tools surface it prominently — making it one of the highest-priority issues to address on any ecommerce site.

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 scan — we’ll find image alt and every other issue across your whole site.

Scan my site free

Fix image alt on another platform