Design Windows Store apps that users can interact with through a hardware keyboard, the On-Screen Keyboard, or the touch keyboard.
This topic describes design considerations for keyboard interactions. For information about the implementation of keyboard interactions, see Responding to keyboard input.
Keyboard input is an important part of the overall user interaction experience for Windows Store apps. The keyboard is indispensable to people with certain disabilities or users who just consider it a more efficient way to interact with an app.
A well-designed keyboard UI is an important aspect of software accessibility. It enables users with vision impairments or who have certain motor disabilities to navigate an app and interact with its features. Such users might be unable to operate a mouse and instead rely on various assistive technologies such as keyboard enhancement tools, on-screen keyboards, screen enlargers, screen readers, and voice input utilities.
The most common type of keyboard is the external, hardware keyboard that is physically connected to a device. In addition to a hardware keyboard, Windows provides two software keyboards:
- The On-Screen Keyboard is a visual, software keyboard that you can use instead of the physical keyboard to type and enter data using touch, mouse, pen/stylus or other pointing device (a touch screen is not required). The On-Screen Keyboard is provided for systems that don't have a physical keyboard, or for users whose mobility impairments prevent them from using traditional physical input devices. The On-Screen Keyboard emulates most, if not all, the functionality of a hardware keyboard.
- The touch keyboard is a visual, software keyboard used for text entry with touch input. The touch keyboard is not a replacement for the On-Screen Keyboard as it is used for text input only (it doesn't emulate the hardware keyboard) and appears only when a text field or other editable text control gets focus.
Note the On-Screen Keyboard has priority over the touch keyboard, which won't be shown if the On-Screen Keyboard is present.
Here are examples of the touch keyboard. The first image is the default layout, the second is the thumb layout (which might not be available in all languages).
Users should be able to accomplish all tasks supported by your app using only the hardware keyboard or the On-Screen Keyboard.
Note The touch keyboard is used for text input only, not for app or system commands.
To ensure a consistent and dependable experience for users, we recommend the following standard keyboard command patterns. The three following tables list frequently used keyboard commands. For a complete list of keyboard commands, see Windows Keyboard Shortcut Keys.
|Back||Alt+Left or the back button on special keyboards|
|Cancel or Escape from current mode||Esc|
|Move through items in a list||Arrow key (Left, Right, Up, Down)|
|Jump to next list of items||Ctrl+Left|
|Semantic zoom||Ctrl++ or Ctrl+-|
|Jump to a named item in a collection||Start typing item name|
|Next page||Page Up, Page Down or Spacebar|
|Open app bar||Windows+Z|
|Activate or Navigate into an item||Enter|
|Continuously select||Shift+Arrow key|
|Pin an item||Ctrl+Shift+1|
|Open address (for example, a URL in Internet Explorer)||Ctrl+L or Alt+D|
Media navigation commands
Note: The media navigation key commands for Play/Pause and Next item are the same as the key commands for Print and Find, respectively. Common commands should take priority over media navigation commands. For example, if an app supports both plays media and prints, the key command Ctrl+P should print.
- When your app starts, set initial keyboard focus on the element that users will intuitively (or most likely) interact with first.
- In an app with few elements, allow the Tab key to move keyboard focus to the next individual element in a collection or list. If an app has many elements, allow the Tab key to shift keyboard focus from one group of elements to the following group.
- Use the Shift+Tab key command to move keyboard focus in reverse order.
- Use arrow keys to predictably move forward and backward through app content, except when used in reading apps. When presenting content for reading, allow arrow keys to scroll page by page through content.
- Allow the Enter key to activate all the selected items in a collection or list.
- Allow users to temporarily disable automatic selection by continuously holding down the Ctrl key. While automatic selection is disabled, enable the spacebar to explicitly select and deselect items.
- Ensure that keyboard focus is visible on the first element in a new surface when the surface is opened with a keyboard.
- Let users dismiss a surface with the Esc key. Return visible keyboard focus to the point from which the surface was opened.
- Use focus rectangles only with keyboard interactions. If the user initiates a touch interaction, make the keyboard UI gradually fade away. This keeps the UI clean and uncluttered.
- Don't display visual feedback if an element doesn't support interaction (such as static text).
- Display visual feedback concurrently for all elements that represent the same input target.
- Provide on-screen buttons (such as + and -) as hints for emulating touch-based manipulations such as panning, rotating, zooming, and so on.
For more general guidance on visual feedback, see Guidelines for visual feedback.
Build date: 11/16/2013