Web accessibility is the practice of ensuring websites are equally available to people with different capabilities so they can have equal access to the goods and services those sites provide.

It is an integral part of professional web design and development.

The World Wide Web consortium’s (W3C) web accessibility initiative defines the practice of web accessibility as making websites so people with disabilities can perceive, understand, navigate and interact with the web. They also believe that web accessibility can benefit others, including older people.

Currently, the web is present in all areas of our lives. It has become part of our everyday lives. It has made it easier for us to be educated, entertained, manage our business, shop, or even access information about the global world. The web is an increasingly important resource in many aspects of our life which includes: education, employment, government, commerce, health care and recreation. It is important that people have equal access and opportunity.

According to the CDC one out of 4 US adult have some sort of disability. A disability is any condition of the body or mind (impairment) that makes it more difficult for the person with the condition to do certain activities (activity limitation) and interact with the world around them (participation restriction).

We have different types disabilities which may include:

Auditory (deafness): common barriers include media player without caption, lack of sign language to supplement information.

Physical: often referred to as motor disabilities, physical limitations can lead to web inaccessibility. Websites without full keyboard or mouse support, ones that require time limits to complete tasks can cause issues for those with physical disabilities.

Speech: people with apraxia, cluttering and other speech disabilities often struggle with web accessibility especially when service include speech interaction. When a website only offers a phone number or voice interaction method as its contact information, those with speech disabilities are unable to fully interact with the website.

Visual: individuals with blindness, color blindness and deaf blindness especially struggle with many websites. Images without text alternatives, missing non visual cues and websites that do not offer custom color combination can be huge barriers to those with visual disability.

In many countries, it has been made legal that people with disabilities are not discriminated upon.
Those who are found guilty are punished based on the law. This has given those with disabilities to also enjoy some of the benefits enjoyed by people without disability. An accessible web can help people with disabilities participate more actively in society. It is the easiest way to do business with many people with disabilities, for instance people who cannot read print material, people who have difficulty going to a physical store or mall. They can easily get them online to be delivered to their doorstep.

In order to curb the problem faced by visitors in web accessibility, a body was formed to produce many of the standards that the web relies on and they are called W3C (World Wide Web consortium) of the web accessibility initiative (WAI). They produced a standard on how to make website accessible which was called web content accessibility guidelines (WCAG). In the United States, an act called the ADA (Americans with Disabilities) forces digital assets and websites to become accessible by law.

The WCAG guidelines explains how to make web content more accessible to people with disabilities.
Web content generally refers to the information in a web page or web application including: natural information (such as text, images and sounds), code or markup that defines structure, presentation, etc. WCAG 2.0 was published on 11 December 2008. WCAG 2.1 was established on 5 June 2018. All requirements (success criteria) from 2.0 are included in .1. The 2.0 success criteria are exactly the same (word for word) in 2.1. There are additional success criteria introduced in 2.1 that are not in 2.0. WCAG 2.1 updates WCAG 2.0 and extends W3C’s accessibility guidance, while maintaining W3C’s standard of implementable, technology neutral, objectively testable and universally applicable accessibility guidance. All new provisions have been tested in implementations across different types and websites and web content.

WCAG 2.0 was designed as a highly stable, technology agnostic standard, and has been kept relevant through updates to informative supporting resources. As with WCAG 2.0, WCAG 2.1 is supported by an extensive library of implementation techniques, educational materials, including understanding and techniques for WCAG 2.1.

WCAG has three conformance levels (A, AA, AAA). Level A criteria level addresses the most severe barriers that prevent access; level AA and AAA criteria address barriers of lesser severity. Many organizations strive for WCAG 2.0 level AA conformance for their websites.

Some problems have been discovered to be the problem of web accessibility. Some of which include: too much content, reCAPTCHA, poor legibility, distracting images and graphics, poor linking information, no alternative for image, video and audio, improper use of HTML, etc.

Making the web accessible depends on the developers building for the web. Making your website accessible to people with disabilities, will end up making it available to everyone. Some of the ways in which the web can be made accessible to everyone include: use of ALT tags, use better tables, use default HTML tags, closed captions for media.

Judging from the problems and the possible solutions given by researchers, we can see that web accessibility standards have had a lot of improvements over the years. Both those with disabilities and those without disabilities now have full access to these websites without much difficulty. Those with disabilities can now get information from various websites, do business and be entertained. This does not mean there are not still some challenges on web accessibility.

Web accessibility for disabled people is very difficult to design or provide. It tends to be more useful for people with no disability, leading to greater satisfaction, while those with disabilities are being deprived for such satisfaction due to some problems which vary on the individual and the disability. It is important that people have equal access and opportunity
Accessible sites present information through multiple sensory channels, such as sound and sight, and they allow for additional means of site navigation and interactivity beyond the typical point-and-click-interface: keyboard-based control and voice-based navigation. The combination of a multisensory approach and a multi-interactivity approach allows disabled users to access the same information as nondisabled users.

By making your website accessible, you are ensuring that all of your potential users, including people with disabilities, have a decent user experience and are able to easily access your information. By implementing accessibility best practices, you are also improving the usability of the site for all users.

Accessibility overlaps with other best practices such as mobile web design , device independence, multi-modal interaction, usability, design for older users , and search engine optimization (SEO). Case studies show that accessible websites have better search results, reduced maintenance costs, and increased audience reach, among other benefits.”

Implementing Web accessibility often results in improved technical performance under several factors. Which are;

• Reduced bandwidth use and server load,
• Cross browser compatibility,
• Prepared for implementing future technologies,
• Reduced site development and maintenance time
• Contents on different configuration enablement, such as mobile devices, screen readers, different operating systems and browsers.

Making a website accessible to people with disabilities, will end up making it accessible to everyone. This depends on the developer building the web.

A developer should put into consideration the following;

The use of Alt-tags

The alt-tag or alternative (alt) html attribute is basically used to describe an image. Of course, the (alt=” “) can be empty but it would be better to give each a helpful description for screen readers. Assuming you were blind, what would you need to know about the image? “Woman” isn’t much help, but maybe “Woman drawing design flow chart including accessibility, usability, branding, and design” with the use of screen readers would be better

Use of Better Tables

Captions should be added to tables using the caption tag in order to make them easier to understand by screen readers rather than just making the title of a table in bold text.

The “scope” element should be added and neatly label in new rows and columns so that screen readers don’t simply rattle off a series of table cells without giving any context.

Keyboard Navigation

By default, anything on the website should be something that could be conceivably carried out using a keyboard only. Which means navigation buttons shouldn’t be messed.

For instance, navigation buttons should not be animated as dropdown buttons if they can’t be used with a screen reader.

Default HTML Tags Usage

For web accessibility, the default html tags should not be messed with. Buttons should be used for buttons not anchors for buttons. Messing up with them will confuse screen readers entirely because all screen readers follow a particular way to read the elements on a web page. To make anchors work the same way as buttons it needs additional JavaScript (a programming language) event which is a very dumb approach when normal naked button can be used.

Closed Captions for Media

The videos or audio elements on the website should have captions. Closed captions are very useful not only for accessibility (permanently and temporarily disabled users) but also for users who may be using the website somewhere where they can’t play audio, such as in an office or in a noisy location.

Text transcript for podcasts or other audio elements should be provided. The text transcript will not only make it easier for Google and other search engines to index the content and help with Google ranking, but also useful for people who can’t listen to the audio.

Having captions on media files will make it accessible to disabled users which will eventually be accessible by everyone.

Use of ARIA Tag

Accessible Rich Internet Applications (ARIA) is a simple set of HTML attributes that define ways to make Web content and Web applications (especially those developed with Ajax, JavaScript and more recent web technologies like Bootstrap) more accessible to people with disabilities. For instance, ARIA enables accessible navigation landmarks, JavaScript widgets, form hints and error messages, live content updates, and more.

ARIA has a set of special accessibility HTML attributes which can be added to any markup, but is especially suited to HTML. The role attribute defines a specific role for type of object (such as an article, alert, slider or a button). Additional ARIA attributes provide other useful properties, such as a description for a form or the current width of a progress bar. ARIA attributes can also be used to specify active or disabled state for objects (especially buttons).

Title Tag

Browsers don’t always display the HTML title tag in the webpage body, but it is helpful for screen readers and tabs titles. Every website’s pages must have a descriptive but short title that tells visitors what the page is all about.

In conclusion, for a standard accessible website the following must be considered;

– 1. The user interface must be user friendly irrespective of the disability.
– 2. Functionality: The website should be accessible through mouse, keyboard and as well work with voice control system. This would allow the user to access the web using any of these functions, disability won’t be a barrier.
– 3. Headings must be used correctly to organize the structure of the content, there are different types of header, there are headers that indicate the title, headers that indicate the body, headers that indicate quoted words and many more.
– 4. Colors must be selected and used with care; in case there are users with sight issues.
– 5. Colors should as well not be used as navigational tools or sole way to differentiate items.
– 6. The website should have a skip navigation feature
– 7. The website link should have a unique and descriptive name.
– 8. If the website involves video, visual access must be provided to the audio information.
– 9. Images should include Alt text in the mark-up/code; complex images should have more extensive descriptions near the image (perhaps as a caption or descriptive summaries built right into a neighboring paragraph)
– 10. Avoid using tables for layouts; rather use it for tabular data.

Tools:

Web accessibility solution: accessiBe.com — a recent 2020 review by WebDesigenrDepot.com
Accessibility Checker: achecker.ca
Developer Tools: Google Lighthouse

Resources:
Why Web Accessibility is Important
Accessibility and SEO: Where they Overlap