Accessibility & the WCAG guidelines
Accessibility involves designing and developing websites that are easily usable by everyone, regardless of their ability. This is accomplished through adherence to the Web Content Accessibility Guidelines (WCAG).
What is accessibility?
The goal of accessibility is to ensure that all users, regardless of their abilities or disabilities, can access and interact with content efficiently and effectively.
Establishing accessibility is not only an ethical responsibility but also, in many countries, a legal requirement. By making their online content accessible to all users, web developers and designers can promote inclusivity, enhance user experience, and avoid potential legal issues.
WCAG what?
Many factors contribute to accessibility, such as clear and concise language, well-organized content, and consistent navigation. Other important considerations include colour contrast, font size, and the ability to resize or zoom in on web content.
To ensure accessibility, developers and designers should adhere to a set of guidelines and standards developed by the World Wide Web Consortium (W3C), called the Web Content Accessibility Guidelines (WCAG).
The current version, WCAG 2.2, has three levels of conformance: A, AA, and AAA. Level A includes the most basic requirements for accessibility, while level AA includes additional guidelines that are more challenging to implement. Level AAA is the most stringent and difficult to attain and is beyond the scope of this guide.
These guidelines encompass a variety of accessibility issues, such as providing alternative text for images, captions for audio and video content, and keyboard-only navigation.
New to accessibility?
For developers, I strongly suggest starting with a refresher on
If you're a designer, I suggest beginning with
I recommend managers, and content writers, read the
The four main principles of accessibility
The 54 AA guidelines for web accessibility are organised into four primary principles to provide a comprehensive framework for ensuring accessible web content.
Perceivable – The first principle focuses on making web content perceivable to all users by providing content that can be accessed through sight, hearing, or touch. This includes providing text alternatives for non-text content, providing captions and transcripts for multimedia content, and ensuring that colour is not the sole means of conveying information.
Operable – The second principle ensures that users can navigate and interact with web content using a variety of input methods, including keyboard, mouse, touch, and voice commands. This involves providing clear and consistent navigation, and labelling form controls.
Understandable – The third principle emphasises the importance of presenting information and user interfaces clearly and understandably. This involves using plain language, concisely providing instructions, feedback, and error messages that are easy to understand, and avoiding jargon and overly technical language.
Robust – The final principle ensures that web content can be interpreted by a wide range of user agents, including assistive technologies. This entails employing consistent markup and avoiding features which could be incompatible with certain user agents.
Following these four principles, developers and designers can create accessible web content that can be enjoyed by all users, regardless of their abilities, the technology used, or the speed of the connection.
External resources are provided for each principle to help with implementation and understanding.
Testing and code examples
- Manual testing – A series of manual tests to perform.
- Conformance checklist – Targeting many, but not all level A and AA concerns.
- Testing tools – Automated dev tools, screen-readers, learning courses, and few bookmarklets to help with manual testing.
- Code examples – Codepen examples of common issues.