Skip to content

Editor Welcome Tour: Improve keyboard interaction #56054

Open

Description

What

Improve focus when interacting with the tour via tab + space/enter keys to navigate.
An alternative here would be to show a static text (eg: 3/8) instead of the navigation dots

Why

Currently navigating the tour contents via tabbing feels cumbersome and requires many key presses to reach the various controls. Navigating by clicking the little dots or using the "Next" button throws the user back to the top, and they'd need to traverse all the focusable elements to continue. See the gif below, trying to progress through the slides via tab + space/enter.

p.s. we are improving keyboard navigation via the use of left/right arrow keys in a separate issue. This is in addition.

Kapture 2021-09-07 at 12 35 16

How

There are potentially a couple of ways to approach this, and some investigation may be worth it. A couple of pointers to guide the work a bit ( props to @razvanpapadopol ):

  • Some official W3C documentation on video carousels that deal with similar concepts: https://www.w3.org/TR/wai-aria-practices-1.1/#_video-carousel
  • Ideally, if some element is clickable with a mouse, they should be able to select it also using the keyboard. So it might mean implementing either a tabs pattern or a buttons pattern for the little dots.
  • Let's also check out the Gutenberg guides and their accessibility to see if there's anything there we can refer to.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions