accessibility-standards

WCAG 2.1 AA compliance requires semantic HTML markup, keyboard navigation, visible focus indicators, sufficient color contrast, and assistive technology compatibility. Implement proper heading hierarchy, landmarks, skip links, and ARIA labels to satisfy accessibility requirements across all pages and components.

Semantic HTML uses native elements—like `<button>`, `<nav>`, `<main>`—to convey meaning and structure to assistive technologies. Native semantics eliminate the need for ARIA workarounds, improve keyboard operability automatically, and help screen readers announce content roles and relationships correctly.

Keyboard navigation requires logical tab order, visible focus indicators on all interactive elements, focus management in modals and dropdowns, and skip links to bypass repetitive content. Use semantic HTML elements and test with keyboard-only navigation to ensure every function is reachable without a mouse.

Use ARIA as a progressive enhancement only when native HTML elements cannot express the interaction pattern. ARIA supplements semantic HTML—it cannot replace it—and requires careful focus management, state updates, and testing with assistive technologies to avoid breaking accessibility.

Visible focus indicators help keyboard users navigate by showing the current position. Focus management in modals traps keyboard focus inside the dialog, preventing accidental navigation outside. Together they ensure users can navigate predictably and understand where they are in the interface.