Focus marks the keyboard's current location, independent of pointer position
Aliases: focus state · keyboard navigation · pointer independence · active element
What it is
Keyboard focus is the element, or position inside a composite, that receives keyboard commands. Tab, arrow keys, scripts, and component rules move it; it is not inherently tied to where a mouse pointer rests. The pointer can hover a link while Enter activates a different focused button, and moving a mouse to a screen corner does not remove focus from a form field. Conflating them leaves people unable to tell where a next keypress acts and makes mouse–keyboard switching unpredictable.
Why it happens
The pointer supplies continuous spatial position; focus supplies a discrete command target. They are independent because people may browse with a mouse and type by keyboard, or navigate entirely through focus without a pointer. If hover styling covers focus, a passing pointer hides the real keyboard target; if focus jumps with the mouse, keyboard paths break. Separately visible states allow people to know both “what I am inspecting” and “what a key will affect.”
Studying it
Use mixed-input tasks: sweep over items with a mouse, then continue with keyboard without clicking; alternate pointer and Tab/arrows in forms, menus, tables, and dialogs. Measure prediction of Enter, Space, and arrow targets, accidental activation, and switching to mouse to recover focus. Include script updates, focus after click, and hover layers, because static screenshots cannot expose simultaneous-state interpretation.
Where it stops holding
A click may appropriately move focus to the clicked control; that is a state transition, not evidence that focus equals pointer position. Touch lacks hover, and voice or screen-reader focus differs, so desktop pointer behavior cannot be the only model. Decorative or display-only elements should not receive focus appearance. Focus changes must follow explicit input or program logic and remain visible.
Applying it
- Specify hover and focus triggers, lifetimes, and styles separately; when concurrent on one element, each must remain intelligible.
- Do not move keyboard focus on pointer passage unless a user clicks or a component has a clear, predictable activation rule.
- Give focus an independent visible cue that remains distinguishable through pointer movement, tooltips, and scrolling.
- Validate with mouse–keyboard alternation: users should name the element Enter will operate without clicking; wrong answers mean the states were merged incorrectly.