a11yTips

7. What is accessibility

july 20 2020

what is accessibility logo

Today everything is available on the internet and just one click away. If we see in our lives, we won't deny that without the internet we won't be able to do our day-to-day work and also fun work such as whatsapp, facebook, twitter, tinder etc. Even to read this article you are using the internet and web.

Problem?

Unfortunately, not all the people around the globe are capable of accessing the web by using a mouse, keyboard, etc. The reason they are disabled. A disability could be - vision, speech, hear, physical. For them web could be a window for a world of unlimited information and opportunites. We should make the web accessible or them even though they are suffering from the disability.

Luckily, in the USA and other countries, web accessibility is mandatory by federal law. However, still, there are a lot of countries that are not following it. Web by default is accessible. Designer, developers, makers of website and apps need to make sure they are shipping the accessible products on the web.

Imagine if your website is only accesible by mouse and there is no way someone can access it my keyboard. Then the person who has motor disability won't be ever access your website. Similarly , if one needs to read out their username aloud to access your web application a person suffering from speech problem won't ever able to access your applciation.

So, accessibility is all about making the web accessible for the disable people.So, that they can also navigate and access the web as the non-disable person.

Accessibility is also known as a11y. The reason, there are 11 characters between a and y.

Types of disability

Majority there are:

1. Vision

People who are suffering from vision problems fall into this category. Always remember there aredifferent kinds of vision problems: color-blind, totally blind, low sight, etc. We need to make sure that irrespective of what the disability is our application should be accessible for them.

2. Hear

People who have hearing problems come under this category. Again there are different kinds of hearing issues. Similarly like Vision, we need to make sure our application is acessible for them.Eg: If there is a tutorial website then make sure to provide the transcript and captions of the videos.

3. Speech

People who have a problem in speech come under this category. Just like the vision and hear, this can also have different types of problems. We need to make sure if we have application which requires user to speak we need to provide an alternative way to do the same. Eg: all the voice assistant apps currently in the market are non-accessible by people who have speech disability.

4. Motor

People who have a problem with the movement of the hands, legs, fingers, slow response time, limited fine motor control. come under Motor disability. If your application is not accesibile by keyboard and the user is not capable of using mouse then you are blocking the information for the user.

5. Cognitive

Learning disabilities, distractibility, inability to remember or focus on large amounts of information. If there is caption asking to click images with 'trees' or what is 9 + 4 then it is going to be issue for the users.

Tools to test the accessibility?

1. Chrome Lighthouse

2. Wave

3. Axe

4. Screen readers - NVDA, Voiceover, JAWS

Basics of accessibility

1. alt tags of the images

2. Correct structure of the HTML page

3. Keyboard focus

4. Captions and subtitles of the video and audio

5. Alternatives of captions such as what is 1+1

6. Not color based messages and UI

7. Responsive

8. proper labels

10. Proper color contrast

Resources

https://webaim.org/

Go to Next Article