Accessibility is never a "nice-to-have" requirement when it comes to developing websites and apps. It's a "must-have" that should be an integral part of your design and development process.
Ensuring good accessibility is a fundamental responsibility for developers. It can help their applications provide an equitable experience for all users.
But it can be easy to go down a rabbit hole when learning about accessibility best practices.
Fortunately, there are many resources available that teach you how to build accessible websites and apps. In this article, I'll discuss the three websites I frequently go to when I have questions about accessibility: W3C WCAG, WebAIM, and a11yprojects.
Let's look at each one and how you can use them to create more accessible projects.
W3C WCAG
First up, there's W3C WCAG. As stated in the Web Content Accessibility Guidelines (WCAG) website, WCAG provides, "strategies, standards, resources to make the Web accessible to people with disabilities".
The guidelines listed on this website provide comprehensive frameworks for developers to make the web pages universally accessible.
WCAG helps developers craft digital spaces that are usable, perceivable, operable, and robust.
One great section of W3C is the Easy Checks – A First Review of Web Accessibility. In this section, developers can easily learn accessibility rules when it comes to page titles, images, text, and interactions. Easy Checks section is a great place to start navigating W3C.
How to Use W3C WCAG:
- Visit the W3C WCAG website and explore the guidelines and success criteria relevant to your project.
- Study the techniques and documents for the technologies you're using.
- Check the conformance requirements to set accessibility goals for your website or app.
To learn more about these standards and how to make a website accessible, you can come to W3C and study criteria needed to be considered accessible. W3C WCAG is one of the best websites to go to learn about accessibility rules.
WebAIM
On WebAIM's website, they state that they, "empower individuals and organizations to create and deliver accessible content".
WAVE is a accessibility evaluation tool. One tool WAVE offers is its Browser Extension. After downloading the WAVE browser extension, you can inspect your pages and log accessibility issues with the page. Then you can easily figure out how to fix these issues.
The WAVE extension is available on FireFox and Chrome and makes it so simple for your to recognize common accessibility issues. You can find instructions on how to download the WAVE extension on the WAVE's extensions tab.
After downloading the WAVE extension, you can go to your extensions and run it. Finding accessibility issues is as quick as clicking a button. For example, after downloading WAVE, I ran the extension on the New York Times homepage and was alerted to the accessibility issues the website had.
In the screenshot above, you can see The New York Times homepage with the WAVE extension running. On the left side of the screenshot, you can see WAVE's summary tab pointing out 1 accessibility issue in the homepage with 120 errors. This is WAVE's summary tab, which gives developers a overview of accessibility issues in the page.
WAVE goes in depth and explains the summary tab even further. Clicking on the details section of the extension lists the accessibility errors in greater details, which you can see in the screenshot above.
The one error that was in the summary page is explained further in the details section. WAVE points out that the accessibility error was a linked image missing alternative text. The 120+ warning are also listed in much more detail, which point out that there are 8 long alternative texts, 1 missing first level heading, 4 redundant link and much more.
The details tab is a great way to find out the accessibility issues your page might have and give you a starting point to fix the accessibility issues.
How to Use WebAIM:
- Install the WAVE browser extension, then run it on your web pages to identify and address accessibility issues.
- Explore WebAIM's website for additional resources, articles, and training materials.
a11yproject
a11yproject, pronounced "a-eleven-y-project" (with "11" representing the omitted letters in the word accessibility) "is a community-driven effort to make digital accessibility easier".
This website displays articles that are all about accessibility. The articles are written by developers and approved by the a11yproject team.
Some recent articles published on a11yprojects include, What is Semantic HTML? and The power of ChatGPT as a cognitive accessibility assistive technology for Traumatic Brain Injury survivors. There are many more interesting topics around accessibility as well.
a11yprojects are divided into different categories, which range from quick tips, background, myths, quick tests and so much more. Readers can go to a11yprojects and filter to a article category they want to see.
a11yproject articles are written by developers that are passionate about accessibility and have a lot of knowledge to share with others. You can go on a11yprojects website to read about latest news about accessibility. The website covers all aspects of accessibility, but mainly focuses on web accessibility.
How to Use a11yproject:
- Visit the a11yproject website to read articles about accessibility best practices and the latest news in the field.
- Engage with the accessibility community by participating in discussions and contributing your knowledge.
Conclusion
There are so many resources available online for developers to learn about the latest news on accessibility. There are also many communities of developers that are passionate about accessibility.
W3C WCAG, WebAIM and a11yprojects are just few online resources available for developers to conduct accessibility research. By going to these three websites, developers can learn the latest news on accessibility and study acceptable accessibility criteria.