Screen reader
- One UI supports Screen reader, an app that reads aloud the contents on the screen, such as text, images, etc., to assist people who are visually impaired or have low vision. Contents without any text, such as images, should be provided with alternative texts to give audible feedback.
- Screen reader will read all readable elements. Elements may be navigated by swiping left or right on the screen with one finger, and double tapping will run the action.
- Each element can have up to four components for audible feedback: the status value, name, element type, and usage hint, read in that order.
- The name is mandatory. If the element has a status, that's also mandatory. Element type and Usage hints are not mandatory, and users can turn them off in accessibility settings.
Mandatory
Current status value
- Indicates the current status value of the element, such as On or Off.
e.g., On or Off / Selected or Not selected / Checked or Not checked / Collapsed or Expanded
Name
- Reads the text as seen on screen or reads pre-defined alternative text. Additional descriptions must be provided to distinguish order, location, etc.
Optional (Setting On/Off)
Element type
- Audible feedback will be automatic, based on the interaction type.
Usage hint
- Informs you of actions to take based on the interaction type. Screen Reader will read the default text, and you may edit the default text if you require a detailed explanation.
e.g., Double tap to activate / Double tap to toggle / Double tap to select
Principle 1
- Provide clear, short alternative text for non-text elements. Don't include the current status value or element type in the alternative text.
Principle 2
- Alternative text is not necessary for text, non-focused images, auxiliary images with descriptions, or CAPTCHAs.
|
|
|
|
|
Principle 3
- Text included within an image will be read aloud as is.
|
|
|
Principle 4
- Make sure that alternative text is written so that it can be understood independently of any visual references. For example, "New content available" is better than just "New".
|
|
|
Principle 5
- Provide clear descriptions of emojis, GIFs, and stickers.
|
|
|
Principle 6
- The screen reader provides audible feedback for impending actions, transitions, and results of actions. For example, let the user know when a checkbox is checked or unchecked, a slider control is adjusted, or a pop-up is shown.
# | Action | Screen reader |
---|---|---|
1 | _feature A_Double tap to active, Double tap and hold to long press |
- |
2 | Started dragging item at position %d | Explaining action to perform |
3 | Now at position %d | Explaining changing status |
4 | Item dropped into position %d | Explaining action result |
# | Action | Screen reader |
---|---|---|
1 | When checkbox is checked / unchecked | Checked |
Not checked | ||
2 | When radio button is selected | Selected |
3 | When switch is turned On/Off | On |
Off | ||
4 | When slider is adjusted | %d percent |
5 | When list is collapsed/expanded | Collapsed |
Expanded | ||
6 | When popup is provided | Alert |
7 | When actionable item is dimmed | Disabled |
8 | When dragging item to reorder | Started dragging item at position %d |
9 | When dropping item to reorder | Item dropped into position %d |
10 | When item is added/deleted | (%s or %d item(s)) added |
(%s or %d item(s)) deleted | ||
11 | When item is shown/hidden | Shown |
Hidden | ||
12 | When tab is selected | Tab %1$d of %2$d |
13 | When item(s) is(are) selected | %d item(s) selected |
14 | When nothing is selected | No %s selected |
15 | When screen rotation happens | Landscape view, Portrait view |
16 | When converting to Flex mode view | Flex mode view |