Estado de la accesibilidad web en el año 2022

En The baseline for web development in 2022 se comenta:

Accessibility

We’ve talked a lot about our users’ devices, but let’s now talk about the users themselves. According to the World Health Organization, over 1 billion persons have some kind of disability. There are many different kinds of disabilities but many of them influence how the user will interact with their devices. We usually use the term accessibility (a11y) to refer the actions needed to ensure disabled users can fully interact with our sites.

However, a11y is not only for disabled people. Actions to improve a11y have a positive impact on the UX for every user. The main reason for this is due to situational disabilities. Some examples of situational disabilities include trying to use your phone while eating or drinking something with one hand or device settings that places a black and white filter on the screen after a certain hour to improve sleep quality. Users faced with these situational disabilities will be able to use pages which are designed with a11y in mind as usual.

Moreover, not being accessible can also lead to legal problems. Depending on the legislation, users may even sue sites that don’t take a11y in account. Some famous cases include both Beyonce and Domino’s Pizza being sued for not being accessible for visually impaired users. So, not having proper a11y can be costly too.

How accessible is the web?

Let’s now take a look at how accessible is the web. To do that, we’ll take out some representative data from the Web Almanac’s a11y chapter. There are many more data points in there in case you want to take a deeper look.

• 77.8% of sites don’t have good contrast between background and font color. This means, that some visually impaired users and users using filters such as the one mentioned above may not be able to fully use almost 80% of the web.
• 29.4% of sites block zooming. Some browsers ignore this setting nowadays but this is still a very big number.
• 42% of sites have improperly ordered headings. Cases such as using an h2 element without using an h1 element before. This lack of order might cause problems, especially for users using assistive technology.
• 29% of sites use role="button". Some people might think that having that role and a click listener might be enough, but buttons must also respond to keyboard events and have proper focus handling. While you might achieve this using JS, you don’t need JS at all if you just use the button element.
• 32.7% of sites have input elements with no accessible label. In other words, they don’t have an associated label element, an aria-label attribute, or anything else. This is worrying because you might be losing revenue due to this. For example, if a credit card input isn’t labelled, you might have users that want to buy something but don’t know where to write the information needed.