Understanding accessible web development

Thousands of neurodiverse and disabled users online find themselves coming up against accessibility and useability barriers on websites every day. How can you make sure your site is accessible, to the benefit of all of your customers?

• What is accessible web development?
• Who should you be making your site accessible for?
• Why is accessible web development important?
• Where to begin with accessible web development
• Overview of the accessibility standards 
• Tips for making your site accessible 
• Helpful accessibility tools for developers

What is accessible web development?

Accessible web development is simply web development created with the diversity of users in mind.

It’s vital to ensure a universal user experience for all visitors to your site, regardless of their abilities if you want your site to be accessible to as many people as possible.

Websites are so commonplace in the modern world, we might take it for granted that they are universal. Unfortunately, that’s not the reality and it prevents many users from receiving the same level of inclusivity that others have come to expect.

Accessible web development is more widespread but there’s still a long way to go. 

Who should you be making your site accessible for?

Users will have a wide variety of disabilities and neurodiversity when visiting your site.

• Disabilities can be neurological, auditory, physical, or visual or affect people’s speech. 

• Neurodiverse users could have learning disabilities, ADHD, dyslexia, mental illnesses and various other limitations of their cognitive abilities.

You should also consider users of different ages as well as the different devices being used, such as mobile, or users with slow network connections.

Why is accessible web development important?

Simply put, it’s the right thing to do. You don’t want any users to feel marginalised when visiting your site, simply because you haven't taken accessibility into account.

Although it isn’t a legal requirement, it is vital to consider universal accessibility so that all users can feel accommodated and welcome on your site. 

Why would you ever want to cut out a whole section of your target audience?

Where to begin with accessible web development

As users' needs are constantly evolving, along with the ever-changing development of your site and the web at large, aiming for 100% accessibility might feel like an impossible goal. But you can do a lot of good through optimising your site with these areas in mind:

• Minimise distractions so that your site is focused on your products or services.

• Use recognised elements of web design, such as highlighting buttons that can be clicked and fading them out if you’ve not filled out all the information on a form.

• Keep your site simple and logical, so that users always have a good sense of where they are and how to progress to the next step.

• Deliver site content in multiple ways, like video, text-to-speech and adaptable font sizes.

As you can see, these changes aren’t just going to be beneficial for specific neurodiverse and disabled users. Every single visitor to your site will benefit from an enhanced user experience. That’s a definite win-win.

Overview of the accessibility standards 

If you’re looking to optimise your site to the highest standard, with great attention to detail, it’s worth checking out the accessibility standards that have been set to date.

These accessibility standards have been created and are enforced by the Web Accessibility Initiative (WAI), a part of the World Wide Web Consortium (W3C). For best practice, you should always aim to meet with Web Content Accessibility Guidelines (WCAG).

Perceivable

All users must be able to identify the content and interface of your website. Remember, “perceivable” doesn’t mean all users must be able to physically see your site. Many partially sighted visitors will use screen reader software, which helps your site become more perceivable to them.

Operable

Every part of your site must be usable by every visitor. This includes things like buttons, navigation, controls and any other interactive elements. Many users will be assisted by voice recognition technology, accessible keyboards or screen readers to help with this. Again, simplicity helps a lot in this area; no need to complicate things.

Understandable

The content, format and overall logic of your site should be comprehensible and consistent to all users. Things like predictable design, a cohesive look and feel to the site and logical checkout systems all come into play here. You want to make sure any copy of your site is relevant, clear and easy to understand.

Robust

This is all about your site being easily interpreted by users who may wish to choose a variety of technologies to access your site. You’ll want to write your HTML to allow assistive technologies like screen readers to parse your code without the need for any visual reference.

If you’d like to read more on this, the WCAG Quick Reference is a fantastic resource and well-organised, so you can quickly find what you’re looking for information on.

Tips for making your site accessible 

Even if 100% accessibility seems like an unattainable goal, you should aim to get as close as you can. Some of these changes may take some time to implement but will have a lasting long-term impact on the usability of your site.

Here are a few suggestions to try, split into the 4 categories from WCAG, so you can see exactly how you’re positively impacting your users’ diverse experience of your site.

1. Perceivable

• Text alternatives.

• Make your site easy to see and hear.

• Captions are your friend.

• Make your content structure adaptable.

2. Operable

• Consider engagement timings.

• Make navigation easy.

• Keyboard functionality is king.

• Avoid blinking and flashing content.

3. Understandable

• Structure pages logically.

• Design your text content to be easily readable.

• Make error messages helpful.

4. Robust

• Your HTML should be parsable.

Helpful accessibility tools for developers

With accessibility being such a hot topic and vital to any modern online business, tools have already been created that you can benefit from right away. Many tools can help review your site to highlight areas of improvement. We’ve also included a colour tool as an example of the really specific and useful sites available to help you in more niche areas of your optimisation.

It’s worth remembering that ultimately, the human element will be the best option when it comes to reviewing the accessibility and usability of your site. However, these tools can offer an invaluable starting point.

WAVE

Pop your website URL into their search bar, and Wave will highlight any areas of your site that don’t meet the WCAG standard. You can also get an expert review of your site’s content along with a full audit.

SortSite

This tool evaluates the overall accessibility of your site in seconds. You can also check single pages of your site to get hyper-specific feedback on things like broken links, usability, web standards and SEO.

A11Y Colour Contrast Accessibility Validator

You might not have considered how impactful colour choices can be in your website design. Far from just a branding and visual reference of your products and services, they can also help your accessibility. This tool helps check the colour contrast of your site and suggests how you can adapt your colours to meet the WCAG standards.

There are many options available beyond these three examples, so it’s worth checking to see if any tools already exist as you start to optimise your site. This can help save you time and money in the long run.

Summary of accessible web development

Accessible web development may seem a little daunting when you consider all areas of compatibility. However, when you break it down, there are some really simple changes anyone can make to their site to immediately positively impact every single user.

A systematic approach that starts with some useful analysis of your current site is a great way to begin your optimisation journey. Ultimately, these changes will benefit every visitor to your site, levelling the inclusivity of your brand online.

Back to insights