Digital services have become an essential part of our lives, so it’s important to ensure that these services are accessible to everyone. Unfortunately, there are gaps in the accessibility of many websites, which can make it difficult or impossible for some users to access the content they need. In this blog, I discuss a few typical accessibility gaps in digital services.
In Finland, there are about a million people who particularly benefit from accessible digital services, and the aging of the population will continue to increase the number of people needing accessible services. The most accessible digital services are needed by users suffering from a permanent disability, such as the deaf or blind, but the rest of us may also need accessible services at least sometimes. Everyday life often presents situations where both hands can’t be used, for example, one hand is temporarily in a cast or there’s momentarily a child in your arms.
Typical accessibility deficiencies
Accessibility legislation in Finland is based on the three-level WCAG 2.1 guidelines, and it has been in force for a couple of years already. Despite this, we still have accessibility deficiencies in many digital services. As an accessibility expert, I’ve been testing the accessibility of both websites and mobile apps for several years in both the public and private sectors and have noticed that certain types of deficiencies repeat from one site or app to another. I’ve listed some of my most common observations below.
- Poor contrast: It can be difficult for someone with poor vision to see the text if it doesn’t stand out sufficiently from its background or if the text is placed on top of an image. Sometimes hovering a mouse over a button can make the text contrast difficult to read.
- Focus is not clear: If a user can’t see the focus clearly or at all, they won’t know if the focus is on a particular button, and they may end up performing the wrong action.
- Navigation order is not logical: It’s difficult for a user using a screen reader to understand the structure and content of the site if browsing doesn’t stay in a popup window but moves to browse the background, or if at the end of a drop-down menu, the browsing moves away from the open list. Browsing also shouldn’t skip certain parts of the page or go through the information in an illogical order.
- Links are poorly marked: If an icon related to a link is missing or incorrect, it’s often difficult for a seeing and hearing user to know if the link opens on the same page, a new tab, or if it’s an internal anchor link on the page. The user isn’t always provided with information about the type or size of the document behind the link so that the user could anticipate whether it’s worth opening such a link.
- Deficient button naming practices: A user using a screen reader can’t know what pressing a button means if the technical name read by the screen reader is missing entirely or if it’s written in the wrong language. This way, the user may end up performing the wrong action.
- Language code is not marked: When using a screen reader, it can be difficult for a user to understand the page content if the language code is missing from the page or if individual sentences or words are not marked with a language code. The screen reader reads such texts in the wrong language or with the wrong emphasis.
- State information isn’t given: A user using a screen reader can’t know, for example, if a checkbox is selected or not, or if a drop-down menu is open or closed if state information is missing.
- Images lack alternative texts: It can be impossible for a user needing a screen reader to understand the content of an image if the images lack an alternative text or if the text doesn’t sufficiently describe the image.
- Content is not visible: If the user enlarges the text, for example, to 200%, or when the user turns the phone, the text disappears from the visible area of the screen or is covered, making it difficult for a seeing user to understand the content/function.
- Illogical header structure: If the structure of the headers isn’t logical, for example, if header levels are missing or they’re in the wrong order, or if text meant as a header isn’t marked at all, it makes it more difficult for both seeing and screen reader-using users to understand the content.
- Incorrect HTML code: If the HTML code is not structurally correct, the screen reader may operate incorrectly and guide the user to act incorrectly.
Accessibility is everyone’s responsibility
There are often various deficiencies in the accessibility of digital services. It’s important to ensure at every stage of service creation that the end result is accessible to all users. In the design, attention should be paid to the colors and contrasts used on the page. In coding, technical solutions that implement accessibility requirements should be chosen.
It’s especially important for a digital service to support and guide people with different content creation skills so that they could easily produce accessible content. This could mean both training content creators and technical solutions, such as making it mandatory to write a caption for a picture, notifying about incorrectly created header structures, or making it necessary to provide an icon, document type, and size for a link. This way, the same content errors won’t repeat and the service will be pleasant for everyone to use and understand.