How to fix commonly arising accessibility issues

Introduction

Website Accessibility is considered important because it ensures every visitor, irrespective of their physical ability, has a good user experience. It fosters inclusivity and improves the user experience of the website. Accessibility isn’t an option; it is a must. A certain set of guidelines is provided by the Web Accessibility Initiative of the World Wide Web Consortium called Web Content Accessibility Guidelines (WCAG). 

The WCAG states four main principles:

1. Perceivable
2. Operable
3. Understandable
4. Robust

The best way to avoid any legal trouble and to ensure accessibility is by abiding by the WCAG.

We at Exemplifi build and manage websites that are well designed, improve user experience, and more importantly comply with the accessibility standards and are accessible to a majority of the population. It is common to encounter various issues in the web development process, and it is important to make sure the issues are resolved and the optimal functioning of the website is ensured. In this article, we’ll look into some of the design issues that affect accessibility and their fixes in one of clients - Acerail’s website development project.

‍

Why do Website Accessibility issues arise

Accessibility issues in websites could arise due to a variety of factors, like rapid technological changes that make catching up with accessibility difficult, the use of certain third-party tools, overlooking some accessibility standards during website development, and many more ( More on this later ). Most of the issues are identified through QA testing and rectified while the website is still in development. Effective QA testing after the project moves from Development to staging is crucial to ensure website efficiency and a seamless user experience.

‍

Design issues we’ve faced that affected accessibility and their fixes

Inaccessibility of certain components using keyboards

A website should be accessible completely with the help of a keyboard, as it allows people with physical disabilities and visual impairments to access the website with ease. Troubles arise when a few menus, buttons, or other components are not accessible with the keyboard. This would affect the user experience and compliance with WCAG.

We solved this keyboard inaccessibility by implementing the benchmark features of having a logical tab order, providing visual focus indicators, ensuring keyboard accessibility in interactive elements and custom widgets, and of coarse thoroughly testing each feature

Missing alt text for images

Including alt text in images is also one of the important aspects of website accessibility. As alt text describes images, it serves the purpose of explaining the image to visitors who are visually impaired and are unable to view the image, as well as to people with less internet stability. When it came to our ACE Rail project, it was critical to ensure that every image of a station, amenity or map was communicated clearly to every visitor. It significantly improved the overall user experience for visitors. These issues can be easily identified by QA testing and rectified during the website development process.

‍

Inadequate transcripts and captions for multimedia content

With the amount of data we are consuming on a daily basis, providing captions for video content is very important. It allows visitors who are unable to hear to access the video without trouble. It also improves the user experience for others because a considerable percentage of those accessing video content tend to consume it in a mute manner. So providing captions will help a large percentage of visitors while ensuring inclusivity. These issues can also be identified by QA testing, as they are easier to identify and fix quickly.

Dynamic content unannounced by screen readers

A screen reader is an assistive technology used by people with visual impairments that helps them access the website properly. Dynamic content like pop-ups and live updates can be disorienting if people are unannounced by screen readers. It can deteriorate the user experience and put accessibility at stake. WAI-ARIA, the Accessible Rich Internet Applications Suite, can be used to help people using screen readers with dynamic content. We highly recommend to use Native HTML elements whenever possible because using ARIA can make content behave in unpredictable ways, especially when proper testing is not carried out.

‍

Complex layouts and poor content structure

Complex, visually dense layouts and poorly structured content can make it difficult to navigate along the page for visitors with cognitive disabilities. Structuring the content properly and creating an architecture that flows logically makes the content accessible to all visitors. It also helps to improve the overall accessibility of the website. Using semantic structure can make website navigation easy for visitors and also for visitors using screen readers.

‍

Summary:

In summary, making a website accessible isn't just a courtesy; it's a necessity. From providing text alternatives to ensuring keyboard accessibility, providing alternative communications to videos, structuring content correctly, and thorough accessibility testing, every step is crucial. Adhering to WCAG guidelines ensures that your website is not only legally compliant but also universally welcoming, making the web a more inclusive space for everyone.

‍

If you liked this insight please join us on LinkedIn, X and Facebook for more updates