Der Prototyp der Chrome-Extension »zugangsformen« von Daniela Hach visualisiert Barrieren im Netz.
Hochschule Augsburg. Trotz aller Bemühungen um Inklusion und Barrierefreiheit im Netz hapert es immer noch bei der Umsetzung von für alle Menschen zugänglichen Websites und Apps. Mit diesem wichtigen Thema hat sich Daniela Hach in ihrer Masterarbeit »zugangsformen« im Studiengang Interaktive Mediensysteme auseinandergesetzt. Dazu entwickelte sie den funktionsfähigen Prototyp einer Chrome-Extension, die Websites anhand der vier Kriterien »Leichte Sprache«, »Farbkontraste«, »Barrierefreie Bilder« sowie »Tastatur-Navigation« analysiert und die Ergebnisse dann grafisch darstellt.
Auf den Einzelseiten schlüsselt die Chrome-Extension die gesammelten Daten visuell auf. Von oben: Leichte Sprache als weiße Rechtecke, darunter Kombinationen von Schrift- und Hintergrundfarbe in proportionaler Größe zur Textmenge, Klickweg bei Tastatur-Navigation über eine WebsiteAuf der Übersichtsseite lassen sich die Websites schnell vergleichen. Der NDR ist vorbildlich, was das Thema Bildbeschreibungen (Alt-Texte) angeht, die großen Tageszeitungen scheinen bemüht. Die PAGE-Website mit ihren vielen Bildern hinkt deutlich hinterher. Das werden wir ändern!
Ruft man eine Website auf, erfasst das Plug-in die Farben, Texte und Bilder sowie deren Attribute, etwa CSS, und wertet sie aus. Öffnet man anschließend einen neuen Tab in Chrome, gelangt man zum User Interface der Extension und dort zu den Visualisierungen. Auf einer Übersichtsseite kann man die besuchten Websites hinsichtlich ihrer Barrierefreiheit grob miteinander vergleichen. Klickt man eine der Websites an, gelangt man zu den detaillierten Darstellungen, die sich zudem als Grafiken herunterladen lassen. Die Analysen vermitteln eine sehr konkrete Vorstellung davon, wie (un)zugänglich die besuchten Websites für Menschen mit Behinderungen sind.
887 Tabs benötigen User ohne grafisches Interface, um sich einmal durch die »FAZ«-Startseite zu klicken
Um das Thema Inklusion auch außerhalb der digitalen Medien in die Öffentlichkeit zu tragen, hat Daniela Hach an eine Plakatserie im öffentlichen Raum oder eine Ausstellung gedacht. Die großflächige Inszenierung wäre eine Möglichkeit, das Interesse der Betrachtenden zu wecken und ihnen Gelegenheit zu bieten, sich mit der Thematik auseinanderzusetzen. In diesem Format käme auch die ästhetische Qualität ihrer Datenvisualisierungen besonders schön zur Geltung.
Vielen ist gar nicht klar, dass sie selbst zur Barrierefreiheit beitragen können, etwa indem sie die Bilder auf Websites inhaltlich benennen und beschreiben. Eine »zugangsformen«-Ausstellung mit Daniela Hachs Datenvisualisierungen könnte dafür ein Bewusstsein schaffen
Plakatreihen im öffentlichen Raum würden auch für das Thema sensibilisieren
Die vier Analysekriterien und ihre grafische Umsetzung
Leichte Sprache
Die Extension stellt jedes Wort auf der Website als Rechteck dar, dessen Breite von der Wortlänge abhängt. Wörter mit mehr als zwölf Buchstaben erscheinen in Schwarz, Sätze mit mehr als zwölf Wörtern als schwarze Balken.
Farbkontraste
Die verschiedenen Kombinationen von Schrift- und Hintergrundfarbe werden jeweils als eigenes Feld dargestellt, dessen Größe der Anzahl der Wörter einer Kombination entspricht. Bei Mouseover zeigt die Extension den genauen Kontrastwert und die Schriftgrößen an.
Barrierefreie Bilder
Verwendete Bilder werden als Kreise wiedergegeben. Je nachdem, ob die Screenreader sie ignorieren (a), sie nicht ignorieren, aber keinen Alt-Text finden (b) oder den Alt-Text vorlesen (c), sind die Kreise nicht ausgefüllt (a), mit der Hauptfarbe, aber nicht mit Bild (b) oder mit beidem (c) gefüllt.
Tastatur-Navigation
Die Extension speichert alle per Tab-Taste erreichbaren Elementen mit ihrer Position auf der Website und verbindet sie durch eine Linie. Dies verdeutlicht die mitunter sehr langen Klickwege von Nutzern, die grafische Interfaces nicht bedienen können.
Auch in Zukunft möchte Daniela Hach digitale Projekte in kulturellen und sozialen Kontexten umsetzen. Momentan arbeitet sie an einem digitalen Wegweiser für Menschen mit Behinderungen
Branding by/for Creatives ++ KI-Tools im Packaging Design ++ UX Design: Accessibility ++ ENGLISH SPECIAL Cari Sekendur ++ Game-Experience für Metaverse und Stores ++ Hybride Lehr- und Lehrumgebung »hands on« ++ Making-of: Type-Tool Burrowlab ++ Algorithmen und der Verlust der Diversität
Es handelt sich um den funktionsfähigen Prototyp einer Chrome-Extension. Wir haben ihn getestet, aber die Extention ist noch in der Entwicklung. Hierbei geht es in erster Linie darum, durch die Visualisierung ein deutlicheres Bewusstsein für Barrieren zu schaffen. Um Barrieren im Web abzubauen, braucht es diese Extension hingegen nicht. Dazu muss man u.a. auf leichte Sprache beim Schreiben achten oder Bildbeschreibungen, aber das steht ja alles schon im Artikel.
D. Veverka schreibt
Interessanter Artikel und vielversprechendes Projekt – alleine die angesprochene Chrome Extension ist nirgendwo (mehr?) aufzufinden. Conclusio: nettes Design-Projekt, stiftet aber keinerlei nachhaltigen Nutzen … schade um das ambitionierte Ziel Barrieren im Web abzubauen.
Auch in Zukunft möchte Daniela Hach digitale Projekte in kulturellen und sozialen Kontexten umsetzen. Momentan arbeitet sie an einem digitalen Wegweiser für Menschen mit Behinderungen
Es handelt sich um den funktionsfähigen Prototyp einer Chrome-Extension. Wir haben ihn getestet, aber die Extention ist noch in der Entwicklung. Hierbei geht es in erster Linie darum, durch die Visualisierung ein deutlicheres Bewusstsein für Barrieren zu schaffen. Um Barrieren im Web abzubauen, braucht es diese Extension hingegen nicht. Dazu muss man u.a. auf leichte Sprache beim Schreiben achten oder Bildbeschreibungen, aber das steht ja alles schon im Artikel.
Interessanter Artikel und vielversprechendes Projekt – alleine die angesprochene Chrome Extension ist nirgendwo (mehr?) aufzufinden. Conclusio: nettes Design-Projekt, stiftet aber keinerlei nachhaltigen Nutzen … schade um das ambitionierte Ziel Barrieren im Web abzubauen.