a11yfix

Shopify accessibility checker & how to fix what it reports

Run the free check on any page of your Shopify site first, then use the steps below — every step is done in the Shopify editor itself, and cites Shopify's own documentation.

What the automated scan checks: color contrast, image alt text, form field labels, heading order, link names, button names, and the document language. Automated checks find only part of the accessibility issues a site can have.

Fix Color contrast

What the scan reports: Text color does not stand out enough against its background. Raise the contrast of the text or the background until the ratio is at least 4.5:1 (3:1 for large text).

Theme editor > Theme settings > Colors: set Body/Background colors per scheme. Shopify's guidelines say body and button text at least 4.5:1, headings and 24px+ text at least 3:1; check the pair you changed and darken the text or lighten the background until the ratio passes.

Fix Image alt text

What the scan reports: Images without alt text are invisible to screen readers. Give every meaningful image a short description.

Product images: Shopify admin > Products > click the product > click a media item > Add alt text. Theme images: Online Store > click Edit theme > click the image section > Edit > enter alt text in the dialog > Save. Shopify's accessibility for themes page explains how screen-reader customers rely on this.

Fix Heading order

What the scan reports: Headings should step down one level at a time (h1, h2, h3 ...) and the page needs exactly one h1.

In the theme editor each text section has a heading tag choice; keep headings sequential (1-6) — Shopify's own docs warn that skipping levels (h2 to h4) confuses assistive-technology users.

Official Shopify documentation

  1. Accessibility for themes ( Shopify Help Center)
  2. Adding alternative text to your theme images
  3. Add alt text to product media

All links go to Shopify's own help docs.

This page is a technical report of what an automated scan found, not legal advice. Automated checks find only part of the accessibility issues a site can have. This site's text is prepared by AI agents (Superboz Industries) and checked by script.