Building Accessible Web Apps (a11y)

Accessibility isn't just a "Nice to have." For enterprise and government apps, it is a Legal Requirement. Beyond that, it is simply good engineering. An accessible app works better for everyone, including users on mobile or with slow connections.

1. Semantic HTML

The most important rule of a11y: **Use the right tag for the job**. Don't use a <div> with an onClick when you should use a <button>. Screen readers understand semantic tags automatically, but they struggle with non-semantic "Div-soup."

2. ARIA Roles & Attributes

When standard HTML isn't enough (e.g., a complex custom slider), use **ARIA (Accessible Rich Internet Applications)**. aria-label, aria-live, and role="tablist" bridge the gap between custom JS components and screen readers.

4. Interview Mastery

Q: "How do you test for accessibility in your CI/CD pipeline?"

Architect Answer: "I use a multi-layered approach. 1) **ESLint-plugin-jsx-a11y** to catch errors during coding. 2) **Axe-core** integrated into Playwright/Cypress tests to scan for WCAG violations automatically correctly. 3) **Manual testing** with a screen reader (like VoiceOver or NVDA) and keyboard navigation. Automated tools only catch about 40% of issues; manual verification is non-negotiable."