This success criterion is marked "at risk" in the WCAG 2.2 Candidate Recommendation. It may be removed before the specification is finalized.
|Version:||WCAG 2.2 and up|
When the keyboard focus indicator is visible, one or both of the following are true:
|Techniques:||Techniques are not yet available for WCAG 2.2 success criteria.|
The purpose of this success criterion is to ensure that the keyboard focus indicator solidly bounds or surrounds the active user interface component so that users can clearly discern it.
This success criterion is similar to 2.4.7, which requires that there be a focus indicator, but sets requirements for the focus indicator itself.
How to Meet
A custom keyboard focus indicator is created when an author restyles an element when it receives focus
(i.e., is tabbed to). The styling is typically tied to the CSS
The most direct way to meet this success criterion is to ensure that indicator fully bounds or encloses the active user interface component and has a 3:1 contrast ratio both with the pixels over which it is drawn and the pixels on either side. The indicator must additionally be a solid line (e.g., not dashed or dotted).
When it is not possible to fully enclose the component in a solid outline, authors need to ensure that the indicator meets the requirements for its length and thickness as expressed in the second requirement. Refer to the understanding document for more information about how to apply this requirement to different types of indicators.
Note that this success criterion does not apply to focus indicators implemented by the user agent.
The following knowledge base pages provide more information about how to address this success criterion for publishing content: