Shopify · EAA

Shopify and the European Accessibility Act: Common Issues and How to Fix Them

Many Shopify themes are well built, but the typical gaps appear during setup: images without alt text, icon buttons without names, and no accessibility statement.

1. Alt text for product images

Products → product → Media → image → alt text. Describe what matters for the purchase: “Merino sock in navy, size 6–8”, not “IMG_2231”.

2. Name icon buttons

<button class="header__icon--cart" aria-label="Cart, {{ cart.item_count }} items">
  {% render 'icon-cart' %}   <!-- in the icon snippet: aria-hidden="true" -->
</button>

3. Label the search field

<label for="Search-In-Modal" class="visually-hidden">Search the shop</label>
<input id="Search-In-Modal" type="search" placeholder="Search">

4. Add the accessibility statement

Online Store → Pages → new page “Accessibility”, paste the generated text, then add it to the footer menu under Navigation.

5. Check your apps

Review widgets, chat windows and cookie banners from third parties often bring their own barriers. Test them with the keyboard.

FAQ

Is Shopify automatically EAA compliant?

No. Shopify and many themes provide a good foundation, but content (alt text, link texts), theme customisations, apps and the accessibility statement are the merchant's responsibility.

Where do I add alt text in Shopify?

In the product under Media: click the image and choose “Add alt text”. For other files under Content → Files.