In dieser Artikel-Serie werden die WCAG 2.2 Erfolgskriterien übersetzt und mit Beispielen erklärt. Beachtet werden nur Stufe A und AA.
Das Original auf Englisch ist zu finden unter: https://www.w3.org/TR/WCAG22
Teil 3: Verständlich
Informationen und die Bedienung der Benutzeroberfläche müssen verständlich sein.
Richtlinie 3.1 Lesbar
Machen Sie Textinhalte lesbar und verständlich.
Erfolgskriterium 3.1.1 Sprache der Seite
(Stufe A)
Die Standardsprache jeder Webseite kann programmatisch bestimmt werden.
Beispiel: Eine Webseite hat eine HTML-Deklaration (<html lang=”de”>), die angibt, dass die Standardsprache der Seite Deutsch ist.
Erfolgskriterium 3.1.2 Sprache der Teile
(Stufe AA)
Die menschliche Sprache jedes Abschnitts oder Satzes im Inhalt kann programmatisch bestimmt werden, außer bei Eigennamen, Fachbegriffen, Wörtern unbestimmter Sprache sowie Wörtern oder Phrasen, die Teil des Sprachgebrauchs des unmittelbar umgebenden Textes geworden sind.
Beispiel: In einem multilingualen Dokument wird jeder Absatz mit einer anderen Sprache gekennzeichnet (<p lang=”en”>This is an English paragraph.</p>).
Richtlinie 3.2 Vorhersehbar
Webseiten sollen auf vorhersehbare Weise erscheinen und funktionieren.
Erfolgskriterium 3.2.1 Bei Fokus
(Stufe A)
Wenn ein Benutzeroberflächenkomponente den Fokus erhält, verursacht dies keine Änderung des Kontexts.
Beispiel: Wenn eine Benutzer:in auf ein Eingabefeld klickt, wird der Fokus darauf gesetzt, ohne dass die Seite automatisch scrollt oder sich der Kontext ändert.
Erfolgskriterium 3.2.2 Bei Eingabe
(Stufe A)
Das Ändern der Einstellung einer Benutzeroberflächenkomponente verursacht nicht automatisch eine Kontextänderung, es sei denn, die Benutzer:in wurde vor der Verwendung der Komponente über das Verhalten informiert.
Beispiel: Das Aktivieren eines Kontrollkästchens auf einer Webseite ändert nicht automatisch den Inhalt oder die Navigation der Seite, es sei denn, die Benutzer:in wurde zuvor über dieses Verhalten informiert.
Erfolgskriterium 3.2.3 Konsistente Navigation
(Stufe AA)
Navigationsmechanismen, die auf mehreren Webseiten innerhalb eines Satzes von Webseiten wiederholt werden, erscheinen jedes Mal in der gleichen relativen Reihenfolge, es sei denn, eine Änderung wird von der Benutzer:in initiiert.
Erfolgskriterium 3.2.4 Konsistente Identifizierung
(Stufe AA)
Komponenten, die innerhalb eines Satzes von Webseiten die gleiche Funktionalität haben, werden konsistent identifiziert.
Erfolgskriterium 3.2.6 Konsistente Hilfe
(Stufe A) [Neu]
Wenn eine Webseite eine der folgenden Hilfemechanismen enthält und diese Mechanismen auf mehreren Webseiten innerhalb eines Satzes von Webseiten wiederholt werden, erscheinen sie in derselben Reihenfolge relativ zu anderen Seiteninhalten, es sei denn, eine Änderung wird von der Benutzer:in initiiert:
- Kontaktdaten für menschlichen Kontakt;
- Mechanismus für menschlichen Kontakt;
- Selbsthilfeoption;
- Vollautomatischer Kontaktmechanismus.
Beispiel: Ein Online-Formular für die Registrierung eines Benutzerkontos erfasst die E-Mail-Adresse der Benutzer:in auf der ersten Seite. Auf der nächsten Seite, die die Benutzerdaten bestätigt, wird die zuvor eingegebene E-Mail-Adresse automatisch in das entsprechende Feld eingefügt. Die Benutzer:in kann die E-Mail-Adresse überprüfen und bestätigen, ohne sie erneut eingeben zu müssen.
HINWEIS 1 Hilfemechanismen können direkt auf der Seite bereitgestellt werden oder über einen direkten Link zu einer anderen Seite, die die Informationen enthält.
HINWEIS 2 Für dieses Erfolgskriterium kann “die gleiche Reihenfolge relativ zu anderen Seiteninhalten” als die Reihenfolge betrachtet werden, in der der Inhalt serialisiert wird. Die visuelle Position eines Hilfemechanismus ist wahrscheinlich über Seiten für dieselbe Seitenvariante (z.B. CSS-Brechpunkt) konsistent. Die Benutzer:in kann eine Änderung initiieren, wie z.B. die Änderung der Seitenvergrößerung oder -ausrichtung, die eine andere Seitenvariante auslösen kann. Dieses Kriterium bezieht sich auf die relative Reihenfolge über Seiten hinweg, die in derselben Seitenvariante angezeigt werden (z.B. gleiche Zoomstufe und Ausrichtung).
Leitlinie 3.3 Eingabehilfen
Hilf Benutzer:innen, Fehler zu vermeiden und zu korrigieren.
Erfolgskriterium 3.3.1 Fehleridentifikation
(Stufe A)
Wenn ein Eingabefehler automatisch erkannt wird, wird das fehlerhafte Element identifiziert und der Fehler wird der Benutzer:in in Textform beschrieben.
Beispiel: Nach dem Absenden eines Formulars erscheint eine Fehlermeldung neben dem fehlerhaften Eingabefeld, die die Benutzer:in darüber informiert, dass eine ungültige E-Mail-Adresse eingegeben wurde.
Erfolgskriterium 3.3.2 Beschriftungen oder Anweisungen
(Stufe A)
Beschriftungen oder Anweisungen werden bereitgestellt, wenn der Inhalt eine Benutzereingabe erfordert.
Beispiel: Ein Online-Formular für die Registrierung eines Benutzerkontos enthält klare Beschriftungen für jedes Eingabefeld, z. B. “Vorname”, “Nachname”, “E-Mail-Adresse”.
Erfolgskriterium 3.3.3 Fehlerkorrekturvorschlag
(Stufe AA)
Wenn ein Eingabefehler automatisch erkannt wird und Korrekturvorschläge bekannt sind, werden diese der Benutzer:in angezeigt, es sei denn, dies würde die Sicherheit oder den Zweck des Inhalts gefährden.
Beispiel: Ein Online-Formular erkennt automatisch, dass die Benutzer:in vergessen hat, ein Pflichtfeld auszufüllen. Neben dem leeren Feld wird eine Fehlermeldung angezeigt, die die Benutzer:in darauf hinweist, dass das Feld ausgefüllt werden muss. Zusätzlich wird der Benutzer:in eine Liste von Vorschlägen angezeigt, wie er den Fehler beheben kann, z.B. “Bitte füllen Sie das Pflichtfeld ‘Name’ aus.”
Erfolgskriterium 3.3.4 Fehlervermeidung (Rechtliche, Finanzielle, Daten)
(Stufe AA)
Für Webseiten, die rechtliche Verpflichtungen oder finanzielle Transaktionen für die Benutzer:in verursachen, Benutzer:innen steuerbare Daten in Datenspeichersystemen ändern oder löschen, oder Benutzerprüfungsantworten senden, gilt mindestens eine der folgenden Bedingungen:
Umkehrbar
Sendungen sind umkehrbar.
Geprüft
Von Benutzer:innen eingegebene Daten werden auf Eingabefehler überprüft und Benutzer:innen wird die Möglichkeit zur Korrektur gegeben.
Bestätigt
Ein Mechanismus steht zur Verfügung, um Informationen vor der endgültigen Übermittlung zu überprüfen, zu bestätigen und zu korrigieren.
Beispiel: Ein Online-Shop ermöglicht es Benutzer:innen, Produkte in ihren Warenkorb zu legen und anschließend zur Kasse zu gehen. Bevor die Bestellung abgeschlossen wird, zeigt das System eine Übersicht der ausgewählten Produkte, ihrer Preise und der Gesamtsumme an. Die Benutzer:in hat die Möglichkeit, alle Details zu überprüfen und gegebenenfalls zu korrigieren, bevor die Bestellung finalisiert wird.
Erfolgskriterium 3.3.7 Redundante Eingabe
(Stufe A) [Neu]
Informationen, die zuvor von der Benutzer:in eingegeben oder bereitgestellt wurden und die im gleichen Prozess erneut eingegeben werden müssen, sind entweder:
- automatisch ausgefüllt oder
- für den Benutzer auswählbar.
Es sei denn, wenn:
- die erneute Eingabe der Informationen wesentlich ist,
- die Informationen erforderlich sind, um die Sicherheit des Inhalts zu gewährleisten, oder
- zuvor eingegebene Informationen nicht mehr gültig sind.
Beispiel: Eine Online-Shopping-Website erlaubt Benutzer:innen, die Versandadresse automatisch auszufüllen, basierend auf der zuvor eingegebenen Rechnungsadresse. Die Benutzer:in kann wählen, diese automatisch ausgefüllte Adresse zu verwenden oder eine andere Versandadresse auszuwählen.
Erfolgskriterium 3.3.8 Barrierefreie Authentifizierung (Minimum)
(Stufe AA) [Neu]
Ein kognitiver Funktionstest (wie das Erinnern eines Passworts oder das Lösen eines Rätsels) ist für keinen Schritt in einem Authentifizierungsprozess erforderlich, es sei denn, dieser Schritt bietet mindestens eine der folgenden Möglichkeiten:
Alternative
Eine andere Authentifizierungsmethode, die nicht auf einem kognitiven Funktionstest basiert.
Mechanismus
Ein Mechanismus steht zur Verfügung, um der Benutzer:in beim Abschluss des kognitiven Funktionstests zu helfen.
Objekterkennung
Der kognitive Funktionstest besteht darin, Objekte zu erkennen.
Persönlicher Inhalt
Der kognitive Funktionstest besteht darin, nicht textbasierten Inhalt zu identifizieren, den die Benutzer:in der Website zur Verfügung gestellt hat.
Beispiel: Eine Banking-App bietet ihren Benutzer:innen die Möglichkeit, sich nicht nur mit einem Passwort, sondern auch mit biometrischen Daten wie Fingerabdruck oder Gesichtserkennung zu authentifizieren.
HINWEIS 1 “Objekterkennung” und “Persönlicher Inhalt” können durch Bilder, Videos oder Audio repräsentiert werden.
HINWEIS 2 Beispiele für Mechanismen, die dieses Kriterium erfüllen, umfassen: Unterstützung für die Passworteingabe durch Passwort-Manager zur Reduzierung des Gedächtnisbedarfs und Kopieren und Einfügen zur Reduzierung der kognitiven Belastung durch das Wiederholteingeben.