Accessibility (a11y)
WCAG compliance, ARIA, screen readers, keyboard navigation, color contrast, accessible forms — inclusive web development
Accessibility (a11y) ensures people with disabilities can use websites and applications effectively. Learn WCAG compliance, ARIA, keyboard navigation, screen reader support, color contrast, accessible forms, images, navigation, and automated testing.
Tutorials in This Section
Learning Path
flowchart LR
A[Accessibility Overview] --> B[WCAG Compliance]
B --> C[ARIA Basics]
C --> D[Keyboard Navigation]
D --> E[Screen Readers]
E --> F[Color Contrast]
F --> G[Accessible Forms]
G --> H[Accessible Images]
H --> I[Accessible Navigation]
I --> J[Accessibility Testing]
A:::current
classDef current fill:#f90,color:#fff,stroke:#333,stroke-width:2px
Built by the developers of Doda Browser, DodaZIP, and Durga Antivirus Pro.
Published Topics
Web Accessibility Overview: What Is a11y and Why It Matters
Learn web accessibility (a11y): what it is, who benefits, legal requirements like WCAG and ADA, the POUR principles, assistive technologies, and the business case for building inclusive websites.
✓ LiveWCAG 2.2 Compliance: Complete Developer Guide
Learn WCAG 2.2 compliance: conformance levels (A, AA, AAA), new success criteria, evaluating compliance with tools like WAVE and axe, and the remediation workflow for developers.
✓ LiveARIA: Accessible Rich Internet Applications Guide
Learn WAI-ARIA: roles (landmark, widget, document), states and properties (aria-label, aria-describedby, aria-expanded, aria-hidden), live regions, when to use ARIA vs native HTML, and common patterns like tabs, accordion, and modal dialogs.
✓ LiveKeyboard Navigation & Focus Management
Learn keyboard navigation: tab order (tabindex), focus styles, skip links, focus trapping in modals, roving tabindex, arrow key navigation, focus delegation, and managing focus in single-page applications.
✓ LiveScreen Readers: Testing and Support Guide
Learn screen reader testing: NVDA, JAWS, VoiceOver, TalkBack, and Orca — how they work, testing workflow, semantic HTML, alt text best practices, ARIA announcements, and common screen reader failures.
✓ LiveColor Contrast & Visual Accessibility
Learn WCAG color contrast ratios (AA: 4.5:1, AAA: 7:1), large text exemption, non-text contrast for UI components, color blindness types, contrast checking tools, and designing without relying on color alone.
✓ LiveAccessible Forms: Labels, Validation & Error Messages
Learn accessible forms: proper label associations, fieldset/legend, aria-required, aria-describedby for hints, error messages with aria-live, inline validation, CAPTCHA alternatives, and accessible form design patterns.
✓ LiveAccessible Images & Media: Alt Text, Captions & More
Learn accessible images: alt text for decorative, informative, functional, and complex images, figure/figcaption, longdesc, video captions (WebVTT), audio transcripts, animated GIFs, and lazy loading accessibility.
✓ LiveAccessible Navigation & Menus
Learn accessible navigation: landmarks (header, nav, main, footer), skip links, breadcrumbs, responsive hamburger menus, aria-current for active state, mega menus, search accessibility, pagination, and site maps.
✓ LiveAccessibility Testing: Tools, Automation & CI/CD
Learn accessibility testing: automated tools (axe-core, Lighthouse, WAVE, Pa11y), CI/CD integration (Lighthouse CI, axe GitHub Action), manual testing checklist, screen reader and keyboard testing, mobile accessibility testing, and writing automated accessibility tests with jest-axe and cypress-axe.
✓ LiveAll 10 topics in Accessibility (a11y) are published.