Making the web a better place through inclusive design

The web should provide unprecedented access to information and interactions for everyone, but today this is often not the reality. Most websites have accessibility barriers that make it difficult or near impossible to use and navigate for users with disabilities.

Even though accessibility has come a long way over the last few years, it’s only recently that the focus has shifted towards truly understanding that websites and apps need to work for everyone. This is due to the accessibility on the web law and the Web Content Accessibility Guidelines (WCAG).

So, what do we mean by accessibility?

According to users with an impairment, one of the biggest obstacles they face when navigating websites today is the lack of sufficient colour contrast, text size, click areas and limited keyboard navigation.

When designing for the web, I tend to divide users into four impairment types or categories, that cover most permanent, temporary or situational disabilities. While blindness is what hinders most users’ ability to engage with the web, we also need to consider those who have difficulties with basic reading, interacting and understanding.

These four categories are as following:

• Vision impairment – low vision, colour blindness and blindness.
• Auditory impairment – loss of hearing and deafness.
• Motor impairment – inability to use a mouse, reduced response time and limited fine motor control.
• Cognitive and learning impairment affects how people process information. Includes perception, memory, language, attention, problem solving, and comprehension.

Providing all users with the same experience is inclusive design

The main purpose of inclusive design is to create a better experience on the web for everyone, regardless of their abilities. This is done through thoughtful creation of the content, design and code, and without the need for special adaptation or specialised design. The simpler the experience, the better for everyone.

The three pillars in inclusive design:

Content – a foundation for accessibility

When it comes to accessibility it’s difficult to neglect the importance of content, which includes the copy, tone of voice, and other contextual elements. Around 75% of the WCAG is based on content, so it’s vital to create content that is readable, structured and understandable. Don’t assume the user understands jargon or abbreviations.

Design – keep it simple

Designing for accessibility requires a new way of thinking. It’s not necessarily difficult, but it’s the same process as the content – keep it simple and predictable. Clean, modern, minimalistic designs can be accessible. For example, white space and contrast are two trends that align well with accessibility. And while you’re at it, make sure you implement all possible ‘visual focus indicators’ on the interactive elements on your websites, such as a keyboard navigation capability. Have you tried navigating through your own website using only the keyboard? It’s not possible for many websites, which is something that needs to change.

Code – make or break

Developers play a vital role in the make or break of an accessible website. By using appropriate coding methodologies and techniques, developers can achieve the correct accessibility of content on your website. In short, for a website to be accessible, it must work without the use of a mouse because many assistive technologies rely on keyboard-only navigation.

SEO and inclusive design walk hand in hand

In many ways, search engines are deaf, blind, use only a keyboard, and have limited technical abilities. They rely on content structure, semantics, and functionality to either present content to users or determine the relevance of content. Google makes it clear: websites that give users a better experience will be more visible on the search results pages than those without.

Without doubt, Alt text, keywords, and content that matches a user’s intent is one of the most critical elements for good SEO. In addition, having a clean and compliant code means that your website can be read by the widest possible range of browsers and devices, and are less likely to break your webpage. This helps all types of users, and it won’t disrupt screen readers as they go through the pages. It will also give you a higher SEO ranking.

Despite being separate disciplines, accessibility and SEO are mutually beneficial. The better your site serves all users, the better it will serve search engines, too.

How about inclusive design thinking for your next web project?

Inclusive design is the right thing to do! In fact, it’s essential to make sure the website doesn’t discriminate against any user or end up in a lawsuit. A common estimate is that about 20% of us here in Sweden have some kind of disability, so designing from an accessibility-first standpoint has the potential to benefit all stakeholders, since inclusive design normally delivers a better user experience and a higher SEO ranking.

Incorporating accessibility from the beginning of a website project or a redesign process is significantly easier. It’s also more effective and costs less than waiting until the end of this process. Accessibility doesn't have to be perfect; it just has to be a little bit better than yesterday.

Let’s wrap it up!

You now know what inclusive design is, the benefits of it, and why you should implement it. If you take anything from this article, then please take away these three points:

• Designing websites that are inclusive is not difficult and it has plenty of benefits.
• It helps everyone, including your SEO ranking.
• Most importantly, it’s the right thing to do.

Need help with making your site more accessible or userfriendly, or have any questions? I’d love to hear from you!

By André Dahl UI designer