After the previous lesson, you should now have a better understanding of how important web accessibility can be for certain users, and how beneficial it can be for all users. But how do we know not only what should be a11y friendly, but how to make those things a11y friendly? Well, there are many sources available to tell us the what and how, those who actually rely on accessibility being one of the best sources we can consult.
Another source, one that goes over many different ways to help make websites more accessible, is the Web Content Accessibility Guidelines (WCAG). In this lesson we’re going to skim the surface of the WCAG, just to familiarize you with them at a more basic level.
By the end of this lesson, you should be able to:
The WCAG exist in order to help create a shared standard when it comes to web accessibility. Think of web accessibility as the destination, and the WCAG as one of the tools that can help get us closer to it.
It’s important to understand that while the WCAG can be incredibly helpful for building an a11y foundation, they are not the finish line when it comes to accessibility. Like the name says, they are simply guidelines, and they will only help us make websites more accessible.
The WCAG are organized around four, core principles that should be kept in mind when implementing any sort of accessibility feature:
Perceivable: Users must be able to perceive the information or user interfaces being presented. For example, Light text on a light background could be difficult for some users with a visual impairment to perceive.
Operable: Users must be able to operate any user interfaces or navigation, and interfaces cannot require an interaction which the user cannot perform. A navigation bar with drop-down menus that only expand when a mouse cursor hovers over them, for example, would not be operable by keyboard users giving those menu items focus.
Understandable: Users must be able to understand any information or user interface that is presented to them. For example, if a user tried submitting a form and received an error such as “Error 113: Bad data”, they wouldn’t be able to understand what the error actually means or how to fix whatever caused the error.
Robust: Content must be accessible by current assistive technologies and other user agents, and must remain accessible as those technologies advance.
Conformance levels get mentioned at a couple of other points in these lessons, and we’re only mentioning them here to briefly explain what they are ahead of time. To put it simply, the WCAG has three different conformance levels, each of which is made up of various success criteria, or rules, that must be followed in order to successfully meet that level of conformance. You don’t need to worry about meeting any of these conformance levels completely for the purposes of these lessons, you only need to know that they exist (luckily their naming is pretty easy to remember).
The lessons that follow dive into several concepts that can help you improve the accessibility of your websites, but they don’t cover every facet of accessibility. The goal of these lessons is just to introduce you to some of the more common or simpler concepts that you should get into the habit of checking for moving forward.
Even though we’re only introducing you to some of these a11y concepts, you may still worry that your site isn’t accessible enough. The first thing to keep in mind is that no site will ever be 100% accessible, so don’t try to aim for such an impossible goal. Sometimes the purpose or concept of a site even requires some things to not be accessible in certain ways.
The second thing to keep in mind is that just taking those first few steps towards creating accessible websites matters just as much as the many more steps you’ll take in the future. Even if you only add one a11y feature to your websites for now, what you may think is a minor addition could actually be a huge improvement for more users than you realize. So don’t feel like you have to make everything perfect or that you need to add everything at once when implementing accessibility, especially when you’re just starting out.
This section contains questions for you to check your understanding of this lesson. If you’re having trouble answering the questions below on your own, review the material above to find the answer.
This section contains helpful links to other content. It isn’t required, so consider it supplemental.