Verständlich

In Fällen, in denen der Inhalt einer Seite Wörter oder Ausdrücke enthält, die in einer anderen Sprache als der Hauptsprache sind, verwenden Sie das `lang`-Attribut in einem Element, das den betreffenden Begriff umschließt (z. B. ein <span>, wenn kein semantisches Element verfügbar ist), um eine geeignete Sprache für ihn festzulegen.

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

Wo Abkürzungen verwendet werden, sollten Sie eine Erweiterung oder bei Bedarf eine Definition bereitstellen.

Das <abbr>-Element wird oft als bevorzugte Methode angesehen, um eine Erweiterung für eine Abkürzung bereitzustellen — es nimmt ein `title`-Attribut, das die Erweiterung enthält, und diese erscheint, wenn die Abkürzung überfahren wird. Allerdings sind die Titelinhalte nicht über die Tastatur zugänglich, noch werden sie zuverlässig von Bildschirmlesegeräten vorgelesen. Eine bessere Möglichkeit, dies zu handhaben, besteht darin, erneut Links zu Glossarseiten bereitzustellen, die die Erweiterung und Erklärung der Abkürzung enthalten, oder zumindest sie im umgebenden Text im Kontext einzufügen.

Wenn Text bereitgestellt wird, der ein höheres Leseniveau als das der unteren Sekundarstufe erfordert (typischerweise etwa 11- bis 14-Jährige), stellen Sie zusätzliches Erklärmaterial bereit, um Menschen zu helfen, die ihn nicht lesen können, oder stellen Sie eine alternative Version bereit, die auf einem niedrigeren Sekundarniveau geschrieben ist.

Dies bedeutet nicht, dass alle Themen von allen verstanden werden sollten, sondern dass der Schreibstil für alle zugänglich sein sollte. Es ist besser, alle Inhalte auf einem niedrigeren Sekundarniveau zu schreiben, selbst technische Dokumentationen wie Programmieranleitungen, es sei denn, es gibt einen guten Grund, dies nicht zu tun (z. B. ein alternativer Stil für poetische Wirkung), oder sie müssen in einem strengen Stil geschrieben werden (z. B. W3C-Spezifikationen).

Es sollte ein Mechanismus bereitgestellt werden, der Benutzern den Zugang zur Aussprache von Wörtern ermöglicht, wenn dies erforderlich ist, um den Inhalt vollständig zu verstehen.

Das HTML-<audio>-Element kann verwendet werden, um eine Steuerung zu erstellen, die es dem Leser ermöglicht, eine Audiodatei abzuspielen, die die korrekte Aussprache enthält, und es macht auch Sinn, einen textuellen Ausspracheführer nach schwierigen Wörtern zu platzieren, ähnlich wie in einem Wörterbucheintrag.

Wenn eine Steuerung oder ein anderes Seitenmerkmal den Fokus erhält, sollte es den Kontext nicht so ändern, dass es den Benutzer verwirren oder desorientieren könnte.

Dies ist eine Frage des sinnvollen Designs — Menschen wollen nicht, dass Schnittstellen sie überraschen; sie wollen, dass Dinge intuitiv sind und sich wie erwartet verhalten. Zum Beispiel sollte das Fokussieren einer Navigationsmenüoption nicht die angezeigte Seite ändern — sie sollte aktiviert werden, bevor sich die Anzeige ändert.

Wenn Daten in eine Steuerung eingegeben oder eine Einstellung geändert wird, sollte der Kontext nicht unerwartet geändert werden. Der Benutzer sollte gewarnt/vorgewarnt werden, bevor die Änderung erfolgt.

Auch hier sollte ein sinnvolles Design implementiert werden. Zum Beispiel, wenn das Drücken eines Buttons dazu führt, dass die Anwendung die aktuelle Ansicht verlässt, sollte der Benutzer gefragt werden, diese Aktion zu bestätigen, ihre Arbeit zu speichern, wenn dies angebracht ist, usw.

Navigationsmenü/-steuerung-Stil und -Positionierung sollten zwischen verschiedenen Seiten oder Ansichten einer Webseite konsistent sein, und die vorhandenen Elemente sollten in der gleichen Reihenfolge erscheinen, selbst wenn zum Beispiel neue Elemente hinzugefügt werden. Wenn der Benutzer eine Änderung initiiert hat, z. B. eine andere Farbgebung oder Position für die Navigation wählt, sollte ihre Wahl auf allen Seiten respektiert werden.

Auch hier sinnvolles Design — machen Sie die Navigationssteuerungen auf allen Seiten oder Ansichten gleich.

Steuerelemente oder Komponenten, die die gleiche Funktionalität haben, sollten auf verschiedene Seiten oder Ansichten hinweg auf die gleiche Weise identifiziert werden. Ein Währungsumrechner, der auf jeder Seite einer Website über Weltreisen erscheint, sollte zum Beispiel genau gleich sein, semantisch und in Bezug auf Beschriftungen.

Auch hier sinnvolles Design!

Änderungen im Kontext, die Benutzer möglicherweise verwirren oder desorientieren könnten, sollten nur stattfinden, wenn sie vom Benutzer angefragt werden, ODER der Benutzer sollte in der Lage sein, sie zu deaktivieren.

Wenn Sie etwas benötigen, das die aktuelle Ansicht erheblich ändert (z. B. Inhalte oder Steuerungen), lassen Sie den Benutzer kontrollieren, wann er diese Änderung vornehmen möchte (z. B. welche Seite angezeigt werden soll, wann zum nächsten Foto in der Galerie vorgegangen werden soll ...)

Wenn Sie etwas wie ein Karussell auf einer Seite haben, bieten Sie eine Option an, um das automatische Vorwärtsbewegen zu stoppen. Besser ist es, solche Funktionen nach Möglichkeit zu vermeiden.

Webseiten, die Hilfemechanismen enthalten, einschließlich Selbsthilfemöglichkeiten und Kontaktdaten für menschlichen Kontakt, die auf mehreren Webseiten wiederholt werden, müssen diese Mechanismen auf allen Seiten in derselben Reihenfolge platzieren, es sei denn, eine Änderung wird vom Benutzer initiiert.

Informieren Sie sich über die dokumentation zur konsistenten Hilfe für diesen Standard, um mehr zu erfahren.

Wenn ein Benutzer ein Formular ausfüllt oder zwischen Optionen wählt, sollte jeder erkannte Fehler dem Benutzer klar gemeldet werden, zusammen mit dem Formularfeld, auf das sich der Fehler bezieht.

Es wird empfohlen, eine clientseitige Fehlererkennung und -behandlung über HTML-Formularvalidierungsfunktionen und/oder JavaScript zu implementieren, je nachdem, was 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 Bildschirmleserbenutzer können Sie aria-Live-Regionen verwenden, um den Benutzer auf eine Seitenänderung aufmerksam zu machen.

Klare Anweisungen sollten gegeben werden, wenn eine Dateneingabe erforderlich ist. Wenn eine einfache Anweisung oder Aufforderung erforderlich ist, können Sie <label>-Elemente für einzelne Eingaben wie Namen 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 Postanschrift).

Wenn eine komplexere Erklärung erforderlich ist, können Sie immer auch erläuternde Absätze einfügen oder möglicherweise versuchen, Ihre Formulare intuitiver zu gestalten.

• Sinnvolle Textbeschriftungen
• Wie man ein HTML-Formular strukturiert
• Textbeschriftungen und -namen

Wenn ein Fehler erkannt wird und Vorschläge zur Korrektur bekannt sind, stellen Sie diese dem Benutzer zur Verfügung (z. B. Alternativen vorschlagen, wenn der Benutzer einen Benutzernamen gewählt hat, der bereits vergeben ist), es sei denn, dies würde zu einem Sicherheitsproblem führen (z. B. bei Eingabe eines Passworts) oder zu einem Kontextproblem (z. B. wenn sie versuchen, eine Frage in einer Quiz-App zu beantworten).

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

Bei Formularen, die die Eingabe sensibler Daten betreffen (wie rechtliche Vereinbarungen, E-Commerce-Transaktionen oder persönliche Daten), sollte mindestens eines der folgenden zutreffen:

• Einsendungen sind reversibel.
• Daten werden auf Fehler überprüft, und dem Benutzer wird die Möglichkeit gegeben, sie zu korrigieren.
• Ein Mechanismus ist verfügbar, um Informationen vor der endgültigen Einreichung zu bestätigen und zu korrigieren.

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

Datenüberprüfung — wie in 3.3.1 behandelt, sollte eine Kombination aus clientseitiger und serverseitiger Validierung verwendet werden, um Fehler zu erkennen und hilfreiche Meldungen an den Benutzer zu zeigen, damit er seine Eingaben korrigieren kann.

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