Luke Matthews, Senior UX Designer, Icon Agency
You learn something new every day. A cliché, sure, but it continuously rings true – especially in the space of design.
I recently spoke with Scott Nixon, an accessibility consultant who is vision impaired, with the objective of gaining insights from someone who uses a screen reader. The biggest takeaway from our conversation? Keep talking to your users. Whilst we may think we know the fundamentals of design based on previous experience and best practice, there is always something new to learn and it is always important to consider the needs of the people who are going to be actively using your site. Scott helped to break down the elements of design that can help designers create optimally accessible websites for people who are vision impaired. Here are the top tips:
Keep it simple
How many times have you heard a designer say “less is more”? Keeping on theme with the clichés, our conversation reiterated that sometimes simple is best. For best accessibility, work out what really needs to be on a webpage and get rid of the clutter. Clarity is key, so evaluate and edit so that only the necessary information is there. In doing so, you’re going to reduce the chance of people becoming overwhelmed. Chances are your designs will also be calmer, easier to digest and more beautiful.
Good image descriptions are key
Being concise is a skill that can be difficult when it comes to writing image descriptions for screen readers. The most important takeaway from Scott was that descriptions should provide enough detail for the user to understand what the image is, but not too much that will take the screen reader too long to read. It’s tricky, but our main focus when writing should be striking the balance between detail and conciseness that allows for a comprehensive description.
Make navigation a breeze
Nobody likes jumping through hoops to try and find what they’re looking for on a website. Scott gave a simple breakdown for designers when considering accessibility in website menu navigation:
- If the menu has dropdown or expandable lists, ensure that screen readers can easily enter and exit the lists.
- If the menu has form fields (such as a search field), make them easy to enter, input and exit.
- If the menu has a button, give it a label that describes what happens if you click on the button.
Scott stressed the importance of ensuring screen reader compatibility and smooth menu navigation across different devices. By collaborating closely with developers, we can optimise navigation features to enhance accessibility without sacrificing functionality.
Video and audio autoplay
I recently designed a homepage with a large, full-screen video playing in the top banner. While these features can be attention-grabbing and give an exciting first impression, my discussion with Scott made me consider how this might be improved for better accessibility. Our conversation highlighted that it may be a better option to have a play button on the video, so that users can choose whether they want to play it or not. Automatic video-play can potentially be distracting and overwhelming for people with vision impairments. As for automatic audio-play? That’s a hard no. Keep it muted with the option for sound, otherwise it is overwhelming and annoying.
Consider your users
It’s important to note that throughout our discussion, Scott highlighted to me that whilst he may have certain preferences for how a website is designed – someone else may have the opposite viewpoint. As designers (try as we might), we can’t please everyone. For example, people with low vision may prefer a high level of contrast between text and background colours. However, some high contrast colour combinations can be jarring and cause discomfort for others. People who were born without sight may not consider colour important at all.
As a designer this can make things a bit harder to cater for, but we can do our due diligence in testing with a wide range of users to gain insights and do our best to make the site as accessible as possible. We can also check colour contrast ratios and write them into our design guidelines. As long as we continue to speak to users and hear how they experience the website firsthand, we can endeavour to design to reflect this.
My discussion with Scott reinforced the age-old message that knowledge is power. Continuing to engage with people and learn about what they want from a website experience is invaluable in creating accessible and refined designs that benefit every user.