Blocks Navigation menu: no semantic information for nested blocks #11713
Labels
[Feature] List View
Menu item in the top toolbar to select blocks from a list of links.
[Focus] Accessibility (a11y)
Changes that impact accessibility and need corresponding review (e.g. markup changes).
[Type] Bug
An existing feature does not function as intended
When the Blocks Navigation menu displays nested blocks, it visually uses some indentation:
While the visual indication is clear, there's no semantic information or any other kind of information assistive technologies can use to communicate the blocks nesting level. Blocks are announced as if they were in a flat list.
The nesting level is an important information that needs to be communicated to all users. I'm not sure the Menu component is suitable for this purpose. While ARIA menus can have sub-menus, I;d argue the information this component conveys is closer to an ARIA tree.
On the other hand, an ARIA tree is complex to interact with. Considering the menu items should be links as proposed in #11711 I'd recommend to keep things simple and just use a navigation menu that has the ability to render nested unordered lists when necessary. The item "checked" state could be communicated simply using some screen reader text. Nested lists give us the information we need for free:
Simple example: https://www.w3.org/WAI/tutorials/page-structure/content/#nested-lists
The text was updated successfully, but these errors were encountered: