Made for everyone: how to design an accessible website (with checklist)

This sentence is more than just a phrase: The Internet has fundamentally changed the way we communicate, work, shop, and entertain ourselves. But while the web has become indispensable to many of us, not everyone has equal access to it. For people with disabilities, websites and applications can often present a barrier, making it difficult or impossible to access important information and services. However, it is possible to design websites in a way that makes them more accessible to people with different types of disabilities. It is not suprising that accessible web design is not only an ethical imperative, but also a legal requirement in many countries. A website that is accessible to people with disabilities also offers benefits to all users, as it is more user-friendly, easier to understand and better structured.

The triple bottom line model states that companies should evaluate their performance against three pillars – environment (environmental sustainability), economy (economic sustainability) and society (social sustainability) – as social sustainability is just as important as environmental and economic sustainability to ensure long-term success and positive impact on society. Social also plays a weighty role in the 17 SDGs, the Sustainability Development Goals. Sustainability does not equal green. That would be too simple.

Why software companies should care about accessibility in web design

First of all, an accessible website allows all users to access the content. This is important not only for people with disabilities, but also for older people who may have difficulty seeing or hearing.

In addition, by creating an accessible website, companies can also expand their target audience. A website that is accessible to all can help people with disabilities identify with the company and want to use its software products or services.

An accessible website can also improve the visibility and reputation of the software company. Therefore, it can help the company be perceived as socially responsible and inclusive.

Finally, in many countries it is also a legal requirement that websites be accessible. By implementing accessibility guidelines, companies can ensure that their website complies with applicable legal requirements and avoid potential legal issues.

Overall, there are several good reasons why software companies should strive for accessibility in web design. By creating an accessible website, companies can ensure that their content is accessible to all, improve the visibility and reputation of the company, and avoid potential legal issues.

Use our tools for sustainable software

Our three tools can help software companies and practitioners to gain the knowledge, the skills, and the funding they need to create sustainable software products and services that meet social, environmental, and economic needs. By taking advantage of these tools, your team can position your organization as a leader in sustainable software development, and help create a better future for all

This is what users of (non-)accessible websites see

Visual impairment is a widespread problem that affects millions of people around the world. According to the World Health Organization (WHO), approximately 2.2 billion people worldwide are affected by visual impairment, of which about 1 billion suffer from preventable or curable visual impairments. Digitization has made our lives easier in many ways, but for visually impaired people, the Internet can often be a hurdle. In this context, website accessibility is crucial to ensure that all users have access to information and services. Below are two short texts describing the experience of a visually impaired user on a non-accessible and accessible website.

Non-accessible: I enter a website and immediately I sense that there will be problems. The font is way too small and the colors are insufficiently contrasted. I try to zoom in, but the font gets blurry and the layout gets messed up. I have to strain to decipher the text, but in the end I give up and leave the site in frustration. Accessibility is important and I feel disadvantaged when a website doesn’t pay attention to it. I definitely won’t use any products or services here.

Accessible: I enter a website and immediately I notice that it is accessible. Very good! The font is large and clearly readable, and the colors are well contrasted. I can easily navigate the site because keyboard accessibility works and all images have alternate text. I feel relieved and welcome when a website is accessible, and I am grateful that the developers have taken into account the needs of people with visual impairments.

Checklist of basic principles of an accessible website

To create a disability-friendly website, you should follow basic principles of accessible web design. These principles will help ensure that your website is more accessible to all users, regardless of their abilities or limitations. Here are some of the most important principles:

Accessible design:

• A clear structure makes your website easier for users to navigate.
• Use a clear visual design to ensure that your website is accessible to all users. For example, avoid complex background images or too many animated elements that can be confusing or irritating to some users.
• Use simple and clear navigation so users can easily get to the content they want. That is why you should avoid complicated menu structures or too many sub-items.
• Additionally, use meaningful alternative text for images, videos, and other non-textual content so that users with visual impairments can understand that content.
• Use colors wisely and make sure that text and background color can be easily distinguished from each other. For example, use contrast tools to do this to ensure that the colors are easy for all users to see. An important point to consider when creating an accessible website is the fact that many people suffer from red-green deficiency. This color deficiency affects up to 8% of men and 0.5% of women. In order to ensure that the website’s content is easily readable for people with red-green deficiency, one should pay attention to certain color combinations. Did you know that Mark Zuckerberg is affected by red-green deficiency? That is also why Facebook is blue.
• Additionally, avoid flashing or moving elements that can be irritating or even harmful to some users.

Accessible language:

• Use clear and understandable language to ensure your website is easily accessible to all users. So, avoid complex phrases, technical terms, and abbreviations that can be confusing to some users.
• Also, make use of headings and paragraphs to divide your content into easy-to-understand sections. This makes it easier for users to navigate and find important information quickly.
• Use useful links that take users directly to the information they need. By the way, have you already red our article about Inclusive UX?

That counts for both:

• Finally, test your website regularly for accessibility and make adjustments if necessary.

These principles are a good starting point for making your website more accessible to all users. In the next part, we will give you concrete tips on how to put these principles into practice.

Examples of accessible websites and best practices

W3C Web Accessibility Initiative offers a wealth of information and resources on accessible web design. It is designed to be accessible and offers a wealth of resources and tools for developers to ensure their websites are accessible.

The website of RNIB (Royal National Institute of Blind People) is (as expected) an accessible website for people with visual impairments. It is well structured and includes many features to make navigation easier, such as text magnification and contrast adjustment.

Apple Accessibility is another great resource for accessible web design. Here, apple provides a lot of information about accessible features on Apple products and shows how to use these features.

GOV.UK is the official website of the UK government and is designed to be accessible. This website offers clear and simple navigation, alternative text for images and videos, and features such as text magnification and contrast adjustment.

Conclusion

All in all, creating a website that is accessible to people with disabilities is not only an ethical imperative, but also a legal obligation. However, accessibility is not only important for people with disabilities, but also for many other users who rely on certain aids or simply want to find their way around better.

However, creating a truly accessible website requires more than just following the rules. Accessibility is an ongoing process that also requires continuous testing, user feedback, and an open attitude toward diversity and inclusion.

By following the principles and tips presented, you can take a first step towards an accessible website and help ensure that your content is accessible and usable for all.

Checklist for accessible websites

A clear structure facilitates navigation on the website. ☐

Use a clear visual design without complex background images or too many animated elements. ☐

Make use of a simple and clear navigation, avoid complicated menu structures. ☐

Use meaningful alternative texts for images, videos, and other non-textual content. ☐

Make sure that text and background color are easily distinguishable from each other and use contrast tools. ☐

Avoid flashing or moving elements. ☐

Use clear and understandable language without complex sentences, technical terms, and abbreviations. ☐

Divide your content into easy-to-understand sections with headings and paragraphs. ☐

Use useful links to take users directly to the information they need. ☐

Regularly review the accessibility of your website and make adjustments as needed. ☐