On Focus
Success Criterion 3.2.1 (Level A)
Question
Have you ensured that user interface components contained within your site or application do not initiate a change of context when they receive focus?
Why is this important
It is important that when receiving focus, user interface elements do not initiate a change in context or activate other elements on the page, because users need the functionality of in-focus elements to be predictable and consistent when navigating through a webpage. This is especially relevant for users with low or no vision, and users with motor impairments that are prevented from using mouse navigation.
Whom does it benefit?
Example 1:
As a person with a motor impairment
I want to navigate through elements on a web page using only the tab key
so that I can locate specific content without being disoriented by unexpected popup windows or
other content changes.
Example 2:
As a person who is blind and using a screen reader,
I want to be able to focus on components without changing their context
so that I can navigate through the page without changing the context unintentionally.
What should you do?
When designing a web page with any user interactive elements, make sure that the interface component can receive focus without being activated or causing a change in context. The user should be able to determine where the focus is located on the page but there should be no visual or behavioral modifications to the page content that would move the user to a completely new context.
How do you do it?
- Use “activate” instead of “focus” to activate user elements.
- Make sure that links don’t automatically open, forms don’t automatically submit, and no other actions occur when simply receiving focus.
- If a change in context must be implemented, provide a warning before automatically opening a new window, tab, or element.
Need technical guidance?
Technical guidance is available for implementing this Success Criterion at the Understanding Success Criterion 3.2.1 - On Focus page.