CSS Media queries are not used to lock display orientation

Rule ID: css-orientation-lock
User Impact: Serious
WCAG: 1.3.4

Compliance Data & Impact

User Impact

Disabilities Affected

  • Attention Deficit
  • Dyslexia
  • Sighted Keyboard Users
  • Low Vision
  • Mobility
  • Cognitive

Requirement(s)

  • WCAG 2.0 (AA): SHOULD

WCAG Success Criteria

  • 1.3.4 Orientation

Section 508 Guidelines

  • Not specified, or not applicable

Rule Description

The screen orientation (e.g. portrait or landscape) of mobile applications should not be locked in one mode. Users should be able to change the orientation of their device between portrait and landscape with the page adjusting accordingly in order to remain understandable. Also, when opening a page, it should display in the user’s current orientation.

Why it Matters

Assistive technology users may be unable to access orientation features with their devices or assistive technologies.

How to Fix the Problem

Do not use CSS or other techniques to lock device orientation. Test content orientation views to ensure that content continues to be accessible to all users, including assistive technology users, in any orientation.

The Algorithm (in simple terms)

Content does not restrict its view and operation to a single display orientation, such as portrait or landscape, unless a specific display orientation is essential.