Als zweites Tool für Webzugänglichkeit von Liberogic haben wir die Chrome-Erweiterung „A11y Navigation Auditor“ veröffentlicht. Dieses Tool visualisiert schnell und präzise die Struktur einer Website und ermöglicht so ein unkompliziertes Vorgehen bei oft übersehenen Problemen. Es wurde entwickelt, um eine umfassende Strukturprüfung zu unterstützen und zuverlässigere Zugänglichkeitsbewertungen zu ermöglichen.
Hintergrund der Entwicklung
Zur Beurteilung der Barrierefreiheit stehen zahlreiche Instrumente zur Verfügung.
Tools, die nur bestimmte Kategorien wie Überschriften und Sehenswürdigkeiten verarbeiten, können das Gesamtbild nicht erfassen.
Die Art, bei der Markierungen auf der Seite überlagert werden, ermöglicht zwar einen Überblick über das Gesamtbild, überfrachtet aber den Bildschirm und erschwert die Vogelperspektive.
Unser Ziel war es, ein Werkzeug zu entwickeln, das diese Lücke schließt, eines, mit dem man sich das Gesamtbild erfassen und es aus der Vogelperspektive betrachten kann, ohne den Bildschirm zu überladen.
Ich habe die Elementlistenfunktion von Bildschirmleseprogrammen, wie zum Beispiel die Rotoranzeige von VoiceOver, als Referenz verwendet.
Durch die Visualisierung im Seitenbereich und das Hinzufügen einer Problemerkennungsfunktion haben wir ein Entwicklertool geschaffen, das leicht verständlich ist und fortgeschrittene Strukturdiagnostik ermöglicht.
Prüfziele und zu erkennende Probleme
▪️Überschrift
Ebenenüberspringung, leere Überschriften, fehlende Rollen usw.
▪️Links
Leerer Text, unklare Formulierungen, doppelte Links usw.
▪️Formular
Fehlende Bezeichnungen, Autocomplete-Attribut, Fehlermeldungen-Zuordnung usw.
▪️ Wahrzeichen
Fehlende Hauptfunktion, Unfähigkeit, zwischen doppelten Rollen zu unterscheiden, und Mängel bei der Unterteilung von Elementen.
▪️Bild
Fehlendes Alt-Attribut, unpassender Alt-Text (z. B. „Bild“), Verwendung falscher Dateinamen usw.
▪️Tabelle
Fehlende Bildunterschriften oder Überschriften sowie Mängel in den Bereichen/Überschriften in komplexen Strukturen.
Hauptmerkmale
▪️WCAG-konforme Problemerkennung
Beachten Sie die WCAG-Erfolgskriterien (1.1.1, 1.3.1, 2.4.4, 3.3.1, 4.1.2 usw.) und zeigen Sie diese in drei Stufen an: Fehler, Warnung und Information.
▪️ Anzeige berechneter barrierefreier Namen
Basierend auf der ARIA-Spezifikation werden die Namen, die Bildschirmleseprogramme tatsächlich vorlesen, und ihre Ableitungen visualisiert.
▪️Echtzeitüberwachung des ARIA-Status
Es erkennt automatisch Zustandsänderungen wie aria-expanded und aria-invalid sowie dynamische Änderungen in barrierefreien Namen wie aria-label, wodurch eine sofortige Bestätigung von Barrierefreiheitsänderungen als Reaktion auf Benutzeraktionen ermöglicht wird.
▪️Zum Hervorheben klicken
Klicken Sie einfach auf ein Element im Bedienfeld, um zum entsprechenden Element zu scrollen und es hervorzuheben. Sie können auch mit den Pfeiltasten Ihrer Tastatur zwischen den Elementen wechseln.
▪️Erweiterte Funktionen für Profis
- Überprüfung versteckter Elemente umschalten
- Automatischer Ausschluss von Drittanbieter-Widgets
- Unterstützt zwei Sprachen: Japanisch und Englisch
Laden Sie den A11y Navigation Auditor hier herunter.
Bei Liberogic ist es unser Ziel, Barrierefreiheit zu einer Standardqualität zu machen und nicht zu etwas, das besondere Aufmerksamkeit erfordert.
Nach unserem ersten Produkt, dem „Area Contrast Checker“, ist der „A11y Navigation Auditor“ ein weiteres Produkt, das genau die Funktionen bietet, die wir in der Praxis dringend benötigten. Wie der Name Navigation Auditor bereits andeutet, möchten wir die Entwicklung von Websites unterstützen, die es jedem ermöglichen, sein Ziel problemlos zu erreichen. Das ist die Idee dahinter.
Wir gestalten die Umsetzung von Barrierefreiheitsrichtlinien einfacher und unkomplizierter. Wir arbeiten bereits an unseren nächsten Tools – seien Sie gespannt!
