- What is focus outline?
- Should I use focus or focus-visible?
- What elements should be focusable?
- What is the purpose of testing for 2.4 7 focus-visible?
What is focus outline?
Focus outline provides visual feedback for users who can't use a mouse, or have visual impairment, when using Tab on their keyboard for navigation. example.css. /* 🚫 don't do this */ :focus outline: none;
Should I use focus or focus-visible?
Adding the :focus pseudo-class to an element will make it show a focus specific styles and disregard browsers heuristics. The :focus-visible , in contrast, applies custom styling only if it would be shown natively. It's a win-win situation, a nice custom look and years of research in one CSS property.
What elements should be focusable?
Elements of the following type are focusable if they are not disabled: input , select , textarea , button , and object . Anchors are focusable if they have an href or tabindex attribute. area elements are focusable if they are inside a named map, have an href attribute, and there is a visible image using the map.
What is the purpose of testing for 2.4 7 focus-visible?
The purpose of this success criterion is to help a person know which element has the keyboard focus. “Mode of operation” accounts for user agents which may not always show a focus indicator, or only show the focus indicator when the keyboard is used.