Barrierefreiheits-APIs und End-to-End-Tests sind eine hervorragende Möglichkeit, bis zu 50 % der Barrierefreiheitsfehler in Ihrem Unternehmen aufzudecken. Was aber, wenn Ihr Unternehmen noch keine automatisierten Tests eingerichtet hat? Wie können Sie während der Programmierung auf Barrierefreiheitsfehler prüfen?
Zudem werden bei End-to-End-Tests keine spezifischen Benutzerabläufe geprüft. Wie können Sie sicherstellen, dass Sie genau die Benutzerabläufe testen, die für die Einhaltung der Barrierefreiheitsstandards am wichtigsten sind? In diesem Blogbeitrag gehen wir auf diese wichtigen Fragen ein und beleuchten im Detail die Vorteile von End-to-End-Tests im Vergleich zu skriptgesteuerten Tests von Benutzerabläufen im Hinblick auf die Barrierefreiheit.
Vorteile von End-to-End-Tests für die Barrierefreiheit
End-to-End-Tests sind eine Art von Integrationstests, bei denen der „Ablauf“ einer Anwendung von Anfang bis Ende getestet wird. Der Zweck der Durchführung von End-to-End-Tests besteht darin, Systemabhängigkeiten zu identifizieren und sicherzustellen, dass die richtigen Informationen zwischen den verschiedenen Systemkomponenten und Systemen ausgetauscht werden.
Hinweis: Die Verwendung des Begriffs „Flow“ unterscheidet sich in diesem Zusammenhang von einem „User Flow“; im Zusammenhang mit End-to-End-Tests bezeichnet er den gesamten Ablauf einer Anwendung von Anfang bis Ende. Ein „Critical User Flow“ ist eine bestimmte Benutzerfunktion, ein bestimmter Funktionsablauf, eine bestimmte Abfolge oder ein bestimmter Schlüsselpfad, den die Benutzer auf Ihrer Website durchlaufen sollen.
Wenn Ihr Team bereits automatisierte Tests in einer CI/CD-Pipeline wie Selenium, Cucumber oder Jenkins usw. durchführt, lässt sich die axe DevTools -Barrierefreiheits-API nahtlos in die Umgebung Ihrer Wahl integrieren. End-to-End-Tests zur Barrierefreiheit eignen sich hervorragend, um Fehler in der Barrierefreiheit bereits während der Programmierung zu vermeiden und zu beheben.
Hier ist ein Beispiel für den Einsatz von Axe DevTools in mehreren Testumgebungen:

Vorteile von Tests mit vordefinierten Benutzerabläufen
Durch die Überwachung kritischer Nutzerabläufe können Sie die wichtigsten Bereiche Ihrer Website, die nicht zugänglich sind, beheben. Das häufigste Beispiel für einen kritischen Nutzerablauf ist, wenn ein Nutzer einen Artikel in den Warenkorb legt und den Bestellvorgang erfolgreich abschließen kann.
Wie bereits erwähnt, wird bei End-to-End-Tests die Funktionsweise einer Anwendung entweder durch statische Einzelprüfungen oder durch das Testen eines Ablaufs von Anfang bis Ende überprüft. Um kritische Benutzerabläufe zu testen, müssen Sie Unit-Tests für die Barrierefreiheit implementieren.
Nun verfügt nicht jede Organisation über eine Unit-Test-Umgebung in ihrer Testinfrastruktur. Bei Deque heißt unsere Lösung hierfür „axe DevTools CLI“ – eine Komponente von axe DevTools. axe DevTools CLI ist ein Skript-Tool, mit dem sich mehrere Seiten (ähnlich wie bei End-to-End-Tests) und wichtige Benutzerabläufe auf Probleme mit der Barrierefreiheit testen lassen.
Etwas technischer ausgedrückt handelt es sich um eine JavaScript-API und eine CLI, mit denen Webseiten abgerufen und mithilfe der Axe DevTools -Regel-Engine auf Barrierefreiheitsprobleme überprüft werden können. Die Axe DevTools CLI liefert zudem einen detaillierten Bericht zu diesen Problemen – im Gegensatz zu einigen anderen Scan-Tools, die in einem einzigen umfangreichen Bericht lediglich auf die Fehler hinweisen.
Manuelles Testen im Vergleich zu skriptgesteuerten Benutzerablauftests
Durch die Automatisierung lassen sich etwa 50 % aller Barrierefreiheitsprobleme abdecken. Der Rest muss durch manuelle Tests abgedeckt werden. Bei manuellen Tests werden Apps oder Webinhalte mit assistiven Technologien wie NVDA, VoiceOver oder ausschließlich über die Tastatur getestet, um nur einige Beispiele zu nennen.
Ein weiterer großer Vorteil der Tests mit der axe DevTools CLI besteht darin, dass Sie damit bestimmte Interaktionen testen können, die bisher nur durch manuelle Tests möglich waren. So können Sie beispielsweise ein Skript für eine bestimmte Benutzerinteraktion oder ein bestimmtes Verhaltensmuster – wie etwa die Interaktion eines Screenreader-Nutzers – aufzeichnen, um es anschließend automatisch auf der Seite erneut auszuführen und so wiederholte manuelle Tests zu vermeiden.
So identifizieren Sie einen kritischen Benutzerablauf
Wie bereits erwähnt, ist ein kritischer Nutzerablauf das häufigste Anwendungsmuster für Nutzer auf Ihrer Website. Wenn es sich um eine E-Commerce-Website handelt: Wie sieht der durchschnittliche Weg aus, den ein Nutzer zurücklegt, um einen Artikel in den Warenkorb zu legen? Wenn es sich um eine Bank-Website handelt: Wie sieht der direkteste Weg zur Anmeldung in das eigene Konto aus?
Es gibt verschiedene Möglichkeiten, einen kritischen Ablauf zu identifizieren. Dazu müssen Unternehmen beobachten, wie Ihre Nutzer auf Ihrer Website navigieren und mit ihr interagieren.
Um kritische Abläufe zu identifizieren, sollten Organisationen:
- Verfolgen Sie die 15 bis 20 Seiten mit den höchsten Besucherzahlen
- Ermitteln Sie alle Interaktivitätsmuster, die auf diesen Seiten selbst vorhanden sind
- Beobachten Sie bei Nutzertests, wie Nutzer auf Ihrer Website navigieren und mit ihr interagieren
- Kundenbewertungen und Feedback sammeln
Axe DevTools CLI
Nachdem wir nun darüber gesprochen haben, wie man kritische Benutzerabläufe identifiziert, wollen wir uns einige Codeausschnitte aus der axe DevTools CLI ansehen:
Beispiel für eine Spezifikationsdatei, die die Axe DevTools-CLI zum Scannen mehrerer Seiten verwendet:
{
"projects": [
{
"name": "abcdTech Static Scanner",
"id": "abcTechStatic",
"pageList": [
{
"name": "abcdTech homepage",
"url": "http://abcdcomputech.dequecloud.com/"
},
{
"name": "abcdTech Search Results",
"url": "http://abcdcomputech.dequecloud.com/laptopsandnotebooks.php",
"actions": [
"type \"a11y\" into element \"input[name=q]\"",
"click element \"input[type=submit]\"",
"wait for element \"#container\" to be found",
"analyze with title \"search results\""
]
},
{
"name": "abcdTech Desktops",
"url": "http://abcdcomputech.dequecloud.com/desktops.php"
},
{
"name": "abcdTech Support to Cart",
"url": "http://abcdcomputech.dequecloud.com/support.php",
"actions": [
"wait for 5s",
"analyze with title \"Support Page\"",
"click element \"#topnav li:nth-child(4) a\"",
"wait for 5s",
"analyze with title \"Cart page\""
]
}
]
}
]
}
Hier ist ein Beispiel dafür, wie man einen Befehl ausführt, um den Befehl „spec“ zu starten:
aget spec ./specs/abcTechStatic.json ./results/abcTechStatic
Dieser Befehl verwendet die JSON-Spezifikationsdatei, scannt jede Seite mit axe DevTools und speichert die Ergebnisse des Scans anschließend im angegebenen Ordner. Bei der Ausführung werden für jede Seite eine JSON-Datei und ein HTML-Bericht erstellt.
Zusammenfassung
End-to-End-Tests mit Barrierefreiheits-APIs sind eine hervorragende Möglichkeit, Fehler in der Barrierefreiheit bereits während der Programmierung zu erkennen. Falls Ihr Unternehmen jedoch noch keine automatisierte Testumgebung eingerichtet hat, ist die axe DevTools CLI eine hervorragende Lösung, um skriptgesteuerte Benutzerabläufe für die wichtigsten Funktionen Ihrer Website oder Anwendung auszuführen. Selbst wenn Sie bereits über eine End-to-End-Testumgebung verfügen, empfiehlt es sich dennoch, diese spezifischen Benutzerabläufe mithilfe dieser Methodik zu testen. Diese Funktion für skriptgesteuerte Benutzerabläufe kann Ihnen zudem eine umfassendere Abdeckung bieten, da sie Skripte ausführen kann, die assistive Technologien simulieren.