What is Web Accessibility | Learn Web Accessibility: Beginner to Advance | #1 | Anuj Singla Hindi
Anuj Singla Anuj Singla
2.23K subscribers
8,052 views
0

 Published On Dec 26, 2022

What is Web Accessibility | Learn Web Accessibility: Beginner to Advance | #1 | Anuj Singla Hindi

In this video, I will explain What is Web accessibility and how it is beneficial for disabled people? Web accessibility means anybody with disabilities or without disabilities can access the web application. The web is an increasingly important resource in many aspects of life: government information, education resources, news, and many more. So we should make the web accessible to provide equal access and equal opportunity to people with disabilities.
Accessibility is a team effort, so we need equal efforts from all team members like designers, developers, QA, Program team.

GitHub project: https://github.com/anujsingla/webacce...

⏰ Timecodes ⏰
0:00 Introduction
01:27 What we will learn from this playlist
03:27 What are Web Accessibility and benefits
12:27 What are the important points for Web Accessibility
14:57 Tab focus on websites
16:07 How blind and deaf users access the web: Digital Braille display
20:07 How to use a screen reader
24:07 Conclusion

- web access with disabilities images
https://www.google.com/search?q=web+a...

The first step is to understand how people with disabilities use the web.
How blind people use a screen reader to interact with the web.
How people use the joystick to interact with the web
Mouth stick
Some people use a text-to-speech app

Some people think accessibility is just a checklist.
Digital information is accessible and well-coded.

Important points:
- The page title is very important because we have multiple tabs open. It helps
to understand where on the web they are.

- Properly heading structure (h1, h2, h3 - h6) of the page. It helps to
understand the format of the information.

- Link text is very important. We should not use links with ("learn more", "click here")
or shortcut text.
We use "Signup for the family plan" and "more information for the family plan."

- Alt text is important for the image to understand it.
- List items properly align.
- Captions make video accessible.
- Provide proper space, font size, color contrast.
- Web focus is clearly visible, like button focus, and link focus.

How blind and deaf users access web: Digital Braille display
   • Refreshable Braille Display and the iPad  
https://en.wikipedia.org/wiki/Refresh...

Screens Reader example -    • Screen Reader Demo for Digital Access...  

- Deaf and sighted,low hearing, hard to hear disability users:
Captions and Transcripts for video and audio information

- Vision decline due to aging (Parents) - People zoom to read the text.

- Screen magnification to navigate the web.
   • Screen Magnification and the Web  

- eslint-plugin-jsx-a11y eslint plugin to add accessibility check directly
in your JSX.

- @axe-core/react It catches any issues on the final rendered DOM and shows an error in the chrome dev tools console.

WCAG categorized guidelines into three levels that represent the importance
of each guideline:
- Level A: Must be done, or some group cannot access the content.
- Level AA: Should be done, or some groups will have difficulty accessing the
content.
- Level AAA: Can be done to improve usability or enhance accessibility further.

Resources:
https://www.w3.org/WAI/standards-guid...
https://www.a11yproject.com/
https://developer.mozilla.org/en-US/d...
https://developer.mozilla.org/en-US/d...
https://reactjs.org/docs/accessibilit...

Support my channel:
https://www.buymeacoffee.com/anujsingla

(Free Courses)
React course :- https://bit.ly/3qXnSYU
Javascript course :- https://bit.ly/3qYCG9u
Typescript course :- https://bit.ly/3qY9Fe6
Frontend Interview Questions and Answer -    • Frontend Interview Questions and Answer  
HTML Tutorial for Beginners to advance -    • HTML Tutorial for Beginners to advance  
NPM -    • NPM  
Remix run React framework Tutorial in Hindi -    • Remix run React framework Tutorial in...  

(Social Media Links)
Twitter :   / singla387  
Facebook page : https://bit.ly/3nZlyyx
Telegram : https://bit.ly/3nX2v8f
LinkedIn : https://bit.ly/3rIMt2A



About Me:-
I am Anuj Singla, and working as a Principal Software Engineer at Redhat. At Redhat, I spend most of my days writing code. I am working on different technologies like React, Angular, JavaScript, NodeJs, and Typescript. I want to teach web development to everybody. I am also handling meetup events for Remix India Online - https://www.meetup.com/remix-india-on...

Tags :-
#webaccessibility #w3c #anujsingla #a11y #framework #react #typescript #hindi #html #css

show more

Share/Embed