-
Notifications
You must be signed in to change notification settings - Fork 4.8k
Steps to make keyboard navigation usable #11581
Copy link
Copy link
Closed
Labels
[Feature] Writing FlowBlock selection, navigation, splitting, merging, deletion...Block selection, navigation, splitting, merging, deletion...[Focus] Accessibility (a11y)Changes that impact accessibility and need corresponding review (e.g. markup changes).Changes that impact accessibility and need corresponding review (e.g. markup changes).[Type] Tracking IssueTactical breakdown of efforts across the codebase and/or tied to Overview issues.Tactical breakdown of efforts across the codebase and/or tied to Overview issues.
Milestone
Metadata
Metadata
Assignees
Labels
[Feature] Writing FlowBlock selection, navigation, splitting, merging, deletion...Block selection, navigation, splitting, merging, deletion...[Focus] Accessibility (a11y)Changes that impact accessibility and need corresponding review (e.g. markup changes).Changes that impact accessibility and need corresponding review (e.g. markup changes).[Type] Tracking IssueTactical breakdown of efforts across the codebase and/or tied to Overview issues.Tactical breakdown of efforts across the codebase and/or tied to Overview issues.
Type
Fields
Give feedbackNo fields configured for issues without a type.
Opening a new issue for this since I think my issue is more general than it is technical. The premise is very simple. We can dramatically improve keyboard navigation for Gutenberg if we just fix a couple of basic things. Accessibility is a part of this, but right now it's just really hard and tiresome to navigate using the keyboard. This is primarily a usability issue.
Main keyboard navigation usecases that we need to support better:
What do we need:
Some thoughts on navigation and a11y
Navigation and screen reader accessibility go hand in hand. The way to discover what's on a page with a screen reader is simply to navigate through it's basic structure. To make a complex application accessible, we need a layered approach, where the top level structure is as simple as possible and deeper nested capabilities (like editing in a block) can be a layer underneath that. The main function of any top layer is always to provide a framework for orientation, thus navigation is a top level concern. Editing is not, even though it's the primary concern of the editor. In order to edit, it needs to be easy to navigate into editing. From a visual perspective this kind of conceptual hierarchy is actually also how a web page is processed by users. However, instead of explicit it is implicit, so there is less necessity to conceptualize it. I'm sure I'm reiterating here what others might have already expressed far more eloquently.