Keyboard navigation sequences should retain the visually presented meaning and logic
Sometimes the logical sequence of the keyboard navigation breaks. This might happen, for various reasons,
when the content flow on the page is different from its visual layout in a way that changes its meaning.
The factors that might cause this situation can be absolute positioning, usage of positive
and order setting using flex/grid.
- As a rule of thumb, make sure that the logical flow of the content matches the DOM flow.
- Avoid establishing layouts based on absolute positioning.
- Avoid using positive
tabindexvalues (with the exception of "skip links").
How Users Are Affected
Screen readers read page content in a linear order, which is defined by the DOM order. Content that does not flow in a logical way (for the user to understand in sequential navigation) may confuse or disorient users when assistive technology reads the content in the wrong order.