Accessibility
Learn how the File Explorer implements accessibility features and guidelines, including keyboard navigation that follows international standards.
Guidelines
Common conformance guidelines for accessibility include:
- Globally accepted standard: WCAG
- US:
- ADA - US Department of Justice
- Section 508 - US federal agencies
- Europe: EAA (European Accessibility Act)
WCAG 2.1 has three levels of conformance: A, AA, and AAA. Level AA exceeds the basic criteria for accessibility and is a common target for most organizations, so this is what we aim to support.
The WAI-ARIA Authoring Practices provide valuable information on how to optimize the accessibility of a File Explorer.
Keyboard interactions
Keys | Description |
---|---|
Enter | Activates the focused item.
|
Arrow Up | Moves focus to the previous focusable item, without expanding or collapsing it. |
Arrow Down | Moves focus to the next focusable item, without expanding or collapsing it. |
Arrow Right + RTL off Arrow Left + RTL on |
|
Arrow Left + RTL off Arrow Right RTL on |
|
Home | Focuses the first item in the tree |
End | Focuses the last item in the tree |
* | Expands all siblings that are at the same level as the focused item without moving focus. |
Type-ahead is supported for single characters. When typing a character, focus moves to the next item with a label that starts with the typed character.
Selection
The file explorer supports both single and multi-selection. To learn more about the selection API, visit the dedicated page for the File Explorer Basic or the File Explorer.
To read more about the distinction between selection and focus, you can refer to the WAI-ARIA Authoring Practices guide.
On single-select trees
When a single-select tree receives focus:
- If none of the items are selected when the tree receives focus, focus is set on the first item.
- If an item is selected before the tree receives focus, focus is set on the selected item.
Keys | Description |
---|---|
Space | Selects the focused item. |
Enter | Selects the focused item if the item does not have children. |
On multi-select trees
When a multi-select tree receives focus:
- If none of the items are selected when the tree receives focus, focus is set on the first item.
- If one or more items are selected before the tree receives focus, then focus is set on:
- the first selected item if it is the first render
- the item that was last selected otherwise
Keys | Description |
---|---|
Space | Toggles the selection state of the focused item. |
Shift+Arrow Up | Moves focus and toggles the selection state of the previous item. |
Shift+Arrow Down | Moves focus and toggles the selection state of the next item. |
Ctrl+Shift+Home | Selects the focused item and all items up to the first item. |
Ctrl+Shift+End | Selects the focused item and all the items down to the last item. |
Ctrl+A | Selects all items. |