Verstehbar

In Fällen, in denen der Inhalt einer Seite Wörter oder Ausdrücke in einer anderen Sprache als der Hauptsprache enthält, verwenden Sie das lang-Attribut auf einem Element, das um den betreffenden Begriff gewickelt ist (z.B. ein <span>, wenn kein semantisches Element verfügbar ist), um eine geeignete Sprache dafür zu setzen.

Es ist nicht erforderlich, eine andere Sprache für Wörter oder Ausdrücke zu setzen, die unabhängig von der Sprache gleich sind (zum Beispiel Eigennamen, technische Begriffe, die nicht Teil einer bestimmten Sprache sind).

Wo Abkürzungen verwendet werden, sollten Sie eine Ergänzung oder eine Definition dieser bereitstellen.

Das <abbr>-Element wird oft als bevorzugte Methode zum Bereitstellen einer Erweiterung für eine Abkürzung angesehen — es nimmt ein title-Attribut an, das die Erweiterung enthält, und diese erscheint, wenn Sie mit der Maus über das Akronym fahren. Jedoch sind die Titelinhalte nicht über die Tastatur zugänglich, noch werden sie zuverlässig von Bildschirmlesegeräten vorgelesen. Eine bessere Methode, um dies zu handhaben, besteht darin, Links zu Glossarseiten bereitzustellen, die die Akronymerweiterung und -erklärung enthalten, oder zumindest sie im umgebenden Text im Kontext einzuschließen.

Wenn Text bereitgestellt wird, der ein höheres Leseverständnis als das der unteren Sekundarstufe erfordert (normalerweise Kinder im Alter von 11-14 Jahren), stellen Sie ergänzendes Erklärmaterial bereit, um Menschen zu helfen, die es nicht lesen können, oder bieten Sie eine alternative Version an, die auf dem Niveau der unteren Sekundarstufe geschrieben ist.

Das bedeutet nicht, dass alle Inhalte von jedem verstanden werden müssen, aber der Schreibstil sollte für alle zugänglich sein. Es ist besser, alle Inhalte auf dem Niveau der unteren Sekundarstufe zu schreiben, auch technische Dokumentationen wie Programmieranleitungen, es sei denn, es gibt einen guten Grund, dies nicht zu tun (z.B. ein alternativer Stil für poetische Effekte) oder sie müssen in einem strikten Stil verfasst werden (z.B. W3C-Spezifikationen).

Ein Mechanismus sollte bereitgestellt werden, um Benutzern den Zugang zur Aussprache von Wörtern zu ermöglichen, wo dies erforderlich ist, um den Inhalt vollständig zu verstehen.

Das HTML-<audio>-Element kann verwendet werden, um eine Steuerung zu erstellen, die dem Leser ermöglicht, eine Audiodatei mit der korrekten Aussprache abzuspielen, und es macht auch Sinn, einen textuellen Aussprachehinweis nach schwierigen Wörtern zu inkludieren, so wie es in Wörterbucheinträgen üblich ist.

Wenn ein Steuerelement oder ein anderes Seitenelement den Fokus erhält, sollte es den Kontext nicht so verändern, dass der Benutzer verwirrt oder desorientiert wird.

Dies ist eine Frage des sinnvollen Designs — Benutzer möchten nicht von Schnittstellen überrascht werden; sie möchten, dass Dinge intuitiv und erwartungsgemäß funktionieren. Zum Beispiel sollte das Fokussieren auf eine Navigationsmenüoption nicht die angezeigte Seite ändern — sie sollte aktiviert werden, bevor sich die Anzeige ändert.

Wenn Daten in ein Steuerelement eingegeben werden oder eine Einstellung geändert wird, sollte der Kontext nicht unerwartet geändert werden. Der Benutzer sollte gewarnt oder über die bevorstehende Änderung informiert werden, bevor sie erfolgt.

Auch hier sollte sinnvolles Design implementiert werden. Wenn zum Beispiel das Drücken eines Buttons die Anwendung dazu bringt, die aktuelle Ansicht zu verlassen, sollte der Benutzer aufgefordert werden, diese Aktion zu bestätigen, seine Arbeit zu speichern, falls zutreffend, usw.

Der Stil und die Anordnung von Navigationsmenüs/-steuerelementen sollten zwischen verschiedenen Seiten oder Ansichten einer Webseite konsistent sein, und die bestehenden Elemente sollten in derselben Reihenfolge erscheinen, auch wenn zum Beispiel neue Elemente hinzugefügt werden. Wenn der Benutzer eine Änderung initiiert hat, z.B. eine andere Farbschema- oder Positionswahl für die Navigation, sollte seine Wahl auf allen Seiten respektiert werden.

Wiederum sinnvolles Design — machen Sie die Navigationselemente auf allen Seiten oder Ansichten gleich.

Steuerelemente oder Komponenten, die dieselbe Funktionalität haben, sollten auf dieselbe Weise über verschiedene Seiten oder Ansichten hinweg identifiziert werden. Ein Währungsrechner, der auf jeder Seite einer weltweiten Reise-Website erscheint, sollte zum Beispiel semantisch und bezüglich der Labels genau gleich sein.

Wiederum sinnvolles Design!

Kontextänderungen, die möglicherweise Benutzer verwirren oder desorientieren können, sollten nur dann auftreten, wenn sie vom Benutzer angefordert werden, ODER der Benutzer sollte in der Lage sein, sie auszuschalten.

Wenn Sie etwas haben müssen, das die aktuelle Ansicht erheblich ändert (z.B. Inhalte oder Steuerelemente), lassen Sie den Benutzer steuern, wann sie möchten, dass diese Änderung stattfindet (z.B. welche Seite angezeigt wird, wann zum nächsten Foto in der Galerie übergegangen wird...)

Wenn Sie etwas wie ein Karussell auf einer Seite haben müssen, geben Sie eine Option, um das automatische Fortschreiten zu stoppen. Besser, solche Funktionalitäten zu vermeiden, wenn möglich.

Webseiten, die Hilfe-Mechanismen enthalten, einschließlich Selbsthilfeoptionen und menschliche Kontaktdaten, die auf mehreren Webseiten wiederholt werden, müssen diese Mechanismen in derselben Reihenfolge auf allen Seiten platzieren, es sei denn, eine Änderung wird vom Benutzer initiiert.

Weitere Informationen finden Sie in der Dokumentation zur konsistenten Hilfe für diesen Standard.

Wenn ein Benutzer ein Formular ausfüllt oder zwischen Optionen auswählt, sollte jeder erkannte Fehler dem Benutzer deutlich mitgeteilt werden, zusammen mit dem Formularsteuerelement, mit dem der Fehler zusammenhängt.

Es wird empfohlen, clientseitige Fehlererkennung und -behandlung zu implementieren, über HTML-Formularvalidierungsfunktionen oder JavaScript, was auch immer für Ihre Situation am besten geeignet ist. Wenn ein Fehler erkannt wird, sollte eine intuitive Fehlermeldung neben dem fehlerhaften Formulareingabefeld angezeigt werden, um dem Benutzer zu helfen, seine Eingaben zu korrigieren. Für Benutzer von Bildschirmlesegeräten können Sie aria live-Regionen verwenden, um den Benutzer über eine Änderung auf der Seite zu informieren.

Klare Anweisungen sollten bereitgestellt werden, wenn eine Dateneingabe erforderlich ist. Wenn eine kurze Anweisung oder Aufforderung erforderlich ist, können Sie <label>-Elemente für einzelne Eingaben wie Name oder Alter verwenden, eine Kombination aus <label>s und <fieldset>s/<legend>s für mehrere Eingaben, die zusammengehören (wie die Elemente eines Geburtsdatums oder einer Postadresse).

Wenn eine komplexere Erklärung erforderlich ist, können Sie immer auch erläuternde Absätze einschließen, oder vielleicht müssen Sie versuchen, Ihre Formulare intuitiver zu gestalten.

• Verwenden Sie bedeutungsvolle Text-Labels
• Wie man ein HTML-Formular strukturiert
• Text-Labels und Namen

Wenn ein Fehler erkannt wird und Vorschläge zur Korrektur bekannt sind, sollten diese dem Benutzer zur Verfügung gestellt werden (z.B. das Vorschlagen von Alternativen, wenn der Benutzer einen Benutzernamen auswählt und einen wählt, der bereits vergeben ist), es sei denn, dies würde ein Sicherheitsproblem (z.B. beim Eingeben eines Passworts) oder ein Kontextproblem (z.B. wenn sie versuchen, eine Frage in einer Quiz-App zu beantworten) verursachen.

In solchen Fällen, wenn dies angebracht ist, verwenden Sie wahrscheinlich eine Kombination aus JavaScript und serverseitiger Funktionalität, um zu überprüfen, ob der Eintrag korrekt ist, und wenn nicht, welche möglichen Vorschläge dem Benutzer gegeben werden können. Solche Vorschläge sollten nützlich im Kontext angezeigt werden, genau wie Fehlermeldungen (siehe 3.3.1).

Im Fall von Formularen, die die Eingabe sensibler Daten erfordern (wie rechtliche Vereinbarungen, E-Commerce-Transaktionen oder persönliche Daten), sollte mindestens eines der folgenden Kriterien zutreffen:

• Einsendungen sind reversibel.
• Daten werden auf Fehler überprüft, und dem Benutzer wird die Möglichkeit gegeben, diese zu korrigieren.
• Es steht ein Mechanismus zur Verfügung, um Informationen vor der endgültigen Übermittlung zu bestätigen und zu korrigieren.

Reversibel — für jede Ansicht, in der Daten eingegeben werden können, stellen Sie eine äquivalente Ansicht bereit, die es ermöglicht, einen Eintrag zu bearbeiten oder sogar zu löschen, wie angebracht (siehe zum Beispiel Django-Web-Framework).

Datenüberprüfung — wie in 3.3.1 behandelt, sollte eine Kombination aus client- und serverseitiger Validierung verwendet werden, um Fehler zu erkennen und hilfreiche Meldungen an den Benutzer anzuzeigen, um ihm die Korrektur seiner Eingaben zu ermöglichen.

Bestätigen und korrigieren — wo angebracht, sollte der Benutzer nach dem Ausfüllen einer Reihe von Formularfeldern zur Durchführung einer Aufgabe (wie dem Kauf eines Produkts) einen Bestätigungsbildschirm sehen, auf dem er seine Eingaben überprüfen und alles korrigieren kann, was nicht richtig aussieht. Dieses Muster wird häufig auf E-Commerce-Websites wie Amazon verwendet.