Tips on making your online store easy to navigate for all visitors.

To help your visitors better navigate your online store, it’s important to incorporate accessibility features when designing your commerce site. Doing so not only promotes inclusivity, but also broadens your audience. Use this guide to review design elements you may want to consider, and resources on how to make your Commerce site more accessible.

Note: This guide is a resource, but it’s not legal advice. Squarespace doesn’t give advice on specific accessibility laws or standards applicable to your site or business, as stated in our Terms of Service.

Product images

Spacing and size

All of your product item featured images are laid out in a grid on your store page. To make your store more accessible for visitors with visual impairments, you may want to consider the spacing of your images. You can increase the padding and, by changing the number of columns, the size of the images in the store section styles.

Add alt text to your product images

If you sell physical products, it’s important to provide descriptive text (alt text) for your product images. Alt text can help visitors who use a screen reader to navigate your site. Or visitors who can’t access images due to various reasons, such as a slow network. When scanning a page, screen readers identify images and read the alt text to visitors. Use short terms that describe the specific image and the product. You may want to consider including the following information in your alt text:

• Color of the product - This text may be the only way a visitor can determine what color item they are purchasing.
• Words and descriptions of images and where they’re located on the product - If there are words or images printed on your product, a screen reader won’t read or describe these to the visitor.

Enabling image zoom

Consider enabling image zoom to assist visitors with vision impairments. When enabled, visitors can enlarge product images for a closer look at material, texture, and finer details. To learn more about this feature, visit Store page special features.

Additional product information

You can add custom content to a product page by adding blocks in the Additional Info section of the product editor. You may consider adding things like:

• Package dimensions and weight, so customers can better plan for their delivery.
• Videos of your product with captions.
• A size chart if you sell clothing. Size charts are typically not read by screen readers. To learn more about creating a screen reader-friendly, text-based size chart, review third party services such as Kiwi Sizing.

Note: For all questions regarding third-party services, contact the third-party provider directly.

The checkout process

Call to action buttons

It’s vital that your customers can access Commerce interactive elements, such as the Add to cart and Continue shopping buttons. To help with this, you can style your buttons to draw more attention to them. You can do so by changing the shape, outline thickness, and other formatting options.

Shopping cart icon

Although it’s not possible to adjust the size of the shopping cart icon, you can make it more accessible by adding a border, and ensuring the color contrast is adequate.

If you sell one product, and want to bypass the shopping cart process, you can enable express checkout. With express checkout, you can style a Purchase button so that it’s noticeable, and more accessible.

Audio considerations

If you have audio content on your site, you can add transcripts. Doing so will make your content more accessible to visitors who are hard of hearing, and is also good for SEO. To keep your pages organized, you may want to include transcripts on Not linked pages.

Language

When describing and promoting your product or services, it’s important to use accessible language. To learn more about how to write effectively and with accessibility in mind, visit Improving site accessibility with inclusive design.