Be Inclusive!
Just my thoughts and ramblings on some great places to start with inclusive design.
The term is one that I’ve seen some debate over. So, just to start it off let’s use this definition.
Inclusive design is design that considers the full range of human diversity with respect to ability, language, culture, gender, age, and other forms of human difference. (Inclusive Design Research Centre)
In less formal terms, inclusive design is design that recognizes that people who use, view, or in some other way consume our design work have different abilities. They come from different cultures, speak a variety of languages, and identify in different ways. We, as humans, have many differences. As designers, we must recognize and design for those amazing differences. “You are not the user”, really applies here.
The above does not suggest that it is always possible (or appropriate) to design one single product for the needs of the entire population of the world. On the other hand, it does mean we design for the widest possible coverage of people while ensuring we have a clearly defined target audience.
Accessibility
When we discuss inclusive design, most people typically jump to accessibility. Although, as we will see, it is not the only aspect of inclusive design, accessibility is very important. Accessibility, in general, is the practice of making our digital work — that is, our websites, apps, etc. — usable for as many people as possible. This includes people with various disabilities, including people with cognitive, visual, auditory, or motor skill impairments. However, there are also others to be considered.
There are a number of ways to achieve accessibility, and they can be broken down into the technical side of our work and the design side of our work. On the technical side, achieving accessibility might entail using appropriate alt attributes on image or video tags in HTML, or using semantic HTML tags. These items allow a screen reader, which is a software tool that is often used by people living with visual impairment, to have text on the interface read to them. While such technical aspects are interesting I want to focus on the visual aspects
The W3C is a standards group has provided standards for achieving accessible design. (https://www.w3.org/standards/webdesign/accessibility). In their effort they have created the WCAG (Web Content Accessiblity Guidelines) https://www.w3.org/WAI/standards-guidelines/wcag/ . One of my favorite parts of their work is the “How to Meet WCAG (Quickref Refernce). Check it out. https://www.w3.org/WAI/WCAG21/quickref/
I personally believe all designers should read through this quick reference and try to apply the principles to their interfaces. Try to meet conformance level AA at least :). I could talk about accessibility forever so I’ll move onto other aspects of inclusive design but a tiny few tips
- Have appropriate color contrast between background colors and foreground text colors
- If you have anything that auto plays on your interface (video, etc) make sure the user has a way to pause
- Provide text alternatives for image based content that is not decorative
Inclusive Images and Graphics
When we choose/create images or graphics to be used in our interfaces, we should reflect deeply so that we can work toward a design that everyone feels part of. This is especially true for images and graphics that represent people. Using a graphic like the one below to represent a user is an inclusive fail.
It is very likely representative of only one type of many possible users. So again, think deeply about your target audience and how you might address the widest portion of people in that audience. Two concepts that can help you achieve this are abstracting and diversifying.
Abstracting
Abstracting is making image choices that, as much as possible, depart from detailed representations, of people. Instead, we create or make choices in imagery and graphics that any user can feel represents them, no matter their background, gender, identity or ability.
I found this great example on Career Foundry (https://careerfoundry.com/en/blog/ux-design/beginners-guide-inclusive-design/) from the company Lemonade. I’m going to use this example too because its just too good.
The choice of toothbrushes to represent people totally departs from a detailed representation that could be answers for the question presented. While also being a metaphor that is universal to the Lemonade target audience.
Diversifying
Diversifying is an approach that is almost the opposite of abstracting. With diversifying we are attempting to represent a wide variety of differences that a user may identify with. Diversifying is often seen in illustrations or photography.
Build it in!
A design organization needs to incorporate inclusive design as a philosophy from the start. By engraining into the culture of the organization it doesn’t become an after thought or add on, that is likely to be forgotten. We did this at my current employer and it has taken hold througout every phase of the design process.
More Resources
I barely scratched the surface of inclusive design and didn’t discuss items like inclusive copy. So I highly recommend reading more on inclusive topic. Here are a few articles and resources that I’ve found useful.
