Despite being blind, I enjoy taking on various DIY projects such as woodworking and minor around-the-house repairs. I regularly browse and purchase from hardware store websites—on which I experience several common ecommerce accessibility issues—and from different ecommerce websites and apps.
If you manage web accessibility for an ecommerce platform, keep reading to explore several methods for improving digital accessibility for your customers. As always, I am writing about my experience as a blind person who relies on a screen reader to navigate the web.
Why Accessible Search Result Filters are Important for Ecommerce Accessibility
Search result filters are a handy feature on all ecommerce websites. Unfortunately, a lot can go wrong with search filters. In most cases, locating and activating the "filter" button with my screen reader is relatively easy. However, sufficient ecommerce ADA compliance in other areas is lacking.
The problems begin once the filter menu opens. Below are a few things that can go wrong for screen reader users once the filter menu opens:
- I cannot select any of the checkboxes to activate the necessary filter.
- Moving the screen reader cursor around using the arrow keys rarely works and the navigation does not perform better using touch on mobile devices.
- I can select the filters, but my screen reader can't locate the "apply filters" button.
- The main webpage bleeds through the filter menu overlay, causing the screen reader to announce text from both the menu and the main page together—which is pretty confusing.
If I am searching on a hardware site for a specific kind of screw for a project, it can take hours to manually sift through thousands of results without the ability to filter by size, thread type, head design, or any other relevant search criteria. This oversight makes the search filters on your website inaccessible, dramatically reducing your ecommerce website's usability.
Your Blind Customers Want the Same Product Details
I also shop and browse hardware store ecommerce sites for cabinet hinges. In that case, I must know if the hinges are surface or recessed mounted, as this significantly affects the door preparation process.
Most product listing pages on hardware sites have a section marked "installation details," where customers can find specifics such as mounting styles. The problem is that this installation data is almost always displayed using only pictures. A hardware store's ecommerce website will often feature an image showing the hinge screwed into the back side of the door for a surface mount door hinge.
Relying solely on images to present product information on a website makes that information virtually inaccessible to your blind customers. Customers like me who rely on screen readers need a detailed text description of what information the image conveys for optimum ecommerce accessibility.
Ecommerce Accessibility and the Brick-and-Mortar to Mobile Experience
The following section applies only to mobile applications, which I and many others regularly use as mobile online shopping grows in popularity.
In some retail sectors, such as hardware, the physical store is still an integral part of the shopping experience. Sometimes touch is the best way to determine a product's build quality, fit, and finish. Most hardware store web developers have incorporated and applied useful in-store shopping features into mobile applications and websites. Unfortunately, most of these nifty features have ecommerce accessibility flaws.
For example, in-store shoppers utilize product locator maps to point them to a product's exact aisle and bay. If these in-store product locator maps are image-based, they do not typically work with screen readers. Often these visual maps show the store's physical layout in relation to the user's mobile device and the desired product's location.
An alternative text-based product locator would present the aisle and bay in plain text and provide an auditory walking navigation solution such as spoken turn-by-turn directions. Without verbal directions to the relevant product, this experience is entirely unavailable to me as a blind customer.
5 Lessons for Improving Accessibility on Your Ecommerce Websites
- Streamline search features: Ensure that the search result filtering experience is fully accessible to assistive technology users. Item filtering is vital on certain Ecommerce websites due to the complexity of product offerings.
- Provide detailed image descriptions: Ensure crucial image-based details are available in plain text for screen reader users.
- Optimize all pages for mobile: Verify that the mobile application follows accessibility standards to the same degree as the main website.
- Be inclusive: Remember to pay attention to diverse customer bases, because people of all ability levels want to shop from you.
- Recruit the experts: If you want help with digital accessibility, consider engaging an external partner to guide you.
I hope this sheds some light on the importance of web accessibility and ecommerce ada compliance. Even in retail sectors such as hardware, where you might not think of a blind person as your typical customer, people with disabilities want to use your website and mobile apps.
Up to one in four adults in the US have a disability, and we want all the same digital capabilities as our peers. Prioritizing digital accessibility is the best way to ensure a positive user experience for everyone who visits your ecommerce website.
