You might think that e-commerce platforms like Shopify offer easily accessible websites, but that’s only partially true.
Many moving parts affect web accessibility: the core platform, themes, add-ons, plugins, custom code, and even content authors and editors. By addressing all these parts, a website meets accessibility compliance guidelines.
Accessible Components
Core platform. The default accessibility of most ecommerce platforms is pretty good. No platform is without accessibility weaknesses, but most are working to mitigate them.
Mitigation measures may also include providing alternative solutions. For example: Shopify checkout page There are accessibility barriers, but merchants can simply choose a different version.
theme. E-commerce businesses often introduce themes for non-core styles (colors, fonts) and functionality. This process can introduce accessibility hurdles, so careful thought must be given to how themes are set up, developed, and modified.
Common stumbling blocks include not meeting minimum guidelines for color contrast, font size, and distance between clickable components (especially on mobile). Some themes add forms (newsletter signup, contact us) without labels.
Add-ons and plugins. Nearly all ecommerce sites include customizations to the core platform through add-ons, plugins, and custom code, which can also pose accessibility obstacles.
Automatic checker, etc. Web Accessibility Evaluation Tools While sometimes useful, they are not foolproof, especially when it comes to customizations. For example, a currency conversion add-on or plugin may lack sufficient color contrast that can only be discovered by manually clicking to view it. Keyboard navigation is another common barrier that requires human testing.
Creators and editors. of Very common Barriers to website accessibility are inappropriate image alt text and HTML headings, both of which are generated by authors and editors.
Alternative text may be missing, redundant, or simply not useful. Alternative text for product images requires special attention, including descriptions of visible features that are not included in the text on the page.
HTML headings should be properly nested: there can only be one H1 on a page. An H3 can only be under an H2 or another H3. An H4 can only be under an H3 or another H4, and so on. The font size of the headings doesn’t matter, but the order is important for conveying structure to visually impaired users and to Google.
(Yes, the accessibility components (alt text for images and HTML headings) Search Engine Ranking! )
Training your content team Proper image alt text, HTML headings, etc. are a good start towards improving accessibility.
Who is responsible?
The ultimate responsibility for accessibility lies with the site owner, not the core platform, customizations, developers, or employees, so make sure all stakeholders are aware that work needs to be done to meet accessibility. WCAG 2.2 AA Document your guidelines. And test them.
It is always more cost-effective to address accessibility proactively and continuously, rather than mandating it. Through litigation We worked on immediate improvements across the site, but the bigger problem was revenue: sites that presented barriers to shoppers with disabilities were losing sales.