Accessibility Design Guidelines For Inclusivity

User-centric, clear, and coherent design are some of the most important features your web and mobile applications should offer and so is the accessibility in user interface design. Designing for accessibility enables users with disabilities such as visual or hearing impairments to seamlessly understand, engage and navigate through the website. Therefore, every designer should learn about the significance of accessibility design guidelines. 

What is Accessibility?

According to Interaction-design.org, Accessibility is the concept of whether a product or service can be used by everyone—however, they encounter it. Although there are accessibility rules to help persons with disabilities, designers should nonetheless make an effort to accommodate all possible users in various settings. Better designs for everyone are among the clear advantages of doing so.

Why Accessibility Matters?

Let’s take color blindness, for example. According to color-blind awareness, almost 4.5% of the population is color-blind. Meaning it affects around 1 in 12 men and 1 in 200 women worldwide. People affected with this color vision deficiency or CVD can see things clearly just like the rest of us but are unable to distinguish red, green, or blue light, per se. They either don’t see colors clearly or it keeps getting all mixed up. 

Oftentimes designers ignore to even consider designing for such a small group. However colorblind users are also entitled to good design practices like any other human being. So if your website design does not equally appeal to everyone, then it's probably no good and you are clearly paying no heed to the idea of ‘inclusivity’. Now, how to ensure that your design is adhering to accessibility design guidelines? 

Recommended: Creativity on the Rise: The Importance of UI/UX Design

Designing for Accessibility: Top Things to Consider 

Empathy development and the adoption of an inclusive design philosophy are the first and most important steps in creating an accessible product. - says Avinash Kaur, A London-based UX/UI designer in her article: Accessibility design guidelines for UX designers.

Use Bright Color Contrasts

Color contrasts are important for people with low vision, as it enhances their readability ratio. People with visual impairments have decreased sensitivity to certain colors and contrast. According to the World Health Org. (According to the World Health Organisation (WHO), 217 million individuals have moderate to severe vision impairment. So every element on your website should be easily distinguishable from the others.

Be smart about your color contrast choices, use bright colors in place of dull to highlight useful information such as CTA buttons. But try not to rely on color alone because it would make it difficult for people with low visual acuity to understand. Using bright-colored, heavily contrasted bold typefaces can help people with visual disabilities to pick up on meaningful information. You can use the Stark plugin for Sketch to test colors to make sure they have the proper contrast ratio for readability.

One way is to tweak your text placement. You can place light elements against dark backgrounds to make them really pop out. Trello’s color blind-friendly mode is one of the great accessibility design examples. Enable/disable color blind friendly mode on Trello for alternating colors to help those with color blindness to differentiate the labels.

Don’t Crowd Your Interface 

Another important aspect of accessible design is to steer clear of overcrowded websites. Rather than just throwing the content on the webpage, better to break it down into sections with bulleted lists separated by headings. The use of a simple English language is a plus.

People like to skim big blocks of material, whether they are reading or listening to it, thus it is crucial to structure your long-form work using headers, brief paragraphs, and other content design best practices.’, suggests the book on design: Writing is designing. 

Companies want to make sure users understand the nitty-gritty about their products, which makes it easier for them to sell. Writing is Designing all about how you can smartly ‘present’ the never-ending details about your products and how you can better write for accessibility such as clarity, the importance of structured messages, and testing the effectiveness of the words.

You can magnify important items on screen for visually impaired people which would make your content easily scannable. All in all, pay close attention to how the visual elements on your websites are positioned or placed. 

Design Focus Indicators 

Focus indicators are visual cues such as underlined content. The line automatically shifts itself to the word you click just as shown on this website.

They facilitate users in navigating through the website and tell them which word is in focus. Focus indicators are mostly useful for people with limited mobility or who are suffering from carpal tunnel - a condition that causes numbness, tingling, or weakness in the affectee's hand.

You can build focus indicators according to your brand’s accessibility design guidelines but make sure that useful links, form fields, widgets, buttons, and menu items have them since they are the most important features.

Use Instructions with the Forms

The most common features on websites are forms such as contact us, registration, login, feedback, purchasing, etc. Therefore, the importance of creating accessible forms is evident. Every form has the same concept: a couple of text fields followed by a button to perform the action. But when it’s about designing for accessibility, the form should be simple and short.

Forms can be visually complex to use specifically for people with disabilities such as cognitive, people using screen readers, with limited dexterity, etc.  Therefore, only ask what is required and get rid of the information if it's just optional. Apart from using placeholder text, provide instructions to help users understand how to complete the form. Additionally, if the form is long, divide it into smaller sections and most importantly notify them about the successful completion.

Accessibility Design Standards

The World Wide Online Consortium (W3C) is dedicated to maximizing the usability of the online for everyone, including those with impairments. A project of the W3C is the Web Accessibility Initiative (WAI).

WAI develops its work through W3C’s consensus-based process, involving different stakeholders in web accessibility. These include industry, disability organizations, government, accessibility research organizations, and more.

For more information, read WAI's tip on designing for accessibility.