Shopping, communicating, banking, even adopting a pet or finding a dinner recipe. We live so much of our day to day lives online. Imagine what it would be like if you weren’t able to easily access the digital world. For many people this is a reality, and it’s exactly what is addressed with the most common inclusive design principles.
Designing for accessibility and inclusion focuses on the diversity of experience which may exclude a person from effectively using a digital interface. Both inclusive design and accessibility practices ensure that websites and apps work just as well for those with disabilities or other limiting circumstances as those without.
Accessible vs. Inclusive – What’s the Difference?
Accessible design focuses on the outcome of a project, specifically meeting accessibility guidelines set forth by governing bodies. It ensures that those with disabilities can access a website.
While inclusive design is related, it isn’t the same thing. Inclusive design is more of an approach. It’s the process of creating a website which can be used by a wide range of humans, both with and without disabilities. Accessibility is one of the benefits of inclusive design, although focusing solely on accessibility will leave out large sections of the population whose experience would be enhanced by the use of inclusive design principles.
Inclusive Design Principles
What are the principles and practices that support inclusivity? When designing with website inclusion in mind, take the three A’s into consideration. Factors such as access to quality tools, computer literacy, financial means, culture, and language all combine to determine a user’s ability, attitude, and aptitude.
- Ability – physical and cognitive abilities
- Attitude – perception of the digital space, and of your specific website or app
- Aptitude – experience and proficiency with basic internet navigation
What is Inclusive Design?
There are several factors to keep in mind when striving for inclusive design. Tools which help businesses assess their digital inclusivity will often consider the following aspects. Keep in mind that while these aspects have some overlap with accessible design principles, they aren’t always executed with identical intention.
Content Structure
Inclusive UX design structures content in ways that make it more easily understood by users with visual, language, or cognitive deficits. This can be achieved by:
- Breaking up long form text into smaller sections, divided by headings and subheadings.
- Maintaining a minimum level of contrast between colors.
- Using a maximum content width of 80 characters per line.
- Ensuring lines are at least 1.5x the height of the website font.
- Aligning text either right or left. Avoid centering or justifying long-form text.
Content Markup
Regardless of what the website looks like on the screen, you want the backend to reflect an equal level of structure and organization. So, in addition to considering user interface design, consider the back end while creating your website.
For instance, heading tags should be used to indicate the visual structure created by different fonts for headings and subheadings. Using helpful alt text for images has a similar impact.
Images with Text
Don’t place important content within images. This is because screen readers don’t recognize images as text, so therefore don’t scan them for helpful information. Alt text, as mentioned above, can explain what an image looks like, but it doesn’t describe the importance of that graphic. Furthermore, images with text can be very difficult to see as screen size decreases.
Language
Simple, clear wording goes a long way to maintaining an inclusive website. Not only will it benefit those with cognitive or learning disabilities, but also those for whom English is not a first language.
Use inclusive design principles to prevent overcomplicating content for your user:
- Skip jargon. If this isn’t possible, clearly and contextually define terms with which the layperson may be unfamiliar.
- Use acronyms sparingly. If you must use an acronym, use the expanded version first and place the acronym in parentheses afterward. You can use the acronym on its own in subsequent sentences.
- Leverage lists. Bulleted or numbered lists are easier to comprehend than long-form text. Plus, the visual hierarchy created by lists lends itself to the structured content we discussed above.
- Employ images. Create and use images to clarify complex ideas.
- Insist on accuracy. Make sure your content uses proper grammar and avoids slang.
- Remove non-essential words. For instance, “Browse our catalog of products” could be pared down to “Browse products.” This reduces the number of words a user must read and comprehend by more than 50%.
Error Avoidance
First and foremost, you can help users avoid common mistakes by creating clear, concise instructions as well as programming automatic corrections of the most common errors. Beyond that, give the user time to verify input before submission, clearly label errors, and try to display error messages in real time.
Layout
Nearly all inclusive web design principles insist on simplicity, and the layout of your pages is no different. Imagination and creativity should not be prioritized above usability. Sure, there are plenty of cool elements you could use to set your website or app apart from the rest. Unfortunately, the more dynamic a digital experience, the more challenging it can be for those with disabilities to connect with.
Include Hungry Media in Your Next Project
Our experienced designers and developers expertly create websites that meet not just the needs of your business, but the needs of your end user. Our unique approach works to determine exactly what those needs are, and our team collaborates with you throughout the design and development process to ensure we’ve covered each of the inclusive design principles above. Contact us today to discuss including Hungry Media in your next digital project.
contributed by Melissa Lucas, senior staff writer
