Accessibility as a Priority: Websites that are Accessible to All Users

On September 30, 2022, I had the opportunity to present materials and insights about Accessibility at the cmlabs class event organized by cmlabs. Based on the content I delivered during the cmlabs class session, I will explain and discuss what accessibility is, how important it is, and the guidelines to maintain accessibility.

When browsing a website, you may have come across poor navigation, low color contrast, difficult-to-understand language, incompatible technologies, and more. For some people, these issues may be frustrating, but it’s not a big deal. However, for individuals with disabilities, these issues may be crucial. The issues mentioned above are just a few of the main topics discussed in this article, focusing on accessibility issues.

Accessibility Definition

Accessibility is a concept that addresses how the design and development of products, services, environments, or digital platforms can enable equal access and use for every individual, including those with disabilities.

Accessibility ensures that people with diverse abilities, including those with visual, hearing, physical, or cognitive impairments, can effectively perceive, navigate, and interact with the information being accessed.

Scope of Accessibility Issues

The following are the areas that fall within the scope of accessibility issues that need to be considered in maintaining website accessibility:

Visual

Visual accessibility issues are related to individuals with visual impairments or blindness.

Motor

Motor accessibility issues are related to individuals with physical disabilities or difficulties in using input devices such as keyboards or mice.

Hearing

Hearing accessibility issues focus on individuals with hearing impairments or deafness.

Seizures

Seizure-related accessibility issues are relevant to individuals who are prone to intense light stimulation that can trigger seizures.

Learning/Cognitive

Learning/cognitive accessibility issues pertain to individuals who have difficulty processing, understanding, or navigating information.

The Importance of Accessibility

Accessibility is an essential aspect for everyone to access a website, without exception. There are several reasons why accessibility is crucial:

1. Enhancing the User Experience

The user experience of a website that considers accessibility will undoubtedly be better because it involves all users, including those with disabilities or accessibility challenges. By providing good accessibility, all users can access and use the website more easily and comfortably.

This increases inclusivity and makes users feel valued, acknowledged, and engaged with what is offered on the website.

2. Compliance with Laws

Several countries, such as the United States, Canada, Germany, France, Spain, and Italy, have laws and regulations related to accessibility. Through these established regulations, individuals can file complaints against websites with poor accessibility to the appropriate authorities for further action.

Therefore, maintaining website accessibility can protect websites from potential legal actions.

3. Affect on Website Ranking and Visibility

A website with good accessibility can certainly reach more people to visit and interact, thus increasing user retention and time spent on the website.

Moreover, proper implementation of accessibility can assist search engines in better understanding the content within the website and enhance the likelihood of accurate indexing. Ultimately, accessibility can contribute to improved rankings, search engine visibility, expanded user base, and increased organic traffic to the website.

About WCAG

The widely used standards or guidelines to ensure website accessibility are the Web Content Accessibility Guidelines (WCAG). WCAG is a set of guidelines developed by the World Wide Web Consortium (W3C) to assist web developers and designers in building websites accessible to everyone.

Based on the date of this writing, the latest version of WCAG is WCAG 2.1. WCAG 2.1 was published by the W3C in 2018 as an extension of the previous WCAG 2.0. This version introduced several new guidelines that better accommodate a broader range of accessibility needs, including those of users with cognitive disabilities and users on mobile devices.

WCAG has three levels of requirements, which are as follows.

1. Level A

This level is the basic level that focuses on the most fundamental and essential accessibility issues. If a website meets the requirements at Level A, it provides basic accessibility to users with certain types of disabilities.

2. Level AA

This is the intermediate level that expands on the previous level. If a website meets the Level AA requirements, it can provide broader accessibility to users with various types of impairments. Most websites implement the requirements at this level.

3. Level AAA

This is the highest level that contains the strictest requirements for accessibility. Websites that meet the Level AAA requirements provide excellent and inclusive accessibility.

The chosen level of compliance depends on the needs and goals of the organization, as well as the applicable legal requirements.

WCAG Principles

WCAG provides detailed technical guidelines, consisting of 12-13 guidelines, on how to develop accessible web content. These guidelines are based on the following four fundamental principles:

1. Perceivable

This principle is related to the users' ability to access all the content presented on a website. This can be achieved by providing alternatives for non-text content, such as relevant image descriptions or transcripts for audio or video content. Content should also have sufficient color contrast to be easily readable by all users, including those with visual impairments.

2. Operable

This principle focuses on the user's ability to interact with the website and use its functionality. The website should be operable using various input devices, such as a keyboard or alternative pointing devices. Clear and consistent navigation should be provided so that users can easily navigate and move between elements.

3. Understandable

This principle relates to the users' understanding of the information and functions presented on the website. Clear and simple language should be used, avoiding the use of ambiguous or difficult-to-understand terms or phrases. Instructions and error messages should be clear and provide appropriate guidance to the users.

4. Robust

This principle is about the website's ability to function well across different technologies and devices. The website should be designed using standard technologies and comply with established syntax rules. Thus, the website can be accessed and used effectively on various devices, including assistive devices or assistive technologies.

How to Improve Website Accessibility

WCAG provides specific guidelines for each of the four principles mentioned above that you can implement immediately.

Perceivable Guidelines

1. Alternative text for non-text elements (images, audio, video, etc.)

The alternative text serves to provide relevant and adequate information to users who cannot see or hear that content. This is useful for users relying on assistive technology, such as screen readers.

Example of an image element without alt text:

<img src="/asset/img/seo-activity-at-cmlabs-env.jpg" />

Example of poor alt text that uses repetitive keywords:

<img src="/asset/img/seo-activity-at-cmlabs-env.jpg" alt="cmlabs cmlabs malang cmlabs indonesia cmlabs" />

Example of good alt text:

<img src="/asset/img/seo-activity-at-cmlabs-env.jpg" alt="cmlabs help companies to get a closer look at SEO Marketing" />

Text transcripts for time-based media (videos)

Text transcripts are written versions of the audio content in a video that aim to convey dialogue, narration, or other important information. By providing accurate text transcripts, users with hearing impairments can obtain the same information as users who can directly hear.

3. The sufficient color contrast between the text and background

Having adequate color contrast between text and background is important as it enhances text readability. Low contrast combinations, such as pale text on a bright background or vice versa, can make text difficult to read.

4. Semantic HTML markup

Using HTML elements appropriately according to their purpose and content will help search engines understand the structure and meaning of the presented content, as well as assistive technology users in navigating and understanding the website.

Operable Guidelines

1. Keyboard accessibility

Ensuring that all interactive elements on the website, such as navigation, forms, buttons, and other elements, can be accessed and operated using keyboard keys can facilitate users who prefer keyboard-only interactions on the website.

2. Avoiding flashing elements

Limiting the speed or providing warning indicators on elements that have flashing effects can help users who are sensitive to flashing elements on the screen, which can trigger health conditions such as photosensitive epilepsy.

3. Clear and consistent navigation

Intuitive navigation enriched with descriptive labels and a consistent layout structure on each page can facilitate users in understanding the website's structure and navigating between pages.

Understandable Guidelines

1. Clear, consistent, and easily understandable content

Using clear, simple language that can be understood by users of various literacy levels and cognitive limitations will enhance users' ability to obtain relevant information and understand the purpose of each website element.

2. Availability of clear instructions during errors

Providing error messages and recovery assistance, such as offering options to retry the process, refresh the page, and other options, can help users overcome issues and smoothly continue using the website.

3. Well-organized information structure

A comprehensive and structured information hierarchy (H1, H2, H3, and so on) will help the delivery of information so that users can quickly understand the grouping of related content.

Robust Guidelines

1. Use of valid markup and technology

Ensuring that a website uses markup (code), valid technologies, and adheres to established standards is important to make the website compatible across various devices, including assistive technologies.

Testing Accessibility

The implementation of accessibility is an iterative process that requires continuous evaluation. This allows for the timely discovery and resolution of any issues that may arise. Here are several methods to test and assess the accessibility of a website.

1. Automated Testing Tools

Various automated testing tools are available, such as Lighthouse, Wave, and AChecker. These tools can inspect the code and structure of a website and provide reports on the identified issues.

While some tools may come with a significant cost, automated testing tools offer quick results and require minimal effort.

2. Manual Testing

Manual testing is typically performed by a testing team. The team will access and navigate the website, analyzing each element to determine if it meets WCAG requirements. This method is cost-effective but can potentially be time-consuming and require significant effort.

3. Testing with Users with Disabilities

Involving the relevant users can result in accurate and authentic findings. Typically, this approach is conducted by a UX researcher through usability testing, where participants are given a series of scenarios, and their difficulties and completion times are observed.

This method can help website owners provide the best solutions for each identified issue. However, it has the potential to be time-consuming and costly.

Conclusion

Now that you understand why accessibility is important, you can prioritize it in the development of your website. Developing and maintaining good accessibility can have a significant impact on user experience, retention, and website visibility. Accessibility becomes one of the ways to consistently prioritize user comfort.

To deepen your knowledge in SEO, I invite you to join the upcoming cmlabs class, where experts will share insights and practical tips. Register now to unleash the potential of search engine optimization.