Zurück zu den WCAG

WCAG 2.1 - 1.3.4

Orientation

Inhalte beschränken ihre Ansicht und Bedienung nicht auf eine einzelne Anzeigeorientierung, wie Hochformat oder Querformat, es sei denn, eine bestimmte Anzeigeorientierung ist wesentlich.

Inhalt

Was Bedeutet das Success Criterium 1.3.4 - Orientation?Warum ist es so wichtig, das Success Criterium 1.3.4 - Orientation zu beachten?Was hat das Success Criterium 1.3.4 - Orientation mit dem BFSG zu tun?Lösungen für 1.3.4 - Orientation anhand von CodebeispielenWie löse ich Verstöße gegen das Success Criterium 1.3.4 - Orientation?

Was Bedeutet das Success Criterium 1.3.4 - Orientation?

Dieses Kriterium verlangt, dass Inhalte und Funktionen auf einer Website sowohl in der Hochformat- (Portrait) als auch in der Querformat- (Landscape) Ausrichtung zugänglich sein müssen, es sei denn, eine bestimmte Ausrichtung ist für die Funktion oder Bedeutung des Inhalts unbedingt erforderlich (zum Beispiel eine App für das Scannen von Ausweisen oder ein Klavier-Lernprogramm). Das heißt: Nutzer:innen dürfen nicht gezwungen werden, ihr Gerät zu drehen, um auf Inhalte oder Funktionen zugreifen zu können.

Was ist technisch zu beachten?
  • Vermeiden Sie Hinweise wie: „Bitte drehen Sie Ihr Gerät ins Querformat.“
  • Stellen Sie sicher, dass alle Funktionen und Inhalte in beiden Ausrichtungen nutzbar sind, sofern keine zwingenden Gründe dagegen sprechen.
  • Prüfen Sie eingesetzte Webtechnologien, Frameworks oder Plugins auf Einschränkungen bezüglich der Ausrichtung.
  • Verwenden Sie in Ihrem Webdesign responsive Techniken, damit Layout und Funktionen sich flexibel anpassen.
Ausnahmen

Eine Ausnahme gilt nur dann, wenn eine bestimmte Ausrichtung wesensnotwendig ist (z.B. für spezielle Spiele, Instrumenten-Apps, Kamera-Anwendungen). In solchen Fällen sollte die Notwendigkeit der Ausrichtung begründet sein und es muss klar kommuniziert werden.

Warum ist es so wichtig, das Success Criterium 1.3.4 - Orientation zu beachten?

Viele Menschen können ihr Gerät entweder aus technischen oder körperlichen Gründen nicht in eine bestimmte Richtung drehen. Menschen, die ihr Mobilgerät in einer Halterung bedienen (z.B. Rollstuhlnutzer:innen), Screenreader-Nutzer:innen oder Menschen mit Bewegungseinschränkungen profitieren davon, dass sie die Website in der bevorzugten Ausrichtung bedienen können. Eine erzwungene Ausrichtung kann für manche Nutzer:innen zum kompletten Ausschluss führen.

Was hat das Success Criterium 1.3.4 - Orientation mit dem BFSG zu tun?

Das Barrierefreiheitsstärkungsgesetz (BFSG) verpflichtet in Deutschland Unternehmen dazu, digitale Produkte und Dienstleistungen barrierefrei zu gestalten. Inhalte, die nur in einer Ausrichtung funktionieren, schließen Nutzer:innen mit Behinderungen aus und verstoßen daher gegen die gesetzliche Pflicht zur Barrierefreiheit nach BFSG. Eine BFSG-konforme Website muss beide Ausrichtungen unterstützen oder gut begründen, warum dies ausnahmsweise technisch nicht möglich oder nicht sinnvoll ist.

Lösungen für 1.3.4 - Orientation anhand von Codebeispielen

Falscher Code

<script> if (window.orientation !== 90 && window.orientation !== -90) { document.body.innerHTML = '<p>Bitte drehen Sie Ihr Gerät ins Querformat.</p>'; } </script>

Korrekter Code

<!-- Die Website verwendet Responsive Design und funktioniert sowohl in Hoch- als auch Querformat --> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- Kein Zwang, das Gerät zu drehen --> <body> <main> <!-- Inhalt ist in beiden Orientierungen zugänglich --> </main> </body>

Im schlechten Beispiel wird der gesamte Inhalt durch einen Hinweis ersetzt, falls das Gerät nicht im Querformat ist. Im guten Beispiel gibt es keine Einschränkung – das Layout passt sich automatisch an und ist in beiden Ausrichtungen benutzbar.

Wie löse ich Verstöße gegen das Success Criterium 1.3.4 - Orientation?

Zwei Ansichten eines Accessibility Audits mit Grafiken, die einen zeitlichen Verlauf zeigen und Codebeispielen

Unser Accessibility Audit bietet Ihnen die Möglichkeit, mittels unseres AI-basierten Barrierefreiheits-Assistenten, vollautomatisch konkrete Lösungsvorschläge für Ihre Seite zu erstellen. Dafür scannen wir Ihre Website und ihren Quellcode, finden Problemstellen und zeigen Ihnen anhand Ihres eigenen Websitecode fertige Lösungen zum Kopieren und Einfügen. Starten Sie jetzt den Accessibility Audit kostenlos.

Wir prüfen eine Unterseite Ihrer Website. Geben Sie eine beliebige URL ein.