Zweiter Blick: Erfolgskriterium 2.2.2
WCAG Erfolgskriterien
WCAG 2.0 A

Erfolgskriterium 2.2.2
Pause, Stopp, Verbergen
[Materialsammlung]

Informationen, die sich bewegen, blinken, scrollen oder automatisch Informationen aktualisieren, müssen in der Regel über Mechanismen zum Anhalten, Abbrechen oder Ausblenden verfügen.

WCAG Kontext

Konformitätsstufe A

Prinzip 2. Bedienbar Operable

Komponenten der Benutzerschnittstelle und die Navigation müssen bedienbar sein.

Richtlinie 2.2 Genügend Zeit

Stelle genügend Zeit zum Lesen und Verwenden von Inhalt zur Verfügung.

Konformitätserfordernis 5: Keine Störfaktoren.

Dieses Erfolgskriterium wird innerhalb der WCAG als absoluter Störfaktor hervorgehoben. Wird es nicht erfüllt, ist für einzelne Personen der gesamte Webauftritt möglicherweise unbrauchbar.

Strukturierende Übersetzung des Erfolgskriteriums

Für Informationen, die sich bewegen, blinken, scrollen oder automatisch aktualisieren, gilt Folgendes:

Bewegt, blinkend, scrollend
Für jegliche Information, die sich bewegt, blinkt oder scrollt, welche
  1. automatisch startet,
  2. länger als fünf Sekunden dauert und
  3. parallel mit anderem Inhalt dargestellt ist,
gibt es einen Mechanismus zum Anhalten, Unterbrechen oder verbergen.
Ausnahme: Die Bewegung, das Blinken oder das Scrollen ist Teil einer Aktivität, in der diese unerlässlich sind.
Automatisch aktualisierend
Für jegliche Information, die automatisch aktualisiert wird und
  1. automatisch startet und
  2. parallel mit anderem Inhalt dargestellt wird,
gibt es einen Mechanismus
  1. zum Anhalten, Unterbrechen oder Verbergen oder
  2. zum Steuern der Frequenz der Aktualisierung.
Ausnahme: Die Aktualisierung ist Teil einer Aktivität, in der diese unerlässlich ist.

Anmerkungen der WCAG

  • Anforderungen in Bezug auf flackernde oder blitzende Inhalte findest du unter Richtlinie 2.3.
  • Da jeglicher Inhalt, der dieses Erfolgskriterium nicht erfüllt, die Möglichkeit der Verwendung des gesamten Webauftritts beeinträchtigen kann, muss jeglicher Inhalt dieses Erfolgskriterium erfüllen (unabhängig davon, ob der Inhalt dazu dient, andere Erfolgskriterien zu erfüllen). Vergleiche Konformitätserfordernis 5: Keine Störfaktoren.
  • Inhalt, der durch Software periodisch aktualisiert oder an den Browser gestreamt wird, muss keine Information vorsehen oder darstellen, die zwischen der Einleitung der Unterbrechung und Wiederaufnahme der Darstellung generiert oder empfangen wird.
    • Dies könnte technisch nicht möglich sein.
    • Dies könnte in vielen Situationen irreführend sein.
  • Eine Animation als Teil der Ladephase oder in ähnlichen Situationen kann unter folgenden Umständen als unerlässlich angesehen werden:
    • Eine Interaktion ist in dieser Phase generell nicht möglich.
    • Eine fehlende Darstellung des Fortschritts könnte zu Verwirrung führen oder zu der Fehlannahme dass, Inhalt eingefroren oder abgestürzt ist.
Anmerkungen zur Übersetzung
  • Auflistungen, die sich innerhalb eines Satzes befinden, wurden überwiegend in semantische Listen umgearbeitet. .
  • Die Zwischenüberschrift für Anmerkungen wurdeergänzt.
  • Die Anmerkungen wurden in einer Liste dargestellt.
Englischsprachiger Originaltext des Erfolgskriteriums

For moving, blinking, scrolling, or auto-updating information, all of the following are true:

For moving, blinking, scrolling, or auto-updating information, all of the following are true:

Moving, blinking, scrolling
For any moving, blinking or scrolling information that (1) starts automatically, (2) lasts more than five seconds, and (3) is presented in parallel with other content, there is a mechanism for the user to pause, stop, or hide it unless the movement, blinking, or scrolling is part of an activity where it is essential; and
Auto-updating
For any auto-updating information that (1) starts automatically and (2) is presented in parallel with other content, there is a mechanism for the user to pause, stop, or hide it or to control the frequency of the update unless the auto-updating is part of an activity where it is essential.

For requirements related to flickering or flashing content, refer to Guideline 2.3.

Since any content that does not meet this success criterion can interfere with a user's ability to use the whole page, all content on the Web page (whether it is used to meet other success criteria or not) must meet this success criterion. See Conformance Requirement 5: Non-Interference

Content that is updated periodically by software or that is streamed to the user agent is not required to preserve or present information that is generated or received between the initiation of the pause and resuming presentation, as this may not be technically possible, and in many situations could be misleading to do so.

An animation that occurs as part of a preload phase or similar situation can be considered essential if interaction cannot occur during that phase for all users and if not indicating progress could confuse users or cause them to think that content was frozen or broken.

WCAG | Success Criterion 2.2.2 Pause, Stop, Hide

Zum raschen Verständnis

Es geht um visuelle Effekte, Bewegungen, Scrollen, Animationen oder Ähnliches. Diese müssen steuerbar sein, um die Wahrnehmung der Information selbst oder anderer Seiteninhalte zu gewährleisten.

Die Schalter zum Anhalten, Abbrechen oder Verbergen sollten sich technisch im DOM oberhalb der Animation befinden. Menschen, die mit einem Screen Reader arbeiten, aber etwa über Vergrößerungsmechanismen auch noch über eine visuelle Wahrnehmung verfügen, haben dadurch einen raschen Zugriff auf die Bedienungselemente.

Beispiele

Beispiele für visuelle Informationen die unter dieses Erfolgskriterium fallen, sind:

  1. Karusselle und Diashows
  2. Videos und animierte Werbeanzeigen
    Wenn etwa ein Werbevideo zwingend für alle in einem Vollbildmodus dargestellt wird, sind keine Bedienungsmechanismen verlangt.
  3. Automatisch aktualisierte Live Regionen (Börseticker, Wetterdaten oder Fahrplananzeiger).
  4. Scrollende Anzeigen für Neuigkeiten.
  5. Blinkende Hinweispfeile für den nächsten Schritt in einem Formular.
  6. Fortschrittsanzeiger (Loading Animation):
    Kein Problem, wenn sich die Statusanzeige in einem eigenen Fenster befindet und mit einer adäquaten Erläuterung versehen ist (Bitte warten).

Ausnahmebestimmungen verstehen

  1. Eine Bewegung, ein Blinken oder ein Scrollen ist unentbehrlich für die jeweilige Aktivität.
  2. Die Darstellungsänderungen beginnen nicht automatisch.
  3. Die Bewegung, das Blinken oder Scrollen dauern weniger als fünf Sekunden.
  4. Die Darstellungsänderung wird nicht parallel zu anderen Inhalten präsentiert.
  5. Bei Informationen, die automatisch aktualisiert werden, lässt sich die Frequenz der Aktualisierung steuern.

Beispiele für Ausnahme

Generell ausgenommen von der Verpflichtung zu Steuerelementen sind:

  1. Kurze Animationen, die weniger als fünf Sekunden dauern. Das Auslösen von Bedienungselementen würde ohnedies so lange dauern.
  2. Seiten und Seitenbereiche, die von ihrem Wesen her die gesamte Zeitspanne oder eine Unbedienbarkeit benötigen. Denken wir etwa an Simulatoren oder bestimmte Demonstrationen von Problembereichen von Animationen.
  3. Videos und andere Animationen, die im Vollbildmodus dargestellt werden, also keine anderen Seiteninhalte stören können. Die Darstellung von Bedienungsmechanismen könnte die Gesamtdarstellung des Inhalts selbst stören.

Inhalte, die sich automatisch aktualisieren erhalten folgende Ausnahmebestimmungen:

  1. Die Frequenz der Aktualisierung kann gesteuert werden. Bei der Nutzung kann individuell zwischen dem Nutzen durch die Aktualisierung und potentielle visuelle Beeinträchtigungen abgewogen werden.
  2. Elemente mit permanenten Aktualisierungen müssen zwangsläufig länger als fünf Sekunden dauern, weil sich individuelle Werte auch danach relevant ändern können.

Anmerkungen verstehen

  1. Anforderungen an flackernde oder blitzende Elemente werden in den Erfolgskriterien 2.3.1 Dreifaches Flackern oder unter dem Schwellenwert und 2.3.2 Drei Blitze behandelt.
  2. Bei Nichtbeachtung kann eine Störung auftreten, die für den weiteren Besuch des gesamten Webauftritts zu Interferenzen führt.
  3. Technische Einschränkungen und potentielle Irritationen gelten als zulässige Ausnahmen.
  4. Generelle Animation beim Laden können zulässig sein.

Spezielle Hinweise der WAI

In den erläuternden Informationen zu diesem Erfolgskriterium werden vermutlich auf Grund schlechter Erfahrungen einige grundsätzliche Anforderungen an Inhalte angeführt. Hier eine kurze Aufstellung von potentiellen Themen:

Die Bedienungselemente für Animationen dürfen natürlich nicht selbst zu Bedienungsproblemen führen. Beim Auslösen etwa eines Pause-Schalters muss weiterhin die Tastaturbedienbarkeit gewährleistet bleiben:

Die Ausdrücke Blinkend und Blitzend (Blinking and Flashing) können sich auf ein und dasselbe Element als potentielles Problem beziehen. Ich versuche hier die die Thematik übersichtlich darzustellen, wie sie in den Erläuterungen zum Erfolgskriterium angeführt werden.

Ein Blinken, das eine größere Fläche einnimmt, ziemliche Helligkeitsunterschiede aufweist und über eine kritische Frequenz verfügt, wird in den Erläuterungen potentiell mit einem Blitzen gleichgestellt.

Fortsetzen nach Unterbrechung

Die Fortsetzung von angehaltenen oder verborgenen Inhalten kann folgendermaßen erfolgen:

  1. Die Fortsetzung beginnt an der Stelle, an der angehalten wurde. Dies wird für Videos und Karusselle zweckmäßig sein.
    Erfolgskriterium 2.2.1 Zeit anpassbar
  2. Die Fortsetzung setzt mit Echtzeitinformationen ein. Dies wird bei Inhalten zweckmäßig sein, die automatisch aktualisiert werden oder Statusinformationen enthalten. Börsewerte oder aktuelle Wetterangaben könnten sich seit dem Anhalten geändert haben.
    Für Screen Reader sollten dabei parallel Anforderungen an Live Regionen berücksichtigt werden.

CSS prefers-reduced-motion

Gängige Betriebssysteme erlauben Einstellungen zur Einschränkung von Animationen. Auf diese Einstellungen können Browser durch die CSS Media Query prefers-reduced-motion zugreifen, um Animationen teilweise abzufangen.

Die Unterstützung durch Browser ist schon beachtlich. Werden durch CSS-Anweisungen Animationen realisiert, sollte das Feature also auf jeden Fall ergänzend eingesetzt werden. Die Animation wird dann überhaupt nicht abgespielt.

Allerdings dürften Nutzer*innen diese Konfigurationsmöglichkeit noch kaum kennen. Auf öffentlichen Computern haben sie vielleicht auch nicht die Möglichkeit, entsprechende Konfigurationen vorzunehmen.

Diese Media Query ist daher ein zweckmäßiges, aber kein hinreichendes Verfahren, um das Erfolgskriterium 2.2.2 zu erfüllen.

Media Queries Level 5 | Detecting the desire for less motion on the page: the prefers-reduced-motion feature
Entwurf zu einer Spezifikation durch die CSS Working Group. (24.08.2022)
MDN | prefers-reduced-motion
Erläuterungen zur Eigenschaft mit einem Beispiel zum Testen.

Zielgruppen

Testverfahren

Maschinelle Prüfung

Keine Prüfwerkzeuge bekannt.

Manuelle Prüfung

  1. Suche visuell nach Videos und visuell animierten Inhalten, die automatisch abgespielt werden.
  2. Prüfe, ob der Inhalt unter eine Ausnahmebestimmung fällt.
  3. Prüfe, ob der Inhalt länger als fünf Sekunden dauert.
  4. Prüfe, ob erforderliche Mechanismen zum Anhalten, Abbrechen oder Verbergen zur Verfügung stehen.

Prüfung durch betroffene Menschen (Peer Evaluation)

Die Prüfung setzt ein ausreichendes Sehvermögen der Prüfperson oder einer angeleiteten Assistenzperson voraus.