Keyboard navigation — everything reachable without mouse (WCAG 2.1.1)

WCAG 2.1.1 (AA): all page functionality must be operable through a keyboard interface, without specific timing for keystrokes. Why important? People with motor impairments (Parkinson's, RSI), screen reader users (almost never use mouse), power users wanting speed. Four core components: (1) Tab order: logical + predictable — often just DOM order. Avoid tabindex >0 (disrupts natural order). (2) Visible focus: :focus style with clear outline (no outline:none without replacement!). Browser default outline is OK; custom must have 3:1 contrast. (3) Skip links: "Skip to main content" as first tab stop — visually hidden but visible on focus. Saves screen reader users from tabbing through dozens of nav links. (4) No keyboard trap: modal/dialog must close with Esc. Focus must stay within modal (focus trap with JavaScript) and return to trigger element on close. Easy test: hide your mouse for 5 minutes. Try using site only via Tab + Shift+Tab + Enter + Spacebar + arrow keys + Esc. If you get stuck = bug. Common mistakes: hamburger menu opens with click but not Enter; modal doesn't close with Esc; dropdown requires hover (pure-CSS hover menus = unreachable); carousel only works with mouse swipe; custom checkbox can't receive focus; "Read more" link is a <div onclick> instead of <a> or <button>.