Improve the block multi-selection and keyboard interaction #1308
Labels
[Focus] Accessibility (a11y)
Changes that impact accessibility and need corresponding review (e.g. markup changes).
General Interface
Parts of the UI which don't fall neatly under other labels.
Currently, it is possible to select multiple blocks dragging the mouse across multiple blocks. When there's a selection, text with the number of selected blocks appears on the top left together with a "Delete" button:
The button text is expanded with an aria-label
Delete selected blocks
, that's a nice improvement. However, the button is focused by default. Any unwanted press of the Spacebar or Enter key will delete the selected blocks. Not sure this is actually a good thing, as it might produce data loss. Maybe worth considering a safer interaction.The "X" button on the right has an aria-label with a value
Clear selected blocks
. To me, that sounds like "empty the selected blocks content" while what it actually does is clearing the selection. I'd propose to improve the text to clarify the action.The text with the number of selected blocks is within a
<div>
element. Personally, in PHP or HTML I wouldn't ever put text inside a<div>
and I'd use some more semantic element. React doesn't require to always use divs. However, the whole semantics of the toolbar could be improved, as currently everything is inside a<header>
element and I'm not sure this is the best option. I'd like to propose to discuss this in the next accessibility meeting (everyone's welcome!).Other a11y issues:
I'm wondering how the blocks multi-selection should work when using a keyboard. I understand it's tricky and not even sure it should be done. Maybe the best option would be considering this feature as an advanced selection feature available to pointing devices only? Any considerations/ideas very welcome.
The selected blocks are indicated with color only. Mouse users with vision impairments might have serious troubles to identify the actual selected blocks, as the color change is very subtle. Ideally, there should be an additional indicator to highlight the selected blocks.
Not sure if the text with the number of selected blocks should be automatically announced by screen readers while it gets updated, will try to discuss this point in the next a11y meeting.
The text was updated successfully, but these errors were encountered: