WCAG A/AA requirement Priority: Serious
Images have no text description
Some images have no alternative text, so people who cannot see them get no information about what they show.
This text was translated automatically and has not been reviewed by a native speaker yet.
Why it matters to your customers
Screen reader users hear nothing or a file name such as "IMG_2041.jpg" instead of the product, colour or offer. They may miss key details and leave for a shop that describes its products.
Who is affected
- blind customers
- screen reader users
- people with images turned off or on slow connections
How to fix it
Add an alt attribute to every <img>. Describe what matters for the purchase (product, colour, key detail) in a short phrase. Use alt="" for purely decorative images so they are skipped. Do not repeat "image of" or stuff keywords.
On Shopify
Add alt text to product media and to images in theme sections from the Shopify admin. If alt text exists but is not output, the theme's Liquid template is usually missing the alt attribute on the image tag.
On Shoptet (CZ)
Add descriptions to product and banner images in the admin where the template allows it. If the template does not output them, a template change through Shoptet or a partner is usually needed.
On PrestaShop
Product images usually take their alt from the image legend or product name set in the back office. Check that the theme's .tpl templates print the alt attribute, including in modules such as sliders.
On WooCommerce
Fill the Alternative Text field in the WordPress Media Library and check that the theme or page builder outputs it. Images inserted by plugins or sliders may need their own alt settings.
Standards
| Standard | Clause |
|---|---|
| WCAG 2.2 | 1.1.1 (A) Non-text Content |
| WCAG 2.1 | 1.1.1 (A) Non-text Content |
| WCAG 2.0 | 1.1.1 (A) Non-text Content |
| EN 301 549 4.1.1 | 9.1.1.1 |
| EN 301 549 3.2.1 | 9.1.1.1 |
| Section 508 2017 | E205.4 |
| ДСТУ EN 301 549 2022 | 9.1.1.1 |
Automated check: axe-core rule image-alt.
dequeuniversity.com, github.com, www.w3.org
Related checks
-
The page uses outdated blinking-text markup
WCAG 2.2.2 A
-
Text is hard to read because of low contrast
WCAG 1.4.3 AA
-
Some labels point to the wrong element
WCAG 4.1.2 A
-
Accessibility attributes have wrong values
WCAG 4.1.2 A