All Things A11y

Accessibility is an extremely important and necessary aspect of building web applications, and unfortunately oftentimes overlooked. I want to provide a beginner’s guide to what accessibility on the web is and how everyday developers like you and I can make our applications accessible to anybody!

We’ll be going over:

• What are the Web Content Accessibility Guidelines
• Who are the Web Content Accessibility Guidelines for?
• What are the main principles of the Web Content Accessibility Guidelines?
• How you can begin to implement accessibility into your applications?

What are the Web Content Accessibility Guidelines

If you have ever looked into accessibility in applications you probably heard of the Web Content Accessibility Guidelines. These guidelines are provided by the Web Accessibility Initiative (WAI) of the World Wide Web Consortium (W3C). W3C is the main international standards organization for the internet and provides standards to help make the web accessible which are recognized by governments and businesses internationally.

Who are the Web Content Accessibility Guidelines for?

The WCAG is intended for developers. It is not only for large cooperations and governments to follow in order to make their products accessible to all bodies but also for individual developers because they are to provide web access to all users. This is extremely important, as a developer, we don’t anyone to left out in using our products and we should always strive to make products and applications that anyone can use.

What are the main principles of the Web Content Accessibility Guidelines?

There are two versions of WCAG created by W3C WCAG 2.0 and WCAG 2.1. They are both stable referencable technical standards for web accessibility. They both have 12-13 guidelines, that are categorized into 4 principles: perceivable, operable, understandable, and robust. Each guideline has three levels of success criteria, A, AA, and AAA.
We will be going over the principles for WCAG 2.1 since it is the most up to date version, it is exactly the same guidelines as WCAG 2.0 provides, but it has a few more additions. The four main principles we will be discussing are provided directly from W3C’s WAI website.

A brief overview of the 4 principles of accessibility are:

Perceivable

Perceivable content means that users must be able to perceive information and user interface components presented, and it can not be invisible to all of their senses.
The main ways to achieve this are to:

• Provide text alternatives for non-text content. Provide captions and other alternatives for multimedia.
• Create content that can be presented in different ways, including by assistive technologies, without losing meaning.
• Make it easier for users to see and hear content.

Operable

Operable content means creating components and navigation that are operable and a user should be able to perform the operations needed to navigate an interface.
The main ways to do this are:

• Make all functionality available from a keyboard.
• Give users enough time to read and use the content.
• Do not use content that causes seizures or physical reactions.
• Help users navigate and find content.
• Make it easier to use inputs other than using the keyboard.

Understandable

Making understandable content means that users should be able to not only operate and interface but they should be able to understand the interface and information as well.
To achieve this:

• Make text readable and understandable.
• Make content appear and operate in predictable ways.
• Help users avoid and correct mistakes.

Robust

Robust Content must be detailed enough to be used by a wide variety of user agents and assistive technologies. The main goal is to have content stay accessible as technologies and user agents evolve.
To make robust content we mainly want to:

• Maximize compatibility with current and future user tools.

If any of these guidelines are not met, users with disabilities may not be able to use your application. Under all of these principles, there are a total of 12 guidelines.
These for principles lay the foundation for which is necessary for anyone to use your application, but it does not end here.

How you can begin to implement accessibility into your applications?

There is a world of ways you can begin to make your applications more accessible and there are many resources to begin implementing these principles. The A11y Project is a checklist that goes over these principles and helps you checklist accessibility in your application based on WCAG.
Another helpful tool for building accessible applications is running Google Lighthouse tests on Google Chrome. Lighthouse provides an accessibility score for any application whether deployed or in development mode. After running tests on Google Lighthouse there is detailed documentation on how to fixe issues your applications may have and you can begin boosting your application's accessibility score.
I hope this was helpful in understanding what the Web Content Accessibility Guidelines are and how that is important and necessary for all applications on the web and of course, understanding what accessibility means for developers and how we should be implementing it to our applications. You can always reference W3C’s recommendations for accessibility to improve your applications.

Cover is from Paul Green on Unsplash.