How to fix image alt on Webflow

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 Webflow

  1. **Designer — image elements:** Open the Webflow Designer → click on any Image element on the canvas → in the right-hand Settings panel (the gear icon), find the 'Alt Text' field → type your description, OR toggle 'Decorative' to mark it as decorative (this outputs `alt=""`).
  2. **CMS collection images:** Designer → CMS → Content → select a Collection → click a record → find the image field → add or edit the alt text sub-field. Alternatively, in the Designer, bind the alt text of an image element to a CMS text field via the Settings panel → 'Get alt text from' → choose a CMS field.
  3. **Ecommerce product images (Webflow Commerce):** Designer → Ecommerce → Products → edit a product → click the product image in the editor → enter alt text in the Settings panel, or bind it to a product field.
  4. **Bulk update via CMS:** Export your CMS collection as CSV (CMS → Collections → export) → fill in the alt text column → re-import.
  5. **Webflow Accessibility Checker:** Use the built-in Webflow Audit panel (the accessibility audit icon in the left toolbar) to surface all images missing alt text in your project.
Official Webflow 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 Webflow 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