- Success Criterion 1.3.4
- Conformance level AA
- W3C reference F100
Page That Just Asks Users to Rotate Their Device to Continue
1.3.4 — Orientation
Scenario
Setting
A public library's catalog search
What’s wrong
Instead of working in both orientations, the page just shows 'please rotate your device' — users who can't rotate are locked out.
Example
@media (orientation: portrait) { .app { display: none; } }Why it matters
People whose devices are mounted or who cannot rotate a display freely.
How to test
Rotate the device: if instead of adapting, the app shows a 'please rotate your device' blocking message, it fails.
How to fix
Support both orientations instead of asking the user to rotate. /* Layout adapts with responsive CSS in both orientations instead of blocking one */ Content must work in both portrait and landscape unless a specific orientation is essential.
Outcome
On a public library's catalog search, this barrier is gone for people whose devices are mounted or who cannot rotate a display freely — they reach the same outcome without extra effort.
Who is affected
People whose devices are mounted or who cannot rotate a display freely.
Learn more
- Understanding Understanding document (opens in a new tab)
- Technique Related technique (opens in a new tab)
Related scenarios
- App Locked Into One Screen Orientation With No Real Reason
- Screen Orientation Locked in Code With No Essential Justification
- App Manifest Locking Orientation for Ordinary, General Content
- CSS That Hides or Breaks Content in One Orientation Only
- Critical Controls Cropped or Unusable in One Orientation
- Video Player Forcing Landscape Fullscreen for Ordinary Content