💡 What is accessibility?

Why is accessibility (A11Y for short) so important and why is it not widely implemented? What is accessibility in general, and why do I want to encourage you to change the way you create websites and web applications? What are the benefits of having accessible solutions? I would like to influence your perception of accessibility for the applications you create, even if it’s just a little bit.

Accessibility, also known as digital accessibility, refers to the ability of all users on the internet, including those with visual impairments, disabilities, and other limitations, to use applications and websites. Limitations don’t necessarily have to be related to health. You might have experienced situations where you wanted to quickly use an application solely with your keyboard or zoom in to get a better look at a specific element.

Accessibility should also consider internet connection speed and availability. If our applications are large and take up a lot of space, people with slower connections may have significant difficulty accessing the content we’ve prepared for them.

WCAG

WCAG stands for Web Content Accessibility Guidelines, a set of documents developed by the Web Accessibility Initiative (WAI) that define guidelines for the appearance and behavior of websites and applications to make them accessible to everyone. This set of guidelines is very helpful in implementing accessibility solutions as it provides a list of requirements on how content should be presented.

Why do people/companies not pay attention to accessibility?

Why is accessibility often overlooked during application development? This is due to several factors:

1. Additional costs: Implementing accessibility may involve additional costs that some companies might find burdensome.
2. Extra time: Introducing accessibility may require additional time for the design, testing, and implementation process. Some organizations may be constrained by tight timelines.
3. Regulatory limitations: Many legal regulations primarily target public entities, which means that only a small number of solutions need to meet accessibility requirements. This can result in less emphasis on accessibility in the private sector. It’s worth noting that the European Union is implementing the “European Accessibility Act” which aims to improve the functioning of internal product and service markets by eliminating barriers created by different regulations in member states. This means that the services mentioned in the above article should be more easily accessible to older people and people with disabilities.

All these factors contribute to insufficient attention given to accessibility during application development. However, it’s essential to ask ourselves why we should care about accessibility. The answer is simple: we shouldn’t exclude anyone. Every person should be able to consume content available on the internet. Another argument is that accessibility translates into running your business successfully. If your content is accessible, it will reach a larger number of potential customers.

Are the applications I use “accessible”?

You can perform a simple test. Just visit your favorite website and see how easy it is to navigate using only the keyboard. This is a relatively straightforward test but will definitely allow you to evaluate how well the application is prepared for it. To deepen this test, I recommend running a screen reader and “reading” the website with it. Let me know how it goes ;)

It turns out that many websites are not prepared for accessibility. We can’t entirely blame them, but unfortunately, it’s not a top business priority. Often, keyboard navigation is impossible, and the text read by the screen reader sounds like gibberish instead of meaningful and structured content that guides navigation.

How to start your journey with accessibility?

The fundamental thing that every web creator should implement is code semantics. If I were to point out one very minimal action for accessibility, it would undoubtedly be semantic code. I’ve seen many div tags styled like buttons and scripted to respond to clicks, but what’s the use if they can’t be used correctly with a keyboard? Such a button is semantically incorrect and useless. By caring about writing semantic code, you’re already doing a good job!

Some examples related to the functionalities present on “accessible” websites:

1. “Bypass block”: When entering a website using the tab key, a menu appears on the screen that allows you to skip the menu section and jump straight to the main content of the page.
2. Adding text alternatives (alt) to images.
3. Enabling zoom functionality.
4. Applying appropriate contrast.
5. Focus trap.

There are many more such improvements. The work you do is measurable and testable. The Web Content Accessibility Guidelines (WCAG) have success criteria for this purpose. To paraphrase:

“Each item on this checklist has a corresponding WCAG success criterion. Success criteria are the specific, testable rules that power the WCAG, described by a reference number and short title. For example, the rule about text resizing is called 1.4.4 Resize text. Some accessibility issues may have multiple success criteria applying to them. We have identified the one most relevant for each checklist item.”

In the subsequent steps of your accessibility journey, you can delve into ARIA, get to know tools that facilitate and support work, like browser extensions such as AXE.

Additionally, and rather importantly, I recommend spending some time exploring https://www.w3.org/. The World Wide Web Consortium (W3C) develops standards and guidelines that help create solutions in line with A11Y, internationalization, privacy, and security.

You’ll find plenty of guidelines and best practices, for example:\

1. https://www.w3.org/WAI/ARIA/apg/patterns/
2. https://www.w3.org/WAI/ARIA/apg/example-index/

Organizations also work towards accessibility, such as:\

1. https://widzialni.org/
2. https://www.a11yproject.com/

Examples of companies that emphasize accessibility:

Apple

Apple has been focusing on the accessibility of its products, such as iPhone, iPad, and Mac, for years. Their approach is based on integrating various accessibility features, such as VoiceOver, AssistiveTouch, and magnification features, to enable people with different disabilities to use Apple devices. This approach has earned Apple the loyalty of many users and a reputation as a company that cares about accessibility. You can find more information about Apple’s accessibility efforts on their website: https://www.apple.com/pl/accessibility/

Microsoft

Microsoft also places great importance on developing accessibility features in its products, such as the Windows operating system and Office suite. They have introduced various tools, such as Narrator, Magnifier, and customization options, to help people with disabilities use Microsoft technology. An example is Narrator, a built-in screen reader that allows visually impaired individuals to read the content displayed on the screen. More information can be found on the Microsoft Accessibility website: https://www.microsoft.com/pl-pl/accessibility

Here are a few useful links:

• https://www.w3.org/
• https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA
• https://www.deque.com/axe/devtools/
• https://widzialni.org/
• https://www.a11yproject.com/
• https://ec.europa.eu/social/main.jsp?catId=1202
• https://webaim.org/resources/contrastchecker/

🚀🚀🚀 I hope I managed to convey the value of being “accessible” on the internet, even if only to a small extent. ENJOY!