Richtlinien und Prüfliste für Barrierefreiheit (HTML)

Applies to Windows and Windows Phone

Sie suchen die C#/VB/C++/XAML-Version dieses Themas? Informationen finden Sie unter Richtlinien und Prüfliste für Barrierefreiheit (XAML).

Hier stellen wir eine Prüfliste bereit, mit der Sie sicherstellen können, dass Ihre Windows-Runtime-App mit JavaScript barrierefrei ist.

  1. Legen Sie den barrierefreien Namen (erforderlich) und die barrierefreie Beschreibung (optional) für den Inhalt und die interaktiven UI-Elemente fest.

    Der barrierefreie Name ist eine kurze, beschreibende Textzeichenfolge, mit der die Sprachausgabe ein UI-Element ansagt. Sie sollten den barrierefreien Namen ausdrücklich für Bilder (mit dem alt-Attribut), Eingabefelder (mit dem label-Tag und dem for-Attribut), benutzerdefinierte div-Steuerelemente usw. festlegen. Barrierefreie Beschreibungen und QuickInfos erleichtern Benutzern das Verständnis der Benutzeroberfläche.

    Weitere Informationen finden Sie unter Barrierefreier Name und Barrierefreie Beschreibung (optional).

  2. Legen Sie die Barierrefreiheitsattribute value und status fest, und halten Sie deren Wert aktuell.

    Diese Attribute sind für benutzerdefinierte Elemente wie Schaltflächen, Listen, Kontrollkästchen, Kombinationsfelder, Schieberegler, Statusleisten usw. wichtig.

    Weitere Informationen finden Sie unter Wert und Status.

  3. Legen Sie das role-Attribut für interaktive benutzerdefinierte UI-Elemente und Bereiche fest.

    Sie sollten benutzerdefinierten UI-Elementen (z. B. interaktiven div-Tags) und Bereichen eine gültige WAI-ARIA-Rolle (Web Accessibility Initiative – Accessible Rich Internet Applications) zuweisen.

    Weitere Informationen finden Sie unter Rolle.

  4. Implementieren Sie den Zugriff über die Tastatur wie folgt:

    • Legen Sie das tabindex-Attribut für interaktive Elemente fest.
    • Implementieren Sie die Navigation mit Pfeiltasten für Verbundelemente.
    • Implementieren Sie die Tastaturaktivierung.
    • Legen Sie Tastenkombinationen fest, oder implementieren Sie Zugriffstasten.

    Weitere Informationen finden Sie unter Implementieren von Barrierefreiheit für den Tastaturzugriff.

  5. Legen Sie das aria-live-Attribut für Bereiche fest, in denen dynamischer Inhalt angezeigt wird.

    Durch das Festlegen von aria-live kann die Sprachausgabe Änderungen in der Benutzeroberfläche bei deren Auftreten ansagen.

    Weitere Informationen finden Sie unter Barrierefreiheit und Live-Regionen.

  6. Machen Sie Tabellen barrierefrei, indem Sie einen barrierefreien Namen, barrierefreie Tabellenüberschriften und eine barrierefreie Zusammenfassung oder Beschreibung festlegen.

    Diese Schritte sind für große und komplexe Tabellen wichtig, wenn Benutzer Hilfe zum Verständnis der Daten benötigen. Denken Sie daran, Layouttabellen mit role="presentation" zu kennzeichnen.

    Weitere Informationen finden Sie unter Barrierefreiheit und Tabellen.

  7. Schauen Sie sich die Benutzeroberfläche an, um sicherzustellen, dass ein angemessener Textkontrast vorhanden ist, Elemente in Designs mit hohem Kontrast ordnungsgemäß dargestellt werden und Farben ordnungsgemäß verwendet werden.

    • Verwenden Sie die Systemanzeigeoptionen, die den DPI (Dots Per Inch)-Wert der Anzeige anpassen, und stellen Sie sicher, dass Ihre App-UI bei einer Änderung des DPI-Werts richtig skaliert wird. (Einige Benutzer ändern DPI-Werte als Barrierefreiheitsoption; diese ist unter Erleichtern des Erkennens von Bildschirmobjekten im Center für erleichterte Bedienung verfügbar.)
    • Stellen Sie mithilfe eines Farbanalysetools sicher, dass das Textkontrastverhältnis mindestens 4,5:1 beträgt.
    • Wechseln Sie zu einem Design mit hohem Kontrast, und überprüfen Sie, ob die Benutzeroberfläche leserlich ist und verwendet werden kann.
    • Stellen Sie sicher, dass Informationen auf der Benutzeroberfläche nicht nur mithilfe von Farben vermittelt werden.

    Weitere Informationen finden Sie unter Unterstützen von Designs mit hohem Kontrast und Erfüllen der Anforderungen für barrierefreien Text.

  8. Unterteilen Sie Seiten in logische Bereiche, und kennzeichnen Sie Bereiche mit Orientierungsrollen und barrierefreien Namen. Dies ermöglicht es Hilfstechnologien, Seitenzusammenfassungen zu erstellen und die Navigation zu erleichtern.

    Weitere Informationen finden Sie unter Verfügbarmachen der logischen Struktur einer App.

  9. Führen Sie Tools zum Testen der Barrierefreiheit aus. Behandeln Sie gemeldete Probleme, und überprüfen Sie die Qualität der Sprachausgabe.

    Überprüfen Sie mithilfe von Inspect den programmgesteuerten Zugriff. Führen Sie UI Accessibility Checker (AccChecker) aus, um allgemeine Fehler zu ermitteln, und überprüfen Sie die Qualität der Sprachausgabe.

    Weitere Informationen finden Sie unter Testen der Barrierefreiheit Ihrer App.

  10. Deklarieren Sie Ihre App im Windows Store als barrierefrei.

    Wenn Sie die grundlegende Unterstützung für Barrierefreiheit implementiert haben, können Sie durch Deklarieren Ihrer App als barrierefrei im Windows Store mehr Kunden erreichen und zusätzliche gute Bewertungen erhalten.

    Weitere Informationen finden Sie unter Deklarieren Ihrer App als barrierefrei im Windows Store. Hinweis: Das Deklarieren der App als barrierefrei ist für Windows Phone nicht relevant.

Verwandte Themen

Barrierefreiheit für Windows-Runtime-Apps mit JavaScript und HTML

 

 

Anzeigen:
© 2014 Microsoft