frontend / README.md

Accessibility — Senior Interview Prep

1 min read index source

Accessibility — Senior Interview Prep

Accessibility for senior fullstack interviews: not “add alt text,” but the model — WCAG/POUR, why semantic HTML carries most of the load, ARIA used correctly, focus management in SPAs, accessible forms and widgets, and a layered testing strategy. The recurring theme: native HTML first, ARIA only for gaps, and most of WCAG AA is structure + keyboard + labels.

Files

# Topic
01 WCAG and the POUR principles
02 Semantic HTML and landmarks
03 ARIA done right — roles, states, live regions
04 Keyboard and focus management (traps, restoration, SPA routing)
05 Accessible forms — labels, errors, grouping
06 Accessible components (APG patterns: dialog, tabs, combobox)
07 Testing accessibility — axe, RTL roles, manual passes

How an interviewer probes accessibility

  • “How do you make a custom dropdown accessible?” — role/state + keyboard + focus + announcement, or “use Radix/React Aria and verify against APG.” See 06.
  • “<div onClick> vs <button> — why does it matter?” — focus, keyboard, role for free. See 02.
  • “When do you use ARIA?” — only when native HTML can’t express it; first rule of ARIA. See 03.
  • “A modal closes — where does focus go?” — restore to the trigger; trap while open; inert background. See 04.
  • “How do you test a11y?” — axe in CI catches ~a third; the rest is keyboard + screen-reader. See 07.

Cross-references