Spatial navigation is the ability to navigate between focusable elements based on their position within a structured document. Spatial navigation is often called ‘directional navigation’ which enables four(4) directional navigation. Users are usually familiar with the 2-way navigation using tab key for the forward direction and shift+tab key for the backward direction, but not familiar with the 4-way navigation using arrow keys.
Regarding TV remote control, game console pad, IVI jog dial with 4-way keys, and Web accessibility, the spatial navigation has been a rising important input mechanism in several industries. If the Web can embrace the spatial navigation and effectively support the functionalities in Web engines and W3C APIs, it will be more promising technology for existing products as mentioned above and various upcoming smart devices.
In spatial navigation mode, the default behavior of arrow keys is changed from scrolling behavior to focus moving so that users can use the arrow keys to navigate between focusable elements based on their position. To support the functionalities of the spatial navigation, we could consider the following three steps:
- API for enabling the spatial navigation mode (HTML/CSS/JS)
- A heuristic algorithm for the spatial navigation in web engines
- Overriding methods on top of the heuristic algorithm
See the entry of the github repository with explainer as follows.
We’d like to incubate this proposal in WICG and discuss several issues with the relevant organizations such as TV maker, Game console maker, IVI maker, etc. The specific issues would be covered in the suitable W3C working groups (mainly CSS WG).