I set out to test a few components from the design system I was working on. These components were designed and developed with accessibility in mind, but I had usability concerns nonetheless. The testing was conducted by a user research firm with participants who had varying levels of blindness. Here’s what I learned:
Clear Titles Help Navigation
Users appreciated having clear, descriptive titles to help them quickly find sections of a webpage. Titles are even more useful when written concisely and in proper order. Assistive technology users often navigate through pages by jumping between titles, so making sure titles are relevant and follow a logical structure is key.
Focus Management Is Important
Effective focus management ensures users stay oriented without assumptions about what they want to do next. For example, when a user clicks a button to open a modal window, the focus should move directly to the modal. This allows the user to interact with the new content. Background content must remain inaccessible until the modal is closed. Once the user closes the modal, the focus should return to the button that triggered it.
For sequential dynamic content, like a quiz or multi-step form, focus acts as a guide. It should flow logically and help users navigate from one step to the next. In addition to native focus transitions in form controls, the focus should move from a “Next” button to the title of the following section. This allows assistive technologies to read the new title, giving users context about where they are.
Add Instructions (When Necessary)
Some components are complex and may require additional instructions to help users navigate them. Adding brief instructions within the component can help, especially for dynamic content with multiple steps. However, navigation should always be as intuitive as possible—users may overlook instructions.
Keep it simple
Simplicity makes the experience easier for everyone.
- Avoid placing links within paragraphs, as they interrupt the reading flow for screen reader users. Instead, list relevant links after the paragraph.
- Minimize the use of tooltips. They require extra effort to find and access. Adding notes with extra information after a section is often more useful.
Consider Mobile and Desktop Differences
Components can behave differently on mobile and desktop devices. Blind users usually navigate mobile devices using touch gestures, while desktop navigation relies on keyboard shortcuts. For example:
- On desktop, users tab into a group of radio buttons and use arrow keys to choose an option.
- On mobile, users swipe through the options and double-tap to select.
These differences should be taken into account when designing components to ensure an optimal layout for each device.
Consistency Builds Trust
Consistency is one of the most important principles of accessible design. When navigation menus, forms, and other components behave consistently across a site, users can learn how the website works and predict what will happen next. This reduces cognitive load and makes the experience more seamless and inclusive. Consistency ultimately builds trust and improves usability.
Understand Assistive Technology Basics
User researchers don’t need to be experts in assistive technology, but they should understand the basics. This includes knowing how screen readers convey information and how shortcuts or accessibility APIs function. Having this knowledge enables researchers to better interpret the data collected and provide more accurate, actionable recommendations.
Conclusion
User testing is essential for improving experiences for all users. It helps you learn what works well and what needs to be fixed. At its best, user testing validates your efforts. At its worst, it provides valuable insights to help you improve—either way, it’s always worth doing.