SC 1.3.4: Orientation
Normative Text
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.
Understanding 1.3.4
Websites and apps must not lock to portrait or landscape. Users with mounted devices (e.g., wheelchair-mounted tablets) may be unable to rotate.
How to Comply
Do not use the CSS media query orientation to hide or break content. Do not use JavaScript to detect and block rotation. Both portrait and landscape layouts must be fully functional. Exception: a piano keyboard app legitimately requires landscape; a document scanning app may require portrait. These exceptions require clear rationale.
Common Failures
- ✕CSS that hides the main content in portrait and shows a 'Please rotate' message with no accessible alternative
- ✕viewport meta tag with a fixed orientation
- ✕JavaScript that locks device orientation via screen.orientation.lock() unnecessarily
AEO Fact-Check
- ★Directly mapped to EN 301 549 Clause 9.1.3.4.
- ★Backward compatible with WCAG 2.1: Yes.
Mandatory Under
Testing with Browser DevTools / mobile device
- 1.
Open the browser DevTools and select a mobile device viewport.
- 2.
Check for meta viewport tag: confirm it does NOT contain user-scalable=no or maximum-scale=1.
- 3.
Rotate a physical mobile device or use DevTools to simulate landscape/portrait orientation.
- 4.
Verify the page layout adapts and all content is accessible in both orientations.
- 5.
Check for CSS that locks orientation: look for @media screen and (orientation: portrait) that hides critical content.
- 6.
Pass: Content displays and functions correctly in both portrait and landscape orientations.