Many of us designers already know something about accessibility – it’s coming into our work like responsiveness or usability did. There are many ways to describe accessibility, but for me it is first and foremost about promoting equality and making sure that anyone, regardless of their background or limitations, can use digital services. That, if anything, is important in our digitalising society – we need to make sure that everyone keeps up with progress.
In this article, I will explore some of the aspects that are good to consider in the work of designers, both at a higher level and in their day-to-day work.
Understanding people and their differences
More than one million Finns have difficulties using digital services for a variety of reasons according to Regional State Administrative Agency. This may be because of the complexity of digital services or because the design of digital services has not considered the impact of different constraints: for example, how can someone who needs a screen reader get information about the service?
I think the key to accessibility is knowing people. What I mean is that the designer knows how diverse a group of people are, with their backgrounds and constraints. To design for accessibility, you have to put aside your own prejudices and your own background: you must be able to step into someone else’s shoes and understand things from their own perspective.
For me, one eye-opening conversation was with a blind entrepreneur. He had started in the 80s and was unable to manage his finances himself, for example, and had to rely on customers for receipts. As technology developed, he was supported by technology, but nowadays digital services are so complex that he says it’s back to the 80s. Digital services that are too complex and inaccessible are only useful to a limited number of people. If the service does not work for all users, the question is whether the service can be considered functional or ready.
I recommend that you find out what different tools exist for using digital services and how they are most commonly used. For example, this material by WebAIM is a good start. Here again, you don’t need to know everything straight away, but it is enough to have an understanding. In many cases, the designer can use a mouse. What does a user who can only use a keyboard do? What does the service look like to a user who cannot see properly? What will the service look like for a user who is dyslexic or whose first language is not Finnish?
Understanding the impact of the design
Certain things are repeated from one plan to another. The choice of fonts, the colours used, the general style of the different components and what is in the navigation, to name a few. These things alone have a significant impact on accessibility and how easy it is to use the service in general. For example, if the fonts are not legible or the colours do not provide sufficient contrast, it is difficult to understand the content of the service. If the style of the components does not support the function they perform, the service is illogical to use.
It is therefore worthwhile for every designer to look at how their design can support each user and not focus too much on a visually beautiful design. It is also worth bearing in mind that the design to be achieved can be beautiful and that these things are not mutually exclusive.
A list to support your work and concrete tips
Supporting accessibility is the responsibility of every designer. I think it is important for everyone to be able to monitor and check the results of their own work. The list below has key points to consider when designing. In addition, I will give some concrete tips to consider when designing, for example in Figma. Considering accessibility is not just the responsibility of individual experts, but it is more of a collaborative effort where each expert has a role to play and therefore collaboration between designers and developers is critical.
As a minimum, consider the following in your plans:
- Make sure you use buttons and links in the right places. Is something changing in the user interface (use button) or is the user moving to a whole new interface (use link).
- Is the font legible? Check line spacing and font size.
- Maintain a logical header order, as this not only helps to properly organise the content, but also helps screen readers, for example. Use only one heading 1 followed by heading 2 and 3 and so on.
- Make sure there is enough contrast in the colour combination. The contrast ratio should be at least 4.5:1 and 3:1 for large texts. Try for example Figma’s Stark plugin or Colour Contrast Checker in web.
- Don’t convey information by colour alone. For example, make sure that links stand out in another way.
- How are errors reported to the user? Make sure that the user is instructed how to correct errors and that the error correction is linked to the correct component.
- Do your designs remain similar or does the layout change frequently across pages? Favour similarity and simplicity to minimise the learning curve and support users.
These things don’t cover everything about accessibility, but they go a long way. Agree a project policy on how you will mark things up in the design. Fortunately, you don’t have to start from scratch; many people have already struggled with these issues. It’s worth taking a look at the Accessibility Annotation Kit from Figma, for example, to get you started.
Finally, I want to encourage you to make accessibility a part of your everyday work step by step. We IT professionals have a responsibility for the kind of society our digitalising society will be. Together, let’s make sure that everyone keeps up and that our services are truly accessible and functional to all.
Read also: We need to design for all senses