Shape
Focus Management
Controlling where keyboard focus goes after something changes on screen.
What is Focus Management?
Controlling where keyboard focus goes after something changes on screen.
What you learn
After anything changes, put focus where people will continue.
When it helps
focus disappears after a dialog closes, or lands somewhere unexpected.
Use it at work
- List every change: dialogs, deletions and new content.
- Decide where focus should go after each.
- Move focus there, and keep it visible.
- Test each change with a keyboard.
Your output
Open and close every dialog in your product with the keyboard. Check where focus lands each time.
Watch for
Letting focus fall back to the top of the page after a change.
Related practices
Sources
- Dialog (Modal) Pattern
- Understanding SC 2.4.3: Focus Order
- Understanding SC 2.4.11: Focus Not Obscured (Minimum)
- Understanding SC 4.1.3: Status Messages
Enable JavaScript to try the interactive activity.