Blog

Keyboard Navigation and Focus Management: Tab Order, :focus-visible, Skip Links, Focus Traps, inert and Roving Tabindex

For keyboard users focus must always be visible, move in a sensible order and be placed somewhere on purpose when the focused element disappears. We use Bookstore with the keyboard only and measure: the base href trap of skip links in an SPA, a sticky header hiding focus and scroll-padding, the native dialog's focus trap and focus after a deleted row, roving tabindex with native radios, and focus and page titles on route changes with the Angular router.