-
Type: Improvement
-
Status: Open
-
Priority: Major
-
Resolution: Unresolved
-
Affects Version/s: 3.0.15
-
Fix Version/s: None
-
Component/s: A11y
-
Epic Link:
-
Tags:
Currently, focus order goes from browser actions to main content (right side of the screen) then to the drawer (left side of the screen).
Focus order should go from left to right, with drawer first.
_____________________________
Keyboard focus order is not logical in such a way that it affects the meaning or operability of the content.
Element Name:
Left navigation region
header
main content region
Location of the element: Present on the page
Additional details:
Current focus order:
header>main region> left navigation
Expected focus order:
Header> Left nav region> Main region
Recommendation to fix
RULE :
The reading and navigation order MUST be logical and intuitive.
HOW TO FIX:
Fix this issue by ensuring the DOM order is logical so that the focus order will naturally follow. Do not use positive tabindex values to "correct" the tab order as it will not change the reading order for screen reader users and will almost always cause unintended, significant problems.
REFERENCE:
Deque University: https://dequeuniversity.com/class/input-methods2/keyboard-input/tab-order
BACKGROUND:
When keyboard focusable components do not receive focus in a logical order, people with mobility impairments, reading disabilities, and low vision are all impacted. The keyboard focus order must be logical and consistent with the layout of the content. (Note: This does not mean that the focus order has to be identical to the visual order, as long as the user can still understand and operate the content.) A logical focus order makes interaction with content predictable for people who rely on a keyboard to interact with a web content.