Understanding SC 1.3.4: Orientation (Level AA)

In Brief

Goal

Devices can be used in any orientation.

What to do

Don't lock content to either portrait or landscape presentation.

Why it's important

Wheelchair users and others may have devices mounted in a fixed orientation.

Intent

The intent of this Success Criterion is to ensure that content displays in the orientation (portrait or landscape) preferred by the user. Some websites and applications automatically set and restrict the screen to a particular display orientation and expect that users will respond by rotating their device to match, but this can create problems. Some users have their devices mounted in a fixed orientation (e.g. on the arm of a power wheelchair). Therefore, websites and applications need to support both orientations by not restricting the orientation. Changes in content or functionality due to the size of display are not covered by this criterion which is focused on restrictions of orientation.

Historically, devices tended to have a fixed-orientation display, and all content was created to match that display orientation. Today, most handhelds and many other devices (e.g., monitors) have a hardware-level ability to dynamically adjust default display orientation based on sensor information. The goal of this Success Criterion is that authors should never restrict content's orientation, thus ensuring that it always match the device display orientation.

Locking a device to an orientation

It is important to distinguish between an author's responsibility not to restrict content to a specific orientation, and device-specific settings governing the locking of display orientation.

Many hand-held devices offer a mechanical switch or a system setting (or both) to allow the user to lock the device display to a specific orientation. Where a user decides to lock their entire device to an orientation, all applications are expected to pick up that setting and to display content accordingly.

This Success Criterion complements device "lock orientation" settings. A web page that does not restrict its display orientation will always support the system-level orientation setting, since the system setting is picked up by the user agent. Alternatively, where a device-level orientation lock is not in place, the user agent should display the page according to the orientation of the device (either its default, or the current orientation determined by any device sensors).

The exception for things considered essential is aimed at situations where the content would only be understood in a particular orientation, or where the technology restricts the possible orientations. If content is aimed at a specific environment which is only available in one orientation (such as a television) then the content can restrict the orientation. Technologies such as virtual reality use screens within goggles that cannot change orientation relative to the user's eyes.

Benefits

• Users with dexterity impairments, who have a mounted device will be able to use the content in their fixed orientation.
• Users with low-vision will be able to view content in the orientation that works best for them, for example to increase the text size by viewing content in landscape.

Examples

• Example 1: Online video site
  A video is shown in either portrait or in landscape based on the user's chosen orientation.
• Example 2: Messaging website
  A messaging website can display messages in both portrait and landscape orientations.
• Example 3: eReader web app
  An eReader web app can display the contents of a book in both portrait and landscape orientation.
• Example 4: Check deposit in banking app
  An example where orientation is essential could be a banking app that requires the device be in landscape mode to easily and accurately capture an image of a check for deposit. These paper forms are typically about twice as wide as they are high.
• Example 5: Piano app
  An example where orientation is essential could be a piano app that requires the device to be in landscape mode to allow room for enough of the piano keys to be functionally usable. Since a piano app is emulating a physical piano keyboard that needs to retain relative physical characteristics between keys, either too few keys would be available, or the keys would be much too narrow.

Related Resources

Resources are for information purposes only, no endorsement implied.

• Managing Screen Orientation
• Using Media Queries
• Media Queries for Standard Devices
• Orientation Lock
• Responsive Design for Landscape Orientation
• The Orientation Descriptor
• The Screen Orientation API

Techniques

Each numbered item in this section represents a technique or combination of techniques that the WCAG Working Group deems sufficient for meeting this Success Criterion. However, it is not necessary to use these particular techniques. For information on using other techniques, see Understanding Techniques for WCAG Success Criteria, particularly the "Other Techniques" section.

Test Rules

The following are Test Rules for certain aspects of this Success Criterion. It is not necessary to use these particular Test Rules to check for conformance with WCAG, but they are defined and approved test methods. For information on using Test Rules, see Understanding Test Rules for WCAG Success Criteria.

• Orientation of the page is not restricted using CSS transforms