Skip to content
Wiki
Keyboard
On Focus and On Input

On Focus and On Input

When any user interface component receives focus, it does not initiate a change of context.

WCAG 3.2.1 (opens in a new tab)

Unexpected changes of context can be very disorienting for users, especially for those using screen readers or keyboard navigation.

A change of context is something like navigating to a new page, submitting a form, or opening a modal. These are all things that should be initiated by the user, not by the site itself.

Ensuring the site is as predictable as possible helps to allow users to navigate freely. Users shouldn't have to guess whether hovering on a link with navigate away, or if filling out a form will auto-submit, there should be clear controls and clear instructions on how to interact with the page.

Below, there's an example of a link and an input exhibiting annoying, unpredictable behaviour when focused or blurred. Tab into the iframe and note the alerts that appear when simply moving between the elements.

While this isn't exactly the most realistic scenario, it's a good example of when the concerning events can occur.

How to fix

The fix for this is to ensure that context changes are only initiated by the user, and not by the site itself.

This may mean challenging some design decisions or acceptance criteria, but it's important to make sure these things are considered.

It's not always just a pain for screen readers or other tool assisted users, but auto-submitting or auto-navigating would be frustrating to any user trying to interact with the site.

References