A Designer’s guide to web accessibility

What is web accessibility?

Web accessibility refers to the inclusive design and development of websites, applications and digital content that can be accessed and used by people with health conditions or impairments. It aims to ensure that everyone, regardless of ability, can perceive, navigate and engage with content online effectively and independently.

Why web accessibility is vital

Two of the main reasons why web accessibility is crucial is the social importance and legal requirements. By making websites and digital content accessible, particularly to anyone who may rely on assistive technology to navigate online platforms, we can promote equal opportunity, diversity and inclusion and enhance the overall user experience for everyone. 

Legally, many countries have regulations and laws that require digital content to meet accessibility frameworks. Non-compliance can result in fines, make content inaccessible and damage a company’s reputation.

Key web accessibility statistics

Considering that an estimated 1.3 billion people globally experience significant disability, it makes complete sense that websites and digital content should be developed and designed with accessibility in mind.

 Here are three eye opening website accessibility statistics from recent research:

• As of 2022, only 3% of the internet is accessible to people with disabilities.
• Evaluation on the top 1 million website homepages revealed that close to 51 million distinct accessibility errors were detected – that’s an average of 50.8 errors per homepage.
• Digital products that meet the full Web Content Accessibility Guidelines (WCAG) level 2 compliance are likely to perform 50% better than their competitors by 2023. 

How to check your site’s web accessibility 

There are several ways to check your site accessibility. Here are some of the most common methods:

• Automated testing

There are many web accessibility testing tools that can automatically scan your site and highlight any accessibility issues. Popular options include WAVE, Axe, and Web Accessibility Checker (WAC).

• Manual testing

While automated tools are helpful, it’s also important to manually review your site to 

identify any issues that might have been missed. Review the site with keyboard only navigation, check colour contrast, verify alternative text for images and diagrams and test with assistive tools such as screen readers.

• User testing

Having people with disabilities test your site and provide feedback on any barriers they encounter is an effective way to test accessibility. This can be done remotely or in-person and provide valuable insights.

• Third-party audit

An accessibility expert can conduct a detailed assessment and provide a report outlining any issues found and recommendations on how to resolve them.

How to design an accessible website

There are many factors to take into consideration when developing a website with accessibility in mind. We’ve outlined some of the key priorities to focus on during the planning and design process:

• Use headings correctly

Organise the structure of your content for screen readers and users with cognitive disabilities. Appropriate heading levels and avoiding skipping levels is important.

• Accessible CMS

Choose a content management system (CMS) that supports accessibility standards, such as WCAG 2.0 or 2.1 to ensure your site is accessible from the ground up.

• Descriptive titles

Ensure your titles are informative for links to help users understand the content they will be accessing. Avoid generic phrases such as ‘click here’.

• Include alternative text

Also known as ‘alt text’, make sure you provide clear and descriptive text for images so users with visual impairments can understand the content. 

• Colour selection

Text and background colours need to have enough contrast to be readable. Avoid 

relying on colour alone to convey any information or meaning. 

• Accessible forms

When designing forms, be sure they’re easy to navigate, with clear instructions and labels. Clear error messages and suggestions for corrections are also important. 

• Use tables for data

Tables are great for presenting data, not for layout or design purposes. Ensure they are properly structured with headings and captions. 

• Accessible dynamic content

Provide alternative options for users who cannot access dynamic content, such as transcripts, text descriptions or alternative media formats. 

• Allow keyboard navigation

Test your site with a keyboard only navigation to ensure it’s fully accessible.

• Add captions and transcripts

If you have any audio or video content, make it accessible to users who are deaf or hard of hearing. Accurate captions that are synchronised with the content are important.