Proposed SC Orientation
Success Criteria
Orientation: Content is not locked to a specific orientation, and functionality of the content is operable in all orientations, except where orientation is essential for use of the content.
Suggestion for Priority Level
Level AA
Related Glossary additions or changes
- Essential
- A particular presentation of content is essential to the information being conveyed. (WCAG 2.0 Definition)
Examples of essential- banking site where a check deposit has to be in a certain orientation
- piano app in landscape mode
Associated Principle and Guideline or Proposal for New Guideline
Principle 2: Operable
New Guideline: Make content usable in device orientations.
Success Criteria Intent
Some mobile applications automatically set the screen to a particular display orientation (landscape or portrait) and expect that users will respond by rotating the mobile device to match. However, some users have their mobile devices mounted in a fixed orientation (e.g. on the arm of a power wheelchair). Therefore, mobile applications need to support both orientations by making sure content and functionality is available in each orientation. While the order of content and method of functionality may have differences such as exposed by a widget that expands or collapses or discloses content and functionality differently than another view. When a particular orientation is essential, the user needs to be advised of the orientation requirements.
Examples of problems
- Banking website locked in portrait mode
- iOS home screen on the iPhone vs. iPad
User Benefits
- Users with dexterity impairments, who have a mounted mobile device will be able to use the content in their fixed orientation
Test Procedure
- Turn the device into portrait orientation.
- Turn the device into landscape orientation
- Check all content and functionality is available in both orientations.
- In situations where an on-screen keyboard may be used, the on-screen keyobard should be displayed to ensure that content and functionality is not blocked in different orientations.
- Note: the content does not need to be in the same order for different orientation. It does need to meet SC 1.3.2 and SC 2.4.3 and be in a meaningful sequence.
Techniques
- Technique: Using CSS to set the orientation to allow both landscape and portrait.
- Technique: Use of show/hide controls to allow access to content in different orientations
- Technique: Use of the flexible box model to change the meaningful sequence order of content to match the visual order in different orientations.
- Failure: locking the orientation
- Failure: Functionality that is only available in one orientation.