OnlineCBT Logo OnlineCBT
HTML Tutorial
HTML · LESSON 56

Accessibility (ARIA Basics)

By Ratan Updated: 16 Oct 2026

Build inclusive websites using Accessible Rich Internet Applications (ARIA) roles, states, and labels.

Level: Beginner to Advanced
Duration: ~60 Mins Deep-Dive

1. What is Web Accessibility (A11y) & ARIA?

Accessibility (A11y) ensures that digital tools are usable by all individuals, including people with vision, motor, cognitive, or auditory disabilities. WAI-ARIA (Web Accessibility Initiative - Accessible Rich Internet Applications) defines special attributes that supplement HTML when native elements cannot convey necessary screen reader information.

2. The First Rule of ARIA

"If you can use a native HTML element or attribute with the semantics and behavior you require already built-in, do that instead of re-purposing an element and adding ARIA."
Use a native

3. Key ARIA Attributes

  • aria-label: Provides an explicit text description for elements with no visible text (e.g. icon-only buttons).
  • aria-hidden="true": Hides decorative icons or decorative SVGs from screen readers.
  • aria-live="polite": Informs screen readers to announce dynamic content updates (such as score updates or exam countdown warnings) without interrupting the user.
  • aria-expanded="true/false": Indicates whether an accordion or dropdown menu is open.




5 minutes remaining in examination session.

📝 Live Lesson Practice

HTML/CSS JavaScript Python C++ C PHP
⌨️ Practice Inputs (लाइव इनपुट भरें) (खाली होने पर RED, भरने पर GREEN underline)
💻 Code Editor (Monaco VS Code Engine)
👀 Live Preview
पता संपर्क करें

+91 7877547686

ई-मेल

onlinecbtportal@gmail.com

हेल्पलाइन नंबर

+91 7877547686


डाउनलोड करने के लिए क्लिक करें
Get it on Google Play

ऐप डाउनलोड करने
के लिए Google Play पर
उपलब्ध है

WhatsApp Chat