WCAG 2.1, 1.4.13, AA

Inhalt bei Hover oder Fokus

  • WCAG: 2.1
  • Stufe: AA
  • Thema: Flexibilität der Anzeige

Einblendbare Inhalte, die angezeigt werden, wenn Elemente den Mauszeiger- oder Tastaturfokus erhalten (z.B. benutzerdefinierte Tooltips oder Dropdown-Navigationen), müssen ausblendbar, hoverbar und dauerhaft sein. Dies ermöglicht die uneingeschränkte Interaktion sowohl mit diesen als auch mit den umgebenden Inhalten.

Verstehen

Elemente, die durch die Interaktion der Benutzenden ein- oder ausgeblendet werden, können verwirren, wenn sie sich nicht vorhersehbar verhalten und bedienen lassen. Folgende Anforderungen sind deshalb zu stellen:

- Ausblendbar: Es muss eine Möglichkeit geben, einen eingeblendeten Inhalt zu schliessen, ohne den Fokus zu verschieben (z.B. durch Drücken der Escape-Taste oder durch Aktivieren desjenigen Elements, dessen Fokussierung den Inhalt eingeblendet hat).

- Hoverbar: Wenn das Verschieben des Mauszeigers den zusätzlichen Inhalt auslöst (Hover), dann muss dieser über den zusätzlichen Inhalt bewegt werden können, ohne dass dieser wieder verschwindet.

- Dauerhaft (persistent): Der Inhalt darf nicht von selbst wieder verschwinden. Er muss sichtbar bleiben, bis der Hover- oder Fokus-Auslöser entfernt wurde, er durch gezielte Interaktion aufgehoben wurde, oder seine Information nicht länger gültig ist.

Für Menschen mit Sehbehinderungen, die mit starker Zoomvergrösserung arbeiten, sind zusätzliche Inhalte problematisch, die bei Mauszeiger- oder Tastaturfokus eingeblendet werden:

- Aspekt «ausblendbar»: Eingeblendete Inhalte verdecken häufig andere Inhalte. Es muss möglich sein, den eingeblendeten Inhalt wieder zu schliessen, ohne den Fokus zu bewegen. Die Escape-Taste oder ein Aktivieren desjenigen auslösenden Elements (Klicken, Tippen, Enter-Taste), das zurzeit den Fokus hat, muss den eingeblendeten Inhalt schliessen. Ausgenommen sind Fälle, bei denen der eingeblendete Inhalt eine Fehlermeldung ist oder keine anderen Inhalte verdeckt oder ersetzt.

- Aspekt «hoverbar»: Inhalte sind wegen des starken Zoomfaktors oft nur teilweise sichtbar. Es muss möglich sein, den Mauszeiger vom auslösenden Element über den eingeblendeten Inhalt zu bewegen (was meist den sichtbaren Ausschnitt verschiebt), ohne dass der eingeblendete Inhalt schliesst.

- Aspekt «dauerhaft»: Menschen mit Sehbehinderungen brauchen häufig mehr Zeit, um Inhalte zu lesen. Eingeblendete Inhalte müssen deshalb so lange zur Verfügung stehen, bis sie aktiv geschlossen werden (z.B. über Weiter-Tabben, Wegbewegen des Mauszeigers vom eingeblendeten Inhalt oder explizites Schliessen mittels Tastatur). Ausgenommen sind Fälle, bei denen der eingeblendete Inhalt nicht länger gültig ist.

Hinweise:

- Bei Inhalten, die eingeblendet werden, wenn ein bestimmtes Element den Tastaturfokus erhält, wird nicht verlangt, dass der Mauszeiger über die eingeblendeten Inhalte bewegt werden kann, ohne dass diese sich schliessen.

- Wenn das Aktivieren (Klicken, Tippen, Enter-Taste) desjenigen Elements, das den Inhalt einblendet, zum Schliessen des eingeblendeten Inhalts führt, muss der Kontext bestehen bleiben (und es dürfen keine weiteren Aktionen ausgelöst werden, die den Kontext ändern, etwa das Aktivieren eines Links).

- Wenn Inhalte durch Hover eingeblendet werden, müssen diese auch bei Tastaturfokus eingeblendet werden, ausser sie werden alternativ zur Verfügung gestellt. Für Anforderungen in Bezug auf Tastatur, beachten Sie Erfolgskriterium 2.1.1.

- Die Anforderung gilt nicht für eingeblendete Inhalte, deren Verhalten durch den Nutzer-Agenten (z.B. Browser) bestimmt wird (z.B. native title-Attribute).

Verantwortlichkeiten

  • Das Entwicklungsteam stellt sicher, dass via Hover oder Fokus eingeblendete Inhalte ausblendbar und hoverbar sind und sich nicht selbsttätig schliessen.

WCAG-Text

Wenn das Ansteuern und darauffolgende Wegbewegen von Elementen mittels Mauszeiger oder Tastaturfokus dazu führt, dass zusätzliche Inhalte eingeblendet und dann verborgen werden, gilt Folgendes:

- Ausblendbar: Es steht ein Mechanismus zur Verfügung, um den zusätzlichen Inhalt zu verwerfen, ohne den Mauszeiger oder den Tastaturfokus zu bewegen, es sei denn, der zusätzliche Inhalt vermittelt einen Eingabefehler oder verdeckt oder ersetzt andere Inhalte nicht;

- Hoverbar: Wenn die Mauszeigerbewegung den zusätzlichen Inhalt auslösen kann, dann kann der Mauszeiger über den zusätzlichen Inhalt bewegt werden, ohne dass dieser verschwindet;

- Persistent: Der zusätzliche Inhalt bleibt so lange sichtbar, bis der Hover- oder Fokusauslöser entfernt wird, die Benutzerin oder der Benutzer ihn ablehnt oder seine Informationen nicht mehr gültig sind.

Ausnahme: Die visuelle Darstellung des zusätzlichen Inhalts wird durch den User-Agenten gesteuert und vom Autor nicht verändert.

Anmerkung: Beispiele für zusätzliche Inhalte, die durch den User-Agenten gesteuert werden, sind Browser-Tooltips, die durch die Verwendung des HTML-Title-Attributs erstellt werden.

Anmerkung: Benutzerdefinierte Tooltips, Untermenüs und andere nicht-modale Popups, die bei Hover und Fokus angezeigt werden, sind Beispiele für zusätzliche Inhalte, die unter dieses Kriterium fallen.