Nearly 97% of recurring accessibility errors in web services can be grouped under six topics. They could be easily addressed, but why are these issues not resolved and what could be the consequences?
A fully accessible, universally accommodating, and easily usable website is a unicorn, as few have ever seen it.
Web accessibility organisation WebAIM annually compiles statistics on the accessibility results of a million homepages. In 2022, a total of 96.8% of the participating homepages contained accessibility errors. That's 968,000 sites out of a million. Improvement from the previous year is only about a couple of percentage points.
Developers creating web services significantly promote equality in their work. Awareness of the importance of accessibility reflects in values, which in turn directly impacts their work. Thus, correction primarily occurs through changes in attitudes and work culture.
Accessibility has many impacts that reverberate from the individual level upwards and more broadly.
There are several reasons for poor accessibility. This blog post looks at both the technical side and how developers can influence the realisation of equality online.
The most common accessibility errors relate to screen reader usage
Accessible web content is composed of three different areas: technical solutions, comprehensibility of web content, and usability of the web service.
The technical success of accessibility relates to the WCAG guidelines. These are divided into four fundamental principles that a web service must meet. According to these, the web service must be perceivable, operable, understandable, and robust.
Text alternatives are crucial elements for a person using a screen reader. In WebAIM's statistics, the most common web accessibility errors are listed as errors that repeat basic issues with text alternatives.
Missing text alternative: All images on pages must have a text alternative that describes the image content in the best possible way. It is essential to note that words related to colours, such as sky blue, are visual perceptions that may be difficult for a visually impaired person to relate to.
Missing form labels: Forms need text alternatives. If form elements do not consider a screen reader, and text and elements are not linked, the function with a screen reader is not certain. For example, the first name prompt is not linked to the text field, and the screen reader does not convey a text input prompt. The screen reader reads these separately, and the user does not receive a clear prompt to enter their first name on the form.
Empty links: The link does not indicate what happens or what it relates to, and a screen reader cannot correctly interpret the context. For example, “Read more” vs. “Read more about accessibility”
Missing language attribute: The <html> element is missing information from its lang attribute indicating the language of the site to the user. Without this information, the screen reader does not recognise the language, and the user is not informed beforehand. For example, a user who does not understand Spanish can waste time on a Spanish website.
Empty buttons: Buttons on sites often lack content and therefore context. An example of missing content could be an <img> element inside a <button> element, i.e., an icon button without a descriptive text alternative or any text content at all.
Contrast errors: Colours do not sufficiently stand out from each other, and the contrast between text and background is not adequate. For instance, white text on a grey background is not visible.
The errors listed above are indeed the most common, as 96.5% of all errors fall into these six categories. Why do the same errors persist, and why have corrections not been made?
Duplicated elements replicate accessibility errors
E-commerce is about visual presentation of products, and therefore sites usually have plenty of content, elements, and components.
The high number of accessibility errors in online stores is partly explained by the fact that websites require a lot of functionality – sites are based on a continuous chain of interaction between the user and the store.
When something other than a <button> element is used as a button, it is essential to name and role it correctly so that interaction is smooth when using a screen reader, although visual styling has been perfected.
The number of elements increases the number of errors but is not solely responsible for their repetition.
Accessibility errors are not always necessarily unique errors. When the same product component containing an accessibility error is used for every product throughout an online store, the error in the component multiplies into as many errors as there are products in the store.
This approach in development – using the same component in many places – actually produces replicated errors. Perhaps we should ask why a small error with a wide impact does not get enough attention for correction?
The technical implementation of accessibility is a complex matter. It can even go overboard. Without careful planning and consistent implementation, the result can be a “too accessible” site that turns against itself.
At its best, accessibility serves all users of the site, and the benefits of functionality are reaped by the business. Read more about how investment in accessibility pays off.
Select a partner for your web service based on values too
The attitudes of people and work culture must change. It is remarkable that the matters of minorities are not taken more into account online in the 21st century.
The change has, however, begun; it is visible in the increased conversation and the slow growth of improvements.
When choosing web services, it is essential to consider how ethically service providers think about things and how these are reflected in practice.
Do you want to make your site accessible to everyone or need more information on accessibility? We can help, get in touch!
Crasman Ltd
18 Jan 2023
