Testen auf Barrierefreiheit

Lernziele

Nachdem Sie diese Lektion abgeschlossen haben, sind Sie in der Lage, die folgenden Aufgaben auszuführen:

Erläutern, warum es wichtig ist, zusätzlich zu den automatisierten Tests auch manuelle Barrierefreiheitstests durchzuführen
Zusammenfassen der Schritte beim Ausführen von Tastatur- und Fokusverwaltungstests unter MacOS
Benennen der Prüfungen, die beim Durchführen von Bildschirmlesetests mit VoiceOver abzuschließen sind
Erkennen der Elemente, die in Ihre Testpläne für Barrierefreiheit aufgenommen werden müssen
Beschreiben von Strategien für effektive manuelle Barrierefreiheitstests

Verstehen der Wichtigkeit manueller Tests

Zwar können automatisierte Barrierefreiheitstests viele Probleme aufdecken, sie berücksichtigen aber keinen Kontext und erkennen keine differenzierteren Barrierefreiheitsprobleme. Und manchmal entgehen ihnen sogar erhebliche Probleme. Deshalb ist es entscheidend, dass Sie außerdem manuelle Tests durchführen, und um darüber hinaus alle Barrieren zu erkennen, die von automatischen Tests nicht erkannt wurden. Mit manuellen Tests können Sie ferner Probleme überprüfen, die Sie während der automatisierten Tests aufgedeckt haben, und falsch positive Ergebnisse bestimmen.

Ein Entwickler, der manuelle Barrierefreiheitstests durchführt.

Im Gegensatz zu automatisierten Barrierefreiheitstests wird bei manuellen Tests die gesamte Benutzerführung bewertet, um das Erleben eines Benutzers zu simulieren, der eine Behinderung hat oder unterstützende Technologien verwendet. Beispielsweise simulieren manuelle Tastaturtests, wie ein Benutzer Ihre Software nur mithilfe einer Tastatur bedient, während manuelle Bildschirmlesetests simulieren, wie ein sehbehinderter Benutzer Ihre Software erlebt.

Werfen wir einen genaueren Blick auf das manuelle Testen der Barrierefreiheit, beginnend mit Tastatur und Fokusverwaltung.

Durchführen von Tastatur- und Fokusverwaltungstests

Tastatur- und Fokusverwaltungstests stellen hervorragende Verfahren dar, um sicherzustellen, dass Benutzer auf der Benutzeroberfläche auf einfache und erwartete Weise navigieren und mit ihr interagieren können.

Sie untersuchen bei Tastaturtests Fragen wie diese:

Sind die Inhalte über eine Reihe verschiedener Eingabemethoden zugänglich? Die Nutzer sollten in der Lage sein, mit verschiedenen Eingabegeräten, wie Sprachbefehlen, Touchscreens und Schalterelementen, durch die Inhalte zu navigieren. Wenn Inhalte nur verfügbar sind, wenn die Maus darüber bewegt wird, haben die Nutzer von Touchscreens, Spracheingaben und Tastatursteuerungen keinen Zugriff.
Ist die Fokusreihenfolge logisch? Die Fokusreihenfolge bezieht sich auf die Reihenfolge, in der interaktive Elemente – wie Links, Schaltflächen und Formularfelder – den Fokus erhalten. Eine unlogische Fokusreihenfolge kann die Navigation erschweren.
Können Benutzer in den Inhalten effizient und konsistent navigieren? Unerwartete Änderungen in der Navigation, wie z. B. unterschiedliche Tastatureingaben oder Befehle, stellen für Endbenutzer eine Herausforderung dar, insbesondere, wenn sie unterstützende Technologien verwenden.
Können alle Benutzer durch diese Inhalte navigieren? Berücksichtigen Sie Personen mit Beeinträchtigungen der Motorik, der Geschicklichkeit und des Sehvermögens.

Bei Tests auf einem Mac müssen Sie den vollständigen Zugriff über die Tastatur in den Systemeinstellungen für die Tastatur aktivieren. Führen Sie die folgenden Schritte durch.

Aktivieren der Tastaturnavigation unter MacOS

Öffnen Sie die Tastatur-Einstellungen in den Systemeinstellungen.
Wählen Sie die Registerkarte Tastaturkurzbefehle aus.
Aktivieren Sie unter "Vollständiger Tastaturzugriff" Alle Steuerelemente.

Registerkarte 'Tastaturkurzbefehle' des Bildschirms 'Tastatureinstellungen' in MacOS mit hervorgehobener Feldgruppe 'Vollständiger Tastaturzugriff' und aktivierter Option 'Alle Steuerelemente'

Aktivieren Sie den Tastaturzugriff für Safari

Öffnen Sie in Safari die Einstellungen.
Wählen Sie die Registerkarte Erweitert aus.
Aktivieren Sie unter Barrierefreiheit die Einstellung Über Tabulator jedes Objekt auf einer Webseite hervorheben.

Navigieren Sie auf einer Webseite mit diesen Tasten.

Verwendung:	Zweck:
TAB und UMSCHALT+TAB:	Navigieren Sie durch Links, Eingabefelder und andere interaktive Steuerelemente. Mit TAB bewegen Sie sich vorwärts durch die Benutzeroberfläche, mit UMSCHALT+TAB rückwärts. Erschrecken Sie nicht, wenn Sie nicht alle Elemente der Seite mit der Tabulatortaste ansteuern können, sondern nur interaktive Elemente.
STRG+TAB	Navigieren Sie durch Frames.
Eingabetaste	Aktivieren Sie Links.
Eingabe- und Leertaste:	Aktivieren Sie Schaltflächen.
Leertaste	Aktivieren Sie Eingabefeldkontrollkästchen und wählen Sie Dropdown-Menüs aus.
Nach-oben- und Nach-unten-Taste	Navigation in Menüs und Auswahllisten und automatisches Ausfüllen von Dropdown-Menüs.
Nach-links- und Nach-rechts-Taste	Navigieren Sie durch Registerkarten in einer Registerkartengruppen oder einem Karussell.
ESC	Schließen Sie Menüs, modale Fenster und Bereiche.

Können Sie jedes interaktive Element erreichen und seine Aktion auslösen?

Bei einigen komplexen Komponenten mit mehreren interaktiven Elementen gehen die Tastaturinteraktionen über die grundlegenden Interaktionen hinaus. Hierzu gehören z. B. Kombinationsfelder, Menüs, Datenraster, nicht modale und modale Dialogfelder und Registerkartengruppen. Diese Tastaturinteraktionen folgen bestimmten Erwartungen, wie sie vom World Wide Web Consortium (W3C) in ARIA Authoring Practices definiert werden.

Die Salesforce-Tastaturrichtlinien basieren auf diesen Erwartungen und werden in den React-Komponentenbibliotheken von Lightning und Lightning Design System verwendet. Auf der Lightning Design System 2-Website haben wir einige hilfreiche Ressourcen zusammengestellt, die Sie beim Erstellen und Testen solcher Komponenten unterstützen.

Leitlinien zur Barrierefreiheit durch Tastaturinteraktion: Eine Checkliste mit manuellen Tastaturtests
Globale Leitlinien für Barrierefreiheit durch Fokus: Tipps zum erwarteten Verhalten für die Fokusverwaltung
Barrierefreiheit: HTML- und Interaktionsspezifikationen für gängige Widgets/Muster

Testen der Tastaturnavigation

Prüfen Sie beim Testen der Tastaturnavigation die folgenden Punkte:

Ob die Reihenfolge der Ansteuerung mit der Tabulatortaste logisch ist. Verwenden Sie die Tastatur, um sich mithilfe der Tabulatortaste durch Ihre Anwendung zu bewegen. Die standardmäßige Navigationsreihenfolge sollte logisch sein und sich natürlich anfühlen.
Ob der Tastaturfokus sichtbar ist Verwenden Sie die Tastatur für die Navigation zu einer Seite und prüfen Sie, ob das Element mit dem Tastaturfokus optisch gekennzeichnet wird.

Ob interaktive Elemente den Fokus erhalten Navigieren Sie mithilfe der Tastatur innerhalb einer Seite. Prüfen Sie, ob alle Schaltflächen, Links, Formularfelder, Registerkarten und anderen interaktiven Elemente den Tastaturfokus akzeptieren. Wenn ein Benutzer auf ein Element klicken oder den Mauszeiger darauf bewegen kann, um eine Aktion durchzuführen oder Informationen einzublenden, dann muss das Element den Tastaturfokus akzeptieren.

Navigation zu interaktiven Elementen ist möglich. Prüfen Sie, ob Sie zu allen interaktiven Elementen wie Menüs, modalen Fenstern, Drag & Drop-Elementen, Registerkartengruppen, Bereichen und automatisch ausgefüllten Dropdown-Menüs navigieren können. Stellen Sie sicher, dass Sie Elemente mithilfe der Tastatur auswählen und aktivieren können.

Navigation in modalen Dialogfeldern ist möglich. Verwenden Sie die Tastatur, um ein modales Dialogfeld zu öffnen, darin zu navigieren und jedes darin enthaltene Steuerelement zu bedienen. Prüfen Sie, dass Sie nur mit dem aktuellen modalen Fenster interagieren können und nicht mit der Seite dahinter. Wenn ein modales Fenster geöffnet ist, sollte der Fokus auf dieses Fenster beschränkt sein. Stellen Sie sicher, dass der Fokus beim Schließen des modalen Fensters an die richtige Stelle auf der Seite zurückkehrt.

Beachten Sie, dass Tastaturtests und Bildschirmlesetests nicht ein und dasselbe sind. Probieren Sie Tastaturtests aus, bevor Sie mit einem Bildschirmlesegerät testen, um viele Probleme aufzudecken, die von einem Bildschirmlesegerät möglicherweise nicht erkannt werden.

Wir empfehlen, Bildschirmleseprogramme sowohl unter macOS als auch Windows zu testen. MacOS verfügt über ein eingebautes Bildschirmleseprogramm namens VoiceOver, das das ausgewählte Element laut ausspricht und dessen Beschriftung oder Alt-Text vorliest. Finden Sie bei Tests mit einem Bildschirmleseprogramm heraus, ob Ihr Alt-Text korrekt ist, und nehmen Sie dann die erforderlichen Anpassungen vor.

Hier finden Sie einige einfache Prüfungen, die Sie mit VoiceOver unter MacOS durchführen können.

Verwenden Sie CMD+F5, um VoiceOver ein- und auszuschalten.
Verwenden Sie CMD+u, um den Web Rotor zu öffnen.
Prüfen Sie mit Web Rotor Folgendes:
- Links und Schaltflächen haben präzise, aussagekräftige Bezeichnungen.
- Überschriften haben die richtige Reihenfolge.
- Die Seite verfügt über gute Orientierungspunkte.
Navigieren Sie mit der Tabulatortaste durch die Benutzeroberfläche, um Folgendes zu prüfen:
- Bei bearbeitbaren Feldern werden die Bezeichnung, der Eingabetyp und das Wort 'Bearbeiten' angesagt.
- Bei Registerkartengruppen wird angegeben, welche Registerkarte ausgewählt ist, und man kann mit den Pfeiltasten darin navigieren.
- Wenn Kontrollkästchen mithilfe der Leertaste umgeschaltet werden, wird ihr Zustand hörbar angesagt.

Machen Sie sich keine Gedanken, wenn Sie nicht jedes Inhaltselement erreichen, wenn Sie mit einem Bildschirmleseprogramm durch eine Benutzeroberfläche navigieren. Nutzer von Bildschirmleseprogrammen verwenden spezielle Tastenkombinationen, mit denen sie Element für Element durch die Seite navigieren können (nicht interaktive Elemente eingeschlossen), daher muss mit der Tabulatortaste nicht alles zugänglich sein (und sollte es auch nicht). Bei VoiceOver können Sie Ctrl+Option+Nach-links-Taste oder Ctrl+Option+Nach-rechts-Taste verwenden, um linear rückwärts bzw. vorwärts durch den Inhalt der Seite zu lesen.

Unter Windows empfehlen wir die Verwendung von NVDA.

Führen Sie Barrierefreiheitstests mit mehreren Bildschirmleseprogrammen durch. Wenn Sie nur mit VoiceOver testen, entgehen Ihnen möglicherweise bestimmte Probleme, die mit anderen Bildschirmleseprogrammen wie JAWS oder NVDA erkannt werden.

Wenn Sie ein Bildschirmleseprogramm zum Testen verwenden und sonst nicht regelmäßig mit einem solchen Programm arbeiten, besteht ein hohes Risiko für Benutzerfehler. In den A11ycasts-Videos im Abschnitt "Ressourcen" erfahren Sie mehr über die Feinheiten der Verwendung von Bildschirmlesegeräten.

Schreiben von Plänen für Barrierefreiheitstests

Machen Sie Barrierefreiheit zu einem Bestandteil Ihres Testplans, indem Sie sie in Ihre Komponentenspezifikationen, Akzeptanzkriterien und User Stories aufnehmen.

Beispiel: App Launcher

Wählen Sie aus, um den App Launcher zu öffnen. Im App Launcher können Benutzer nach Anwendungen suchen, Anwendungen öffnen, Beschreibungen von Anwendungen lesen und die Anordnung von Anwendungen ändern.

App Launcher mit erweitertem Abschnitt 'Alle Anwendungen'

Welche Testfälle können Sie für das Neuanordnen von Anwendungen erstellen?

Hier sehen Sie einen Beispiel-Testplan für verschiedene Anwendungsfälle im Zusammenhang mit dem App Launcher.

Kontextinfo: Funktionalität bezeichnet das, was ein Produkt oder System auszuführen vermag – seine Merkmale und Aktionen. Aufforderung (Affordance) ist ein Entwurfselement, das ausgehend von seinem Aussehen oder Verhalten vorschlägt, wie ein Objekt verwendet werden sollte.

Typ	Maus	Tastatur	Bildschirmleseprogramm
Funktionalität	Klicken auf Kachel öffnet die Anwendung	Drücken der Eingabetaste auf Kachel öffnet Anwendung	Hier gelten alle an die Tastatur gestellten Erwartungen
Interaktionsangebot	Kachel zeigt Verschiebecursor, wenn Mauszeiger darauf bewegt wird	Schaltfläche zum Verschieben der Kachel hat Fokus und ist deutlich optisch gekennzeichnet	Benutzer wird über mögliche Interaktionen informiert
Funktionalität	Durch Anklicken der Kachel und Halten der Maustaste wird Ziehen ausgelöst	Leertaste löst Ziehmodus aus	Auswahlzustand, Position und Anweisungen werden angesagt, wenn Benutzer Ziehmodus aktiviert
Interaktionsangebot	Ziehmodus ist optisch deutlich erkennbar (Kachel ist schief mit blauem Rand)	Ziehmodus ist optisch deutlich erkennbar (Kachel ist schief mit blauem Rand)
Funktionalität	Mausbewegung im Ziehmodus bewegt Kachel	Pfeiltasten bewegen Anwendung an nächste/vorherige Position in Liste
Interaktionsangebot	Benutzer sieht Vorschau auf Anwendungsposition	Benutzer sieht Vorschau auf Anwendungsposition	Anwendungsposition wird bei Änderung angesagt
Funktionalität	Loslassen der Maustaste beendet Ziehmodus	Drücken der Eingabetaste beendet Ziehmodus	Finale Position und Auswahlzustand werden angesagt, wenn ein Benutzer den Ziehmodus beendet

Welche weiteren Testfälle können Sie hinzufügen? Wie führen Sie die Tests durch? Wir können zwar automatisierte Tests für die Bildschirmleser-Attribute und das Tastaturverhalten schreiben, doch Sie sollten trotzdem einige manuelle Tests durchführen, um sicherzustellen, dass die Benutzererfahrung nahtlos ist.

Verwenden von Strategien für manuelles Testen

Sind Sie bereit, alles zusammen zu bringen? Hier sind einige Strategien für das Durchführen effektiver manueller Barrierefreiheitstests.

Testplan schreiben

Sie können Folgendes aufnehmen:

Aufrufen von $A.test.assertAccessible für wichtige optische Zustände (für Komponententests).
Manuelle Prüfung des Tastaturablaufs.
Sonstige Besonderheiten Ihres Anwendungsfalls.

Früh und häufig testen

Beim Entwickeln von Benutzeroberflächen gilt:

Testen Sie manuell.
Aktivieren Sie die Testautomatisierung.
Suchen Sie nach Möglichkeiten, Barrierefreiheitstests mit benutzerdefinierten Tests zu kombinieren.

Fehler protokollieren und beheben

Bei Salesforce haben Barrierefreiheitsfehler Vorrang, unabhängig von der Anzahl der Benutzer, die sie betreffen. Für Benutzer, die von diesen Fehlern betroffen sind, können sie ein grundlegendes Hindernis für die Erledigung ihrer Arbeit darstellen. Unabhängig davon, wie Ihr Unternehmen Fehler priorisiert, sollten Sie sich dafür aussprechen, nicht gelöste Barrierefreiheitsprobleme auf ein Minimum zu beschränken

Durch das Durchführen sowohl automatisierter als auch manueller Tests auf Barrierefreiheit und das Entfernen von Zugangsbarrieren bieten Sie ein wirklich inklusives digitales Erlebnis, an dem jeder teilnehmen und das er genießen kann!

Geschätzte Zeit

Themen