Elements with role="img" missing a text alternative on Shopify
What this is
3 elements with `role="img"` have no accessible name, so the image is announced without a description.
Who it affects
- Screen reader users
Standards
How to fix it
- Add `aria-label` (or `aria-labelledby`) describing the image, or remove `role="img"` if it is decorative.
Example
Before
<div role="img" class="logo"></div>After
<div role="img" class="logo" aria-label="TODO: describe the image"></div>Replace the TODO with a real description.
On Shopify
Products: Admin → Products → open the product → click the image → "Add alt text". Theme images: Online Store → Customize → select the image section → fill the alt text field. Liquid: `{{ image | image_url | image_tag: alt: image.alt }}`.
Other platforms
Prompt for an AI coding tool
Scan your site with AccessibilityBrief and you get a ready-to-use prompt for this problem, with the exact elements on your pages filled in.
Check your own website
Paste a web address. The free scan checks one page and shows what it finds.
More fixes
Automated testing detects only a portion of WCAG issues. Manual testing is required to assess full conformance.