1.3.4 Orientation

1. What is the goal of this criterion?

Imagine using your tablet in a wheelchair – but it’s mounted in a fixed position. Or limited hand mobility means you can’t simply rotate your device. Suddenly a website shows the message: “Please rotate your device to landscape.” Frustrating, right?

The goal of WCAG Success Criterion 1.3.4 is that websites and apps don’t force a particular screen orientation. Portrait or landscape – the content should remain accessible and operable in both. That way everyone can decide for themselves how to hold their device without losing functions or content.

2. What exactly does it require?

In concrete terms, this Level AA criterion requires that your content doesn’t restrict its view and operation to a single display orientation. That means:

• Content must work in portrait and landscape – all content and functions remain available in both orientations.
• No orientation lock – neither in code nor through a “Please rotate your device” message that blocks the content.
• The layout may adapt – it doesn’t have to look the same in both orientations, as long as everything remains reachable.

Important: this is about the content, not the device settings. If users lock rotation on their own device, that’s their choice – your website just mustn’t make that choice for them.

Exceptions only apply when a specific orientation is essential. The W3C gives these examples:

• a bank check (for example when photographing one in a banking app),
• a piano application,
• slides for a projector or television,
• virtual reality content where the display isn’t tied to portrait or landscape.

For these exceptions, the orientation has to be genuinely indispensable to the function – a design preference isn’t enough.

3. Why does it matter for accessibility?

Imagine your tablet is mounted to your wheelchair. A website tells you: “For the best experience, please rotate your device to landscape.” But you can’t rotate it. That’s everyday life for people whose device is fixed in place.

Free choice of orientation creates accessibility because it:

• lets people with limited mobility use their devices in a fixed position without missing out on content,
• helps users with low vision choose the orientation that works for them – some need landscape for larger text,
• benefits older people who find it hard to rotate or hold devices,
• accounts for situational limitations – such as using a device one-handed or in a holder.

And it makes content more universally usable – for anyone who uses their device in a particular position, for whatever reason.

4. How to meet the criterion

Flexible orientation is largely standard in modern web design – but there are a few details worth watching:

Build flexible layouts:

• Use flexible layouts with Flexbox or CSS Grid that adapt to the available width.
• Deliberately test your website in both orientations – not just on different screen sizes.
• Make sure navigation, buttons and important content stay reachable in both orientations.

Technical implementation:

• You can use media queries such as @media (orientation: landscape) to adapt the layout – but not to hide content in one orientation or replace it with a “Please rotate” notice.
• Avoid screen.orientation.lock() and a fixed orientation in the web app manifest ("orientation") unless it’s essential.
• Make sure JavaScript features work in both orientations and that no input gets lost when the device is rotated.

Dos and don’ts:

• Do: test regularly on real devices in both orientations.
• Don’t: show messages like “Please rotate your device” that block the content – unless the orientation is essential.
• Do: make sure all controls are easy to reach in both orientations.
• Don’t: hide important functions or content in either orientation.

Native apps: don’t fix the orientation in your app configuration unless it’s essential to the function.

A related criterion is Reflow: if your content adapts cleanly to narrow widths, rotating the device rarely causes problems.

5. Why this criterion matters for businesses

Flexible orientation sounds like a nice extra – but it’s actually a mark of quality and part of the legal requirements.

1. Reach more people

With content that works in any orientation, you reach people with limited mobility, older users and anyone who holds their device a certain way for personal or situational reasons.

2. Mobile use is everyday life

For many people, smartphones and tablets are their main way onto the web. Users expect websites to work however they happen to be holding their device – and if yours doesn’t, they’ll leave quickly.

3. Fewer drop-offs

An orientation lock is an avoidable hurdle in the middle of a task, such as checkout. Leaving it out removes an unnecessary reason for users to give up.

And then there’s the law: since 28 June 2025, the European Accessibility Act has applied to many consumer products and services, including apps used for e-commerce; Germany implements it through the Barrierefreiheitsstärkungsgesetz (BFSG). The benchmark is EN 301 549, which refers to WCAG 2.1 Level AA – 1.3.4 was introduced in WCAG 2.1 and is part of it. Public sector bodies have their own obligations. (General information, not legal advice.)

6. The success criterion in the W3C’s words

Success Criterion 1.3.4 Orientation (Level AA)

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.

Note: Examples where a particular display orientation may be essential are a bank check, a piano application, slides for a projector or television, or virtual reality content where content is not necessarily restricted to landscape or portrait display orientation.

In short: content must not limit itself to portrait or landscape – unless a specific orientation is essential.