Inclusive Design: More love, more humans 19 October , 2018

In July, HoneyKome was the proud sponsor of the monthly UX Masterclass meetup which was held at our Cape Town offices. Steve Barnett & Nicola du Toit are no strangers to Web Accessibility and run regular workshops on Inclusive Design at conferences, companies, and public meetups. Even though the workshops are tailored for a full day they condensed the content to a bite-size meetup portion for the UX community. Since Inclusive Design is important to create truly usable digital products, we would like to share the core thoughts of this meetup.

What is Inclusive Design?
Inclusive Design focuses on the diversity of people, and how to create an environment that’s accessible to all people irrespective of their limitations.

When we talk about environment, this can refer to physical spaces like work environments, shops, and streets, it can refer to physical products like a can opener or water tap, or it can refer to digital spaces like websites and mobile apps. Since each of us is a unique human being, we have a set of strengths and we also have some limitations. These limitations should not be the sole reason for any of us to be denied access to any environment, right?

However, these limitations are usually seen as having a disability such as blindness, deafness, and immobility. This is a huge misperception. Limitations or disabilities as we often call them, are not only a permanent restriction of a person’s capabilities but can be temporary or contextual as well.

Disability is a spectrum, not a binary.

For example, a person can be born blind which is a permanent limitation, or a person might have eye surgery which is only a temporary limitation. Old age is often accompanied with a decreased vision which is also a permanent limitation that only surfaces later in life. On the other hand, daily factors like stress and tiredness are factors that can negatively impact sight for any age group which is contextual. Even lighting at a specific time of the day or season, indoors or outdoors, or in a moving vehicle like a bus can impact how people interact with a website or mobile app. This is also contextual. Thus our limitations as humans is a spectrum, not a binary. We need to create digital products that cater to the diversity of our users. This is true usability.

We rarely include accessibility when designing digital products. Mostly because of the belief that designing for people with disabilities are costly and the percentage of people who fall into these segments are not enough to justify the time and effort to design or develop. This, however, is not true. Here are some myths that need busting:

#Myth 1: People with disabilities are not our target market
As we’ve already discussed, disability is a spectrum and not a binary and can be permanent, temporary or contextual. This means anyone can fall into this segment.

#Myth 2: Inclusive Design is boring to do
Being able to create a digital product that’s used by more users is anything but boring! As designers and developers, we pride ourselves in creating the best possible design, piece of code, feature or product.

#Myth 3: Inclusive Design is too difficult (or time consuming or expensive) to do
No one is an expert at something during the first try, or even the 10th try. Although it gets easier with time. What type of skill have you learned in the past year or even 5-10 years? New programming language? Surfing? Playing an instrument? None of these are easy in the beginning.

Now that we’ve busted the myths on Inclusive Design, let’s look at how to easy it is to start including it in your daily tasks as a designer or developer when creating digital products. The key is to start with small, easily implemented changes - don’t get overwhelmed and try to tick all the boxes.

1. Physical limitations: The absence of a mouse or trackpad
People with physical impairments use a keyboard instead of a mouse as it doesn’t require precise movements. This can include people who are wheelchair bound, or a person who broke their arm or even a person whose trackpad on their laptop is broken and they do not have the finances to replace the laptop at the current time.

What you can do to experience this to understand this type of user
Only use your keyboard to browse a website. Use Tab and Shift + Tab to navigate forwards and backwards on the page.

Things to look out for
Can you see where you are on the page? Can you interact with every element on the page? Can you use functionality (like tooltips) that you usually see on a hover action?

One easy thing you can do to improve the experience
Use HTML elements like buttons and href links instead of divs and spans. These automatically receive focus when browsing with the keyboard.

2. Visual limitations: Sufficient colour contrast
People with visual disabilities need information that has sufficient colour contrast and information that isn’t represented only in colour. People who are colour blind can only see certain colours, which means if the contrast is not high enough between the elements they won’t be able to recognise them. Also, keep in mind if there’s important information that’s highlighted with colour only, for example red, a person who has red-green colour blindness won’t see this at all.

What you can do to experience this to understand this type of user
Download any of the free tools (like Sim Daltonism) to use with your design to simulate the different types of colour blindness which can help you guide your design in the right direction. Or you can upload an image or screenshot to the Coblis simulator to see what your design will look like.

Things to look out for
Are all the elements still visible and the text readable?

One easy thing you can do to improve the experience
Make sure text has a good foreground to background contrast. This is measured in A, AA & AAA compliance with The Web Content Accessibility Guidelines (WCAG 2.1). A is limited compliance, AA is a higher compliance and AAA is excellent compliance. This all might seem quite daunting but it’s much easier than what it sounds like. Have a look at WebAIM’s contrast checker to see how easy it really is.

3. Cognitive limitations: Keep language simple
Often a lot of people have a different home language than the one your content is written in. Also, people with cognitive difficulties such as Autism, Aspergers, ADHD, etc. struggle with long or complex content.

What you can do to experience this to understand this type of user
Copy and paste your content into Hemingway or a similar application that analyses grammar to see which of the sentences are overly complicated or confusing.

Things to look out for
Is all the content written in clear language and is it suitable for a lower literacy level?

One easy thing you can do to improve the experience
Keep the content simple by using headings and bullet points, also avoid jargon and overly technical terms. Images are a great way to break up content or to provide alternatives to text-heavy information.

By changing our mindsets around our users and their limitations, be it permanent, temporary or contextual, we can cater to our users’ diversity and create truly user-friendly digital products.

Subscribe to