Icinga Web 2 – Barrierefreiheit im HTML

Nachdem der Kollege Johannes Meyer letztens über die Barrierefreiheit im Icinga Web 2 (Icinga Web 2 – Das kann Jeder) schon berichtet hat, so würde ich gerne ein paar Beispiele auf der HTML Ebene aufzeigen, was nun barrierefrei ist und was nicht.
Ein klassischer Fall sind die IMG Tags, viele bieten keine Text-Alternativen an, somit ist z.B. jemandem mit einer Sehbehinderung nicht klar, was da auf dem Bild drauf ist oder was es repräsentieren soll.
Falsch: <img src="xyz.jpg" />
Richtig: <img src="xyz.jpg" alt="Icinga Web 2 Logo" />
Perfekt: <img src="icinga_web2_logo.jpg" alt="Icinga Web 2 Logo" />
Und wenn wir auf das Thema Semantik angehen wollen, so ist z.B. allein durch die Schriftgröße nicht sichergestellt ob es sich um eine Überschrift handelt oder nicht.
Falsch: <span style="font-size: 150%;">Überschrift</span>
Richtig: <h1>Überschrift</h1>
Wie gesagt, das sind jetzt nur ein paar Beispiele und es gibt noch viele weitere Sachen wie man etwas macht und nicht macht um die Barrierefreiheit zu verbessern bzw. zu gewährleisten und genau um solche Sachen und viele weitere kümmern wir uns gerade.

Icinga Web 2 – Das kann Jeder

Das letzte mal habe ich zur Internationalisierung in Icinga Web 2 ein wenig aus dem Nähkästchen geplaudert. Heute widme ich mich einem ähnlichen, allerdings ungleich weniger beachtetem Thema:

Barrierefreiheit

Gerade im Bereich Open Source ist es nicht selten, dass Software nicht oder erst weit nach dem erstmaligen produktiven Einsatz, angesichts dem immer weiter zunehmenden Interesse und der Integration benachteiligter Individuen, überarbeitet oder erweitert wird. Zumeist liegt dies am Entwicklungsmodell. Jemand benötigt etwas oder ist unzufrieden mit den bereits existierenden Lösungen, entwickelt seine eigene Lösung und macht diese der Öffentlichkeit zugänglich welche dann durch interessierte Nutzer erweitert werden kann. In der Mehrzahl solcher Gegebenheiten ist die Zahl der tatsächlichen Anwender meist nicht oder nur bedingt absehbar, weshalb die Barrierefreiheit nicht berücksichtigt wird.
In Projekten, die von großen Unternehmen entwickelt oder in Auftrag gegeben werden, besteht allerdings meist ein spezielles Interesse an diesem Thema. Das Produkt muss entweder aus Vertrieblichen Gründen oder aus vorgeschriebenen Unternehmens-Richtlinien vollständig Barrierefrei sein, bevor es verkauft bzw. produktiv eingesetzt werden darf. Da vor einiger Zeit ein großes deutsches Unternehmen an uns heran getreten ist, wird sich das Team Web die nächsten Wochen vermehrt damit beschäftigen, Icinga Web 2 bis nur finalen Version Barrierefrei zu gestalten.
Wir werden uns an zwei bestimmten Standards orientieren, sie jedoch nicht in Gänze erfüllen. Gerade der „WCAG“ Standard beschreibt sehr viele Anforderungen, dessen Aufwand sehr hoch, die Relevanz für Icinga Web 2 wir jedoch entweder zu gering oder noch nicht einschätzen können.
Web Content Accessibility Guidelines (WCAG) sowie Teile der ISO 9241
Diese beiden Standards beschreiben die Grundzüge der Barrierefreiheit in modernen Web-Applikationen sowie die Anforderungen an eine erfolgreiche Interaktion zwischen Mensch und Maschine:

  • Farben & Kontraste
  • Dialoge
  • Bedienung
  • Navigation
  • Lesbarkeit
  • Verständlichkeit

Accessible Rich Internet Applications Suite (ARIA)
Dieser Standard erweitert HTML, sodass Bildschrimleser fehlerfrei innerhalb der Web-Applikation navigieren können und erweiterte Funktionen die sonst nur mit der Maus zugänglich wären, auch über die Tastatur vollständig nutzbar zu machen.
Außerdem werden wir sicherstellen, HTML auch semantisch korrekt zu verwenden. Das allseits beliebte <div> steht somit ganz oben auf dem Prüfstand.
Am Ende werden viele Verbesserungen direkt in das Framework eingepflegt worden sein, doch alle Anpassungen, die Icinga Web 2 in seiner grafischen Funktionalität bzw. der Vielfalt der Bedien-Elemente beschränken, werden mittels eines dedizierten Moduls realisiert.
Sobald alles fertig ist, kann sich niemand mehr raus reden, er habe die vielen kritischen, tief roten Anzeigen übersehen. Die sieht doch selbst ein Blinder, im wahrsten Sinne des Wortes. 😀

Johannes Meyer
Johannes Meyer
Developer

Johannes ist seit 2011 bei uns und hilft bei der Entwicklung zukünftiger Knüller (Icinga2, Icinga Web 2, ...) aus dem Hause NETWAYS.