What is accessibility & ARIA role means in a web application ?

Last Updated : 22 May, 2023

Accessibility in the web application: It is an idea that the technology must be equally accessible for people with and without disabilities and any barriers to accessing the web are removed.

Who is being helped when making the websites accessible?

People with visual disabilities such as low vision or color blindness, and auditory disabilities such as deafness. Cognitive disabilities can include people with hearing disabilities or those affected by seizures. Physical/Motor disabilities such as repetitive stress injuries, Amputation, and Arthritis. It can also enhance various other experiences like internet connections, and loud/busy environments.

ARIA means Accessible Rich Internet Applications. It is a set of attributes that defines ways to make web content and web applications more accessible to people with disabilities. This specifically comes in HTML 5. This is of great use for those people who are visually impaired or for those people with disabilities who want to use the internet. One way of using is through a screen reader. It speaks out what is there on the webpage. For example, Screen Reader is a free Chrome extension.

Example: Here is an example of a Screen reader of the Chrome extension

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content=
        "width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style.css" />
</head>
 
<body>
    <section class="header">
        <nav>
            <a href="/" class="logo">GeeksforGeeks</a>
            <div class="nav-links">
                <ul>
                    <li><a href="/who">who am i</a></li>
                    <li><a href="/services">services</a></li>
                    <li><a href="/contact">contact</a></li>
                </ul>
            </div>
        </nav>
    </section>
 
    <main>
        <div class="container">
            <h1>About us</h1>
            <p class="subtext">
                We provide a variety of services for you 
                to learn, thrive and also have fun! Free 
                Tutorials, Millions of Articles, Live, 
                Online and Classroom Courses ,Frequent 
                Coding Competitions, Webinars by Industry 
                Experts, Internship opportunities and
                Job Opportunities.
            </p>
 
            <h2>Read more about our services</h2>
 
            <ul>
                <li>
                    <h3>Full stack web development:</h3>
 
                    <p>
                        This course will help you to learn 
                        Full Stack Web Development using:
                        JavaScript, Webpack, React, Redux, 
                        React-Router, Hooks etc. to build 
                        Front-end and Java, Spring / Spring 
                        Boot, JPA / Hibernate, MySQL, RESTful 
                        APIs, Micro-services & related 
                        technologies to build Back-end.
                    </p>
                </li>
 
                <li>
                    <h3>Competitive Programming:</h3
                    <p>
                        Looking to be a programmer for a top 
                        company or wishing to top the charts 
                        of leading coding competitions, youve 
                        come to the right place! This live 
                        course will improve your problem-
                        solving skills so you can write 
                        reliable and optimal codes. You will 
                        be mentored by programming experts
                        and they will give you tips and 
                        tricks on which competitions to 
                        participate in and how to succeed in 
                        them!
                    </p>
                </li>
 
                <li>
                    <h3>System Design:</h3>
 
                    <p>
                        centric course in which the content 
                        has been designed in a manner that 
                        will prepare you for System Design 
                        interviews for companies like Google, 
                        Amazon, Adobe, Uber, etc. Industry 
                        experts having first-hand experience 
                        will be mentoring and guiding you 
                        throughout the duration of the course.
                    </p>
                </li>
            </ul>
        </div>
    </main>
</body>
</html>