Accessible by Design

Accessible design is not only a matter of civic-mindedness. It is becoming risky not to take users of all abilities into account. Garrett outlines some simple things we can do to help our apps and website be more accessible to all.

Marino Insights Cover Image

In Ireland alone there are 643,131 disabled people (2016 Census). This accounts for 13.5 percent of the population. Statistics can be cold and impersonal. When we witness somebody's challenges first-hand the importance of designing for accessibility becomes clear.

We recently had the opportunity to meet and work with Róisín Foley. She was diagnosed with motor neurone disease around her 30th birthday. Due to the disease her voice and dexterity were already starting to decline.

“It all started with me experiencing some weakness and sensitivity to cold in my right hand... By the time I was diagnosed my left hand had begun to change also and it looked visibly deformed... I had an idea that I might have had something more serious than arthritis but it was still a shock when the doctor told me I had motor neurone disease.”

Through meeting Róisín and understanding the impact her disease was having on her, and her three small children, the importance of accessibility became visceral.


Graph depicting percentage of disabled persons, 2016

CSO

Accessibility = Inclusivity

Even if you are not part of the statistics above the sad fact is that at some point you will be less able than you are today. As we age our eyesight starts to fade as does our hearing and our mobility. None of us are immune to sickness or injury. Even when completely healthy, situations will arise when we are in some way inhibited. Think about when you are caring for a small child, had a bad night's sleep or are stressed and distracted.

Let's re-frame. We are not just designing for people with disabilities. We are designing for inclusivity. Factors like age, cognitive ability, context, and location should all be considered from the very early stages.

“The power of the Web is in its universality. Access by everyone, regardless of disability, is an essential aspect.”

Tim Berners Lee - W3C Director and inventor of the World Wide Web

Legal risks...

Accessible design is not only a matter of civic-mindedness. It is becoming risky not to take users of all abilities into account. Recently, Dublin Airport was ordered to pay compensation, under the Equal Status Act. This was for discriminating against a deaf man. He missed a flight during Storm Ali due to not being able to hear an announcement. There is also an increasing trend towards litigation for lack of accessibility. There are standards to adhere to but the law is quite fuzzy on the subject. It is a matter of time before accessibility is a mandatory for all.

What designers can do

How do we make sure nobody gets left behind? Let's focus on some quick wins when designing for accessibility. Designers can be the first line of defence when it comes to accessibility. Decisions made early in the process can have a big impact later on. Good design is thoughtful design. Thinking about accessibility from the start is essential.

Be aware of the users and their particular needs

Designers are responsible for understanding the needs of users. When possible, find a diverse group of research participants. Choose people with different views, experiences and needs than you do.

Study the guidelines

Being aware of the guidelines can help to mitigate the risk of inaccessibility. There are some exhaustive resources to draw from.

Writing for Accessibility

Keep in mind the reading level of your users. try to use plain language and avoid over complicating things. You can use a tool like Hemingway to keep an eye on readability. The lower the grade the better. Mailchimp also provides a useful guide to writing for accessibility.

Alternative Text & Time Based Media

Think about how your content will work for those who have visual impairments. Write useful alternative text for every image and every other piece of non-text content. Does your design depend on animation to make sense? If so, make sure there is an alternative way to make sense of what's going on.

Contrast

Propper contrast is one of the easiest ways to improve accessibility. Add enough contrast to easily differentiate between the foreground and the background. We use "A11y Colour Contrast Checker" for Figma to check contrast. It also allows you to tweak colours to achieve AA or AAA compliance.

Checking and modifying colour contrast.
Checking and modifying colour contrast with A11y Colour Contrast Checker plugin for Figma


Colour

4.5% of the population are colourblind. It is important to avoid using color alone to make critical information understandable. There are some great tools that help designers see things as a colourblind person will. Run your screens through Stark and see how colours appear to colourblind people.


Colourblind simulation
Colourblind Simulation Plugin for Figma

Touch Areas  Targets

Fitts's Law states "...the time to acquire a target is a function of the distance to and size of the target". The bigger a target is the easier it is to touch. Make sure touch targets are big enough and have enough space between them to allow those with limited movement to comfortably hit the target. At the minimum, refer to the platform guidelines.

Font Size

The various platforms have their own ways of letting users customise font sizes. As a rule of thumb text should be allowed to scale up to 200% it's original size. Try increasing the text you are using to 200%. Is it still usable? Try using accessibility tools on your device to spend some time living with larger font sizes.


Resizing text


Use the "One thumb, one eyeball" test

This one is for mobile experiences. The one thumb, one eyeball test helps you to learn if your design is easy to use with one hand and partially distracted attention. Create a prototype. View it through a mobile device. Ask yourself "can users perform a certain number of tasks with just one hand in under 60 seconds?"

Conclusion

There are many things to be aware of when designing experiences for users of all abilities. I have highlighted just some of the quick-wins that contribute to accessible design. Regulation is becoming more important but this is not just a compliance issue. It is a civil rights issue. Good accessibility practise is good for everybody. Thinking about accessibility early can solve problems before they arise. Following best practices can mean that no extra features are needed.


!@THEqQUICKbBROWNfFXjJMPSvVLAZYDGgkyz&[%r{\"}mosx,4>6]|?'while(putc 3_0-~$.+=9/2^5;)<18*7and:`#

Let’s chat!

We’re ready to start the conversation however best suits you - on the phone at +353 (0)1 833 7392 or by email

Get in touch