A Beginners Guide to Web Accessibility
Tags: a11y, webdev
Published: 2020-09-04 20:41:30

Making the web accessible is essential for everyone, including developers and organizations because, it means that everyone can use the products and services you create.

## What is Web Accessibility?
Web accessibility simply means building websites, tools and technologies in such a way that people with disabilities can use them.
The web is designed to work for everyone, irrespective of their hardware, language, ability or location and when this goal is met we can say that accessibility has been achieved.
However, when websites or applications, technologies or tools are built such that there is a barrier that exclude some people from using it, we can say such product failed accessibility test.

Few weeks ago,  [twitter launched a voice tweet feature](https://blog.twitter.com/en_us/topics/product/2020/your-tweet-your-voice.html) , which was met with a lot of complaints pertaining accessibility (Those with hearing impairments can't use this features and twitter created no other means for them join in the audio conversations)

{% twitter 1273306969953222660 %}

Twitter has however apologised for its slack in accessibility and as we hope they come back with a more accessible feature, it's good to understand how important this is.
Accessibility should be considered even while building, and not as an after thought.

## Considerations for Accessibility
While building, here are some disabilities accessibility encompasses which should be taken note of
* **Neurological**: People who have been affected by a brain injury that can begin during the development process
* **Cognitive**: People with limitations in mental functioning in skills such as communicating, taking care of themselves-, and social skill. There may be some things they cannot learn.
* **Visual**: Blind people, color blind or people with partial vision loss.
* **Speech**: People who are mute, have communication disorder or whose normal speech is disrupted (stuttering, lisps etc)
* **Auditory**: People with hearing impairments, deaf or partially deaf.

Web accessibility also benefits people without disabilities, for example
* People using mobile phones
* People with temporary disabilities, such as broken glasses
* People with slow internet connections


## Why is Web Accessibility Important?
* Web accessibility is important as the web and internet have become important parts of our lives. Making sure the web is accessible allows people with disabilities to be able to have equal access to the important services/features the web provides, such as education, online shopping, recreation, health services and others.
* Web accessibility ensures that everyone is carried along in trends, innovations and no one is left behind.

## Simple Ways of Making the Web Accessible
#### Use Alt Tags
```js
<img src="./images/img1" alt="description of image">
```
An alt tag is used on images to allow a description of the image to be output if the image can’t be displayed/seen. Making sure this alt-tag is as descriptive as possible will help screen readers to relay the information you are trying to portray.

#### Keyboard ShortCuts
Some users do not have access to a mouse or are unable to use a mouse.
What this means is that the only way they can get around your website is by using keyboard shortcut, hence it is important to enable them to do so.

#### Title Tags
```js
<title>A Beginners Guide to Accessibility<title/>
```

Making sure you have a short yet descriptive title tag on all pages will allow visitors to know what the page is about which is especially helpful for people using a screen reader.

#### Test your websites on mobile devices
A lot of people access websites on their phones rather than a PC. So it is important to build websites that are user friendly across both PCs and phones. To ensure a website is user friendly, you have to test it across multiple devices.

#### Provide Captions for Videos
This is helpful for those who do not have access to audio. They can understand the videos through the texts provided.

![Screenshot_20200902-164527~2.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1599061609766/mCrZ2ok55.png)

## Conclusion
We just looked at what accessibility is and how to implement it basically.
Remember to always consider accessibility during you design process and not as an afterthought.

## Other Relevant Materials on Accessibility
[Web Accessibility Initiative](https://www.w3.org/WAI/fundamentals/accessibility-intro/)

[WebAIM’s Introduction to Web Accessibility](https://webaim.org/intro/)

[a11y stands for
ACCESSIBILITY](https://www.a11yproject.com)

Enjoyed this article? Follow me on [twitter](https://twitter.com/msamarachukwu)