Accessibility is a vital aspect of successful web design, yet too often we see that it is implemented late in the process, or sometimes not at all. To ensure inclusive user experiences, accessibility must become a habit throughout design.
Why is accessibility important?
Inclusive and accessible web design is an ethical consideration and legal requirement, yet 97% of the world’s top one million websites don’t offer full accessibility.
The vast majority of Web Content Accessibility Guidelines (WCAG) failures on these homepages fell into categories such as low contrast text, missing alt text, empty links, missing form labels, empty buttons, and missing document language, with 96.5% of all detected errors falling into these categories. Addressing these issues alone would significantly improve accessibility across the web.
Forgetting to design for accessibility means that you are potentially failing to meet the needs of 15% of your target audience (WHO 2021). Implementing best-practices from the start ensures that all of your users are able to have a good experience.
How to apply accessibility throughout your work
Designing for a range of user needs can be a complex process, and there’s always room to improve. Here are three points to consider:
Keep learning
There are hundreds of resources available which contain all sorts of information to help you learn more about designing for accessibility. To start, you can read articles that people have created on the subject, especially if there is an article on the niche you are designing within.
Another way to learn is to see what has been done before. Run an accessibility checker on your competitors’ websites. If they’ve done well, look closer at what they’ve done. Look at what other large companies are doing, look at where they’ve failed, and where they have succeeded.
You can also run a chrome add-on, such as Funkify (which has a 4 day free trial) or Silktide (free), which simulates sight disabilities such as dyslexia, colour blindness, blurred vision, and partial vision loss. You’ll be surprised by the difference it makes.
Check it often
Run an accessibility check every week, month, or quarter (depending on how often it changes on your website), or if you are particularly on it you can run an accessibility check every time you make a major or structural change to the website you are designing.
Similarly, whenever you use a new background colour or new text colour, check the colours you want to use against the WCAG 2.0 guidelines. There are tools available online that will let you enter your hex codes and let you know if they are A, AA, or AAA compatible. Accessible web’s colour contrast checker is useful, and you can find others easily through google.
Make it easy for yourself
You’ll find it easier to design for accessibility if you embed it within the small actions that you take. For example, If you have a word template for article drafts and a section for images, add in a space for the alt text right next to the images. Then whenever you add in an image, add in the alt text. If you have a template you need to use, add in the accessibility reminders where appropriate. Before too long, these steps will become instinctual.
Still not sure where to start?
You can read WCAG 2.1 for more guidance on how to design for accessibility. Don’t forget to check all three levels, sometimes the difference between A, AA, and AAA is very small, making it worth jumping straight to the AAA guidance. If reading through documents isn’t for you, there are some simplified versions out there which help to break down what you should be doing to improve the accessibility of your website.
You can also run an accessibility check on your website to figure out what to improve next. A great chrome add-on tool to use is WAVE, which is powered by WebAIM. When run, it has a colour contrast checker and looks for any structural accessibility issues on the webpage it is checking.
