Shopify accessibility checker

Check your Shopify site for accessibility problems, then fix them in the Shopify editor with the steps below. No code needed for most of them.

Accessibility on Shopify

Shopify's own themes are a good base, but your products, images and theme settings are yours to get right. Apps for pop-ups, reviews, chat and upsells add their own code to your store, so check your store again after adding one.

How to fix common problems in Shopify

Menus change over time. If a step doesn't match what you see, search the Shopify help centre for the words in quotes.

Describe your images

  1. Product photos: in Shopify admin go to Products, open the product, click the image and choose “Add alt text”.
  2. Other images: go to Content › Files, click the image and fill in “Alt text”.
  3. Images in your theme sections: Online Store › Themes › Customize, click the section and look for an alt text or image description field.

Change your colours

  1. Go to Online Store › Themes › Customize › Theme settings › Colors.
  2. Choose stronger text, button and background colours.
  3. Click Save.

Use proper headings

  1. Go to Online Store › Pages (or Blog posts) and open the page.
  2. Select a section title and choose a Heading from the “Paragraph” format menu, in order.
  3. Click Save.

Reword your links

  1. Go to Online Store › Themes › Customize (or Online Store › Pages for page text).
  2. Click the text or button and change its words so they say where it goes.
  3. Click Save.

Label your form fields

  1. Open the form in your editor and click each field.
  2. Give every field a visible label, like “Email address”. Placeholder text inside the box isn't enough on its own.
  3. Mark which fields are required in the label, not just with colour.

Give each page a title

  1. Open the page, product or collection in Shopify admin.
  2. Scroll to “Search engine listing”, click Edit and fill in the “Page title”.
  3. Click Save.

Set your site language

  1. Go to Settings › Languages.
  2. Make sure your default language is the one your store is written in.

Stop links opening new tabs

  1. Click the link in your editor and open its link settings.
  2. Turn off “Open in new tab” (or “Open in new window”), unless people really need the page to stay open.
  3. If it must open a new tab, add “(opens in new tab)” to the link text.

Stop things playing or moving on their own

  1. Go to Online Store › Themes › Customize and click the slideshow or video section.
  2. Turn off “Auto-rotate slides” or autoplay.
  3. Click Save.

Add captions to videos

  1. For YouTube or Vimeo videos, add captions on YouTube or Vimeo.
  2. For videos uploaded to Shopify, add a captions file if your theme supports it, or ask your theme's developer.

Problems the editor can't fix

Some problems are in the theme's code, like menus you can't use with a keyboard or focus outlines that don't show. Your Alleviator report marks these, and writes a message you can send to your theme's developer (Online Store › Themes shows the theme name), or Shopify Support for Shopify's free themes, with the pages and details they need. If someone else built your site, you can send them a developer link with time estimates, or ask us to fix it for you.

Check your Shopify site

Scan a page for free. No card needed.

Scan my siteSee an example report

Shopify is a trademark of its owner. Alleviator isn't made or endorsed by Shopify.