October 30, 20251 min read
A pragmatic guide to focus management
accessibilityreact
Most accessibility bugs are not exotic. They are a focus ring that vanished into a closed modal, or a route change that dumped you back at the top of the page.
Always know where focus went
When you open a dialog, move focus into it. When you close it, send focus back to the thing that opened it. When you navigate, focus the new heading. These three habits cover most of the gap.
Never remove the outline without replacing it
A visible focus indicator is not decoration — it is how keyboard users see. If the default ring clashes with your design, restyle it. Do not delete it.
If you can navigate your whole app without a mouse, so can everyone else.