Das Prüfverfahren zur BITV


Sie sind hier: BITV-Test > Liste der Erfolgskriterien > Prüfkriterium 1.4.10a (27 von 60)


zum WCAG-Test wechseln


Blättern: zum ersten Prüfschritt zum vorhergehenden Prüfschritt zum nächsten Prüfschritt zum letzten Prüfschritt

Prüfschritt 1.4.10a
Inhalte brechen um

Technische Angaben

Version Aktuell
BITV-Bedingung 1.4.10 Umbruch
Bewertungsalternativen ja / eher erfüllt / teilweise erfüllt / eher nicht erfüllt / nein / nicht anwendbar
Gewichtung geringes Gewicht (1 Punkt)
Bezieht sich auf einzelne Webseite
Prüfschritt erfüllt

Inhalte lassen sich bei einer Browserfensterbreite von 320 CSS-Pixeln ohne Verlust von Informationen oder Funktionalität und ohne horizontales Scrollen nutzen (ausgenommen sind Inhalte, deren Bedeutung oder Nutzung ein zweidimensionales Layout voraussetzen).

Was wird geprüft?

Seiten-Inhalte sollen bei einer Browserfensterbreite von 320 CSS-Pixeln (bzw. bei einer Browserfensterbreite von 1280 CSS-Pixeln und 400% Zoomvergrößerung) so umbrechen, dass alle Informationen und Funktionen verfügbar sind, ohne dass Nutzer horizontal scrollen müssen.

Es wird dabei nicht verlangt, dass alle Inhalte in gleicher Weise in der responsiven Ansicht verfügbar sind. So sind die sichtbaren Navigationsmenüs einer Standard-Ansicht auf dem Desktop häufig nach dem Hereinzoomen (oder bei Nutzung des Angebots auf einem Smartphone-Monitor) nur über eine Ausklappnavigation zugänglich. Inhalte können auch in Ausklappbereichen oder über Links auf andere Seiten oder Ansichten verfügbar sein.

Ausnahmen gelten für Inhalte, für deren Nutzung ein zweidimensionales Layout erforderlich ist, z.B. Bilder, Landkarten, Diagramme, Videos, Spiele, Präsentationen, Datentabellen und Anwendungs-Schnittstellen, in denen die Bearbeitung von Inhalten die permanente Verfügbarkeit von Werkzeugleisten erfordert.

Hinweis: Dieser Prüfschritt beschränkt sich auf Inhalte, deren primäre Schreibrichtung waagerecht ist, wie bei der für die meisten westlichen Sprachen benutzten lateinischen Schrift. Die zugrunde liegende WCAG-Anforderung gilt in ähnlicher Weise für Inhalte mit vertikaler Schreibrichtung.

Warum wird das geprüft?

Sehbehinderte Nutzer vergrößern häufig Seiten-Inhalte über die Zoomfunktion, die in gängigen Desktop-Browsern vorhanden ist. Über eine responsive Gestaltung mittels CSS media queries sollen Web-Seiten die Nutzung mit starkem Zoom durch eine dynamische Anpassung des Seiten-Umbruchs unterstützen.

Responsive Seiten-Layouts ordnen die Inhaltsblöcke neu an. Mehrspaltige Inhalte werden dabei meist so umbrochen, dass sie bei starkem Zoom einspaltig untereinander angeordnet sind. Bei Fließtexten entstehen auch neue Zeilenumbrüche mit kürzeren Zeilen.

Der Vorteil: Nutzer müssen beim Lesen nur in eine Richtung scrollen (bei westlichen Sprachen: vertikal). Wenn Zeilen bei Zoomvergrößerung nicht umgebrochen werden, sind Nutzer dagegen gezwungen, beim Lesen jeder Zeile horizontal hin- und her zu scrollen, was die Aufnahme der Inhalte sehr stark beeinträchtigt und verlangsamt.

Wie wird geprüft?

1. Anwendbarkeit des Prüfschritts

Der Prüfschritt ist für Webinhalte anwendbar, wenn deren Ausgangsbasis für Zugänglichkeit die üblichen Desktop-Browser mit eingebauter Zoomfunktion einschließt. Er ist nicht anwendbar bei der Nutzung von Browsern mobiler Betriebssysteme, deren eingebaute Zoomvergrößerung (etwa über eine Spreizgeste) in der Regel keine Vergrößerung mit Inhaltsumbruch bieten. Er ist ebenso nicht anwendbar auf native Apps.

2. Prüfung

2.1 Prüfung mit 320px Viewport-Breite

  1. Seite in Firefox öffnen. Mit Hilfe der Web Developer Toolbar die Viewport-Breite auf 320 CSS-Pixel einstellen (Resize -> Edit Resize Dimensions...). Achtung: Wenn rechts eine Scrollbar sichtbar ist, ist die richtige Fenstergrößen-Einstellung 332px, dann ist der Viewport 320px groß.
  2. Seite neu laden.
  3. Feststellen, ob Inhalte so umbrechen, dass eine Nutzung ohne horizontales Scrollen möglich ist.

2.2 Alternative Prüfung mit 1280px Viewport-Breite

  1. In einem Browser, der Zoomvergrößerung um 400% unterstützt (z.B. Chrome) das Browserfenster auf eine Breite von 1280 CSS-Pixeln und eine Höhe von 1024 CSS-Pixeln einstellen. Hierzu lässt sich die Resize-Funktion der Web Developer Toolbar nutzen.
  2. Die Standard-Einstellung von 100% Zoomvergrößerung und 100% Textvergrößerung sicherstellen.
  3. Auf 400% zoomen
  4. Die Seite neu laden
  5. Feststellen, ob Inhalte so umbrechen, dass eine Nutzung ohne horizontales Scrollen möglich ist.

3. Hinweise

  • Bei der alternativen Prüfung mit 1280px Viewport-Breite und 400% Zoom soll nicht negativ bewertet werden, wenn fest positionierte Inhalte (etwa Ausklappmenüs) aufgrund der sehr geringen verfügbaren Höhe des Browser-Fensters nicht voll erreichbar sind. Geprüft wird allein, ob Inhalte erfolgreich in eine Ansicht umbrechen, die nicht horizontal gescrollt werden braucht. Zur Prüfung des Verlusts von Informationen und Funktionalität ist die Prüfung bei 320px Viewport-Breite ausschlaggebend.
  • Ausnahmen für die Anforderung, dass horizontales Scrollen nicht erforderlich ist, sind Inhalte, deren Nutzung ein zweidimensionales Layout voraussetzen, etwa Datentabellen, Bilder, Diagramme, Videos, Spiele oder Benutzerschnittstellen mit Werkzeugleisten.
  • Im Prüfschritt wird nicht geprüft, ob die Zoomvergrößerung auf 400% Textinhalte tatsächlich auf 400% oder einen geringeren Wert vergrößert. Dies ist Gegenstand von Prüfschritt 1.4.4a "Text auf 200% vergrößerbar".
  • Für Unternehmen, die Bestandssysteme verwenden oder ihre Layoutmethoden aus irgendeinem Grund nicht aktualisieren können, kann eine alternative, konforme Version eine mobile Website mit einem festen, 320px breiten Layout sein. Der Benutzer sollte in der Lage sein, diese Version von der Standardwebsite aus zu finden.

4. Bewertung

Prüfschritt erfüllt:

Inhalte und Funktionen sind bei einer Browserfenster-Breite von 1280px nach Zoom auf 400% (oder bei ungezoomter Ansicht bei einer Browserfenster-Breite von 320px) ohne horizontales Scrollen vollständig erreichbar.

Quellen

Understanding Reflow (zur Zeit nur auf Englisch verfügbar)

Blättern: zum ersten Prüfschritt zum vorhergehenden Prüfschritt zum nächsten Prüfschritt zum letzten Prüfschritt