At our company, we pride ourselves on our expertise in digital accessibility. Yet, we've faced the classic dilemma encapsulated by the phrase "the shoemaker’s children go barefoot." Despite advising others on best practices, our own website has not exemplified these standards. This is a walkthrough of our shortcomings and the steps we've taken to amend them, ensuring our digital presence is accessible to everyone.
Step 1: identifying our shortcomings
Despite our role as accessibility consultants, several issues plagued our company's website:
Inconsistent keyboard navigation: users navigating via keyboard or other assistive devices encountered a chaotic experience due to poorly sequenced interactive elements
Inadequate focus visibility: visible focus is essential for users to track their location on the page, but it was often unclear or completely missing
Poor scalability of components: text resizing did not consistently alter all components, leading to overlapping elements or unreadable text
Illogical tab order: the sequence of focusable elements was non-intuitive, leading to confusion and inefficient navigation
Menu accessibility: our menu did not retain focus once opened, nor did it allow users to close it easily using the ESC key
No skip link: a significant oversight was the absence of a skip link – a fundamental tool for accessibility
The importance of a skip link
A skip link is a crucial tool for improving website navigation. It allows users who navigate using a screen reader or keyboard to bypass repetitive content like menus and headers. This allows them to jump directly to the main content and other key sections, which not only expedites navigation but also reduces the effort required to access primary content, thus making the website more inclusive.
Step 2: implementing necessary fixes
Determined to align our digital practice with our professional advocacy, we've made several improvements:
Correct order of tab items: we revised the sequence of interactive items to ensure that keyboard navigation is logical and smooth
Enhanced focus indicators: we improved the visibility of focus indicators across our website to help users easily identify which element is active
Advanced skip link: we implemented a skip link that jumps to the main content and offers options to skip to other significant sections of the site (we actively measure the usage of this feature to assess its effectiveness and utility based on user our visitors' behavior)
Improved modal handling: our modal dialogs now correctly maintains focus and can be toggled and closed using common keyboard shortcuts, which enhances usability for everyone
Step 3: committing to continuous improvement
While our website has seen many improvements, our work is not done. We're not perfect, but we're committed to keeping improving and making sure that everyone can access and navigate our web. We've learned some valuable lessons along the way – here are our best recommendations for anyone seeking to improve web accessibility.
Audit regularly
Accessibility is an ongoing commitment that requires regular audits to ensure that all users can effectively access and navigate our services.
Engage and measure user feedback
The true test of accessibility efforts lies in user satisfaction. Regularly seeking and integrating feedback from users, particularly those who rely on assistive technologies, helps us refine and validate the effectiveness of our solutions.
Practice what we preach
We must embody the best practices we advocate. This commitment to practicing what we preach helps us serve as a credible authority in accessibility.
Prioritize accessibility
Making accessibility a cornerstone of our digital strategy is non-negotiable. It ensures that our services are inclusive and that we lead by example in the accessibility community.
Addressing these issues improves our website and reaffirms our commitment to making the digital world accessible to everyone. We are continuing our journey towards an accessible digital space, and we embrace transparency and accountability every step of the way. If you have any questions or concerns, don't hesitate to reach out!
