Accessibility

A text alternative for every image: informative images convey the same information, decorative images get empty alt so readers skip them, functional images describe the action rather than the pixels. Screen-reader users, users on failed image loads and search engines all lean on this one line.

A reserved region on the page that speaks dynamic updates to screen readers without moving focus. Saved states, result counts, async validation — the "it changed on screen but focus didn't move" class of news that blind users simply miss without it.

A visible outline marking the currently focused element, so users know where the next keystroke will land. Pointer users rarely need it, but keyboard and assistive-tech users must always see focus or they are operating blind. Usually driven by :focus-visible — shown for keyboard focus, silent for mouse clicks.

Make every feature operable by keyboard alone: Tab/Shift+Tab move focus in a sane order, composite widgets roam with arrow keys over a roving tabindex, Escape dismisses overlays and returns focus. The full focus discipline beyond the focus ring, codified in the ARIA APG.

Honour the OS "reduce motion" preference by demoting large translations, zooms and parallax to a plain fade or no motion at all. Large motion can trigger nausea and vertigo in vestibular-sensitive users — a health risk, not a taste question. WCAG 2.3.3 requires non-essential animation to be disable-able.

The first focusable element on the page — usually a visually hidden link. Keyboard users meet it on the first Tab, activate it, and land straight in the main content without walking every nav link. The mandatory escape hatch on nav-heavy sites; WCAG calls it "bypass blocks".