Accessibility can be defined as the ability to access and benefit from a system. Accessibility seeks to enable access and provide accommodation for people with disabilities through technology and design.
While there are some laws in place to enforce accessibility within the public sphere, many fields tend to avoid the concept altogether unless they are required to acknowledge it. This is because it can sometimes be faster to avoid taking the extra steps required to provide accessibility.
The benefits of accessibility are often overlooked by those who are not directly affected. While this concept has still improved greatly as time has passed, there is still a lack of cultural awareness of the exclusion of disabled individuals from many different sectors and fields. This article is going to discuss the concept of accessibility in the field of design.
The following examples will discuss and display multiple accessible design patterns and principles.
Colour blindness tends to be common in the general population. So why is colour contrast an afterthought? Even when using a monochrome colour palette, the user should still be able to understand the positive and negative values on the page. When looking at this pop-up message, can you still see the contrast?
Text sizing may seem mundane but can make a world of difference for visually impaired users. Which of these font sizes would you expect to be a header on a webpage? What size would you expect the body text to be?
A chart displaying multiple text sizes in the same font. There are two sections: one with text type size (smaller) and one with display type size (larger)
Icons can be used to tell a story within design but can also assist in being visual aids to visually or cognitively impaired viewers. They can be found within an icon group or on their own. Icons look best on webpages when they are from the same icon group as they provide a sense of consistency. Are there any icons from this assortment that would not go well with each other?
A set of icons (House, clock, calendar, cup, trash) in varying styles.
For individuals who are blind, technology can be adapted to fit their needs. Many designs have incorporated the ability to convert voice to text and braille add-ons. How does this design incorporate technology for the visually impaired?
A public sign with both text and Braille.
Flashy elements can make design inaccessible to photosensitive individuals. While this element may bring a lot of emphasis to your work, it can also create a barrier for individuals negatively impacted by flash. If there are flashy elements or pop-ups within the design, this must be labelled beforehand.
A sign advising photosensitive individuals that strobe lights are present. The sign is very bright to indicate to viewers that they may need to be advised before interacting with the design.
Wording can be a barrier to accessibility. Look at this error message. How long would it take you as a user to understand what is trying to be conveyed? How could it be further simplified?
A complex error message pop-up. The error is not obvious to the user upon first glance.
It can be difficult to navigate a webpage when you are unsure of the order of information. Having a clear visual hierarchy can allow for users to have a better experience with less complexity to sort through.
A diagram of visual hierarchy on a page layout.
Accessible design is easy to spot when you ask yourself the following:
"Who will this benefit, and how?"
We don't often notice accessible design if we are not the target audience. This is where empathy comes into the mix. If you think for a moment about who the design was made for, you can further pinpoint that group's specific needs.
Inaccessible design can be spotted just as easily. When looking at a design you suspect may provide accessibility issues, ask yourself the following:
"Who is unable to benefit from this, and why?"
A sign may be clear to you, but this does not mean you are the only intended audience. Take a closer look and try to determine the limitations of the design. Now that we have listed some of the factors that make design accessible, here is a list of criteria that can be used to determine accessibility
One mistake that designers often make is focusing their efforts on universal design while forgetting entirely about incorporating accessibility within their work.
Universal Design refers to the process of creating and structuring an environment in such a way that it allows for the greatest possible access, comprehension, and utilization by people of all abilities. While accessible design is focused on the specific needs of people with disabilities, Universal Design considers human abilities to exist on a spectrum, with the goal of catering to the needs of the broadest range of individuals possible. Unfortunately, this can result in certain groups with special needs to be overlooked.
Universal design consists of designing for the "average" person. The downside is that the "average" person is not always expected to have special needs. While not every user may have a barrier to accessing information, failing to consider the ones that is a critical mistake in design.
While universal design may sometimes consider the special needs of the few, its primary focus is on the needs of the many. This is not the case with accessible design.
SAP Fiori is designed with accessibility in mind: both at the framework level and the app level. The following are elements within SAP that focus on accessibility.
SAP Fiori's default theme is designed to fulfill the requirements for minimum colour contrast. In addition to this, there are high-contrast themes that can be chosen in the user settings.
One of SAP Fiori's high-contrast themes.
Accessible design is just one piece of a larger design thinking process. Download our full guide below.