Diplomarbeit

Barrierefreie, Java-Script gestützte Webapplikationen im praxisnahen Umfeld

Mein Berufspraktisches Semester und Diplomarbeit habe ich bei der Full Service Internetagentur Namics am Standort Hamburg absolviert.

 

Mein Thema war die Entwicklung von einigen Applikationen zur barrierefreien Erstellung von Internetseiten. Diese Frontend Widgets wurden auf Basis von HTML, CSS und Java-Script entwickelt und sind unter einer Open Source Lizenz veröffentlicht.

 

Die Diplomarbeit sowie die dazugehörigen Widgets sind unter Open Source Lizenz veröffentlicht und über GitHub, einem Portal zur gemeinschaftlichen Entwicklung auf Basis von Git (einer Art SVN), zu beziehen. Dort finden sich auch Demos der Applikationen, das Wiki (inkl. Download der Dimplomarbeit als PDF) und Bugtracking System. Alternativ kann die ganze PDF bei Google Docs online eingesehen werden.

 

Anfang Januar 2010 wurde die Lizenz von CC-SA-BY zu MIT Lizenz geändert um Kompatibilität mit jQuery zu gewährleisten. Die schriftliche Diplomarbeit steht nach wie vor unter Creative Commons Namensnennung-Weitergabe unter gleichen Bedingungen 3.0 Unported Lizenz veröffentlicht.

Beide Lizenzen ermöglichen eine kommerzielle Verwendung.

 

Inhalt

Vorab erfolgte eine Definition der Zielgruppen und die Erörterung von Gründen für die Erstellung von barrierearmen bzw. barrierefreien Webseiten und deren Applikationen. Dies schließt eine Abwägung der geschäftlichen sowie ethischen Aspekte — anhand von Statistiken und Gesetzen bzw. Richtlinien — und technische Aspekte, zum Beispiel SEO und mobiles Internet ein.

Es wurden folgende Richtlinien untersucht:

 

  • ISO 9241-151 (Leitlinien zur Gestaltung von Benutzerschnittstellen für das World Wide Web)
  • ISO 9241-171 (Leitlinien für die Zugänglichkeit von Software)
  • BITV
  • WCAG 2.0

 

Dem schließt sich die Analyse der von den jeweiligen Zielgruppen verwendeten Hilfsmittel (AT) und der technischen Spezifikationen und Richtlinien an. Daraus ergeben sich mögliche Best-Practice, die für die praktische Umsetzung mit technischen Restriktionen verglichen wurden. Hierbei gehe ich speziell auf die verschiedenen Browserkompatibilität von Screenreadern ein.

Dem theoretischen Teil folgt die Beschreibung der praktischen Umsetzung, aus der eine Art Tool-Box entwickelt werden soll. Die einzelnen umzusetzenden Design Pattern und deren Probleme werden erörtert. Diese werden dann mit den Richtlinien und Spezifikationen verglichen und Lösungsmöglichkeiten werden erarbeitet.

 

Im Zuge der Diplomarbeit wurden die Standard-Applikationen Formular (bzw. dessen Live-Validierung), Lightbox, sortierbare Table und Tabs umgesetzt. Die Widgets wurden in validem XHTML 1.1 Strict , validem CSS 2.0 sowie dem von Namics zumeist verwendeten Java-Script Framework jQuery implementiert. Die Arbeit entspricht den WCAG 2.0 Richtlinien des W3C.

 

Am Ende steht ein Paket aus einfachen Muster-Templates zur Verwendung beim Entwickeln von Webseiten stehen, bestehend aus HTML und CSS sowie Java-Script-Klassen und Code-Elementen, die entsprechend angepasst werden können, um die jeweiligen Projekt-Spezifikationen zu erfüllen. Die Arbeit wurde für den internationalen Einsatz konzipiert, mit speziellem Augenmerk auf den deutschen Markt.

 

Es existiert eine ausführliche Dokumentation der Funktionsweise und Möglichkeiten der Erweiterung.

Projektwebseite

 

Projekt Wiki

 

News im Blog

 

Demos

 

Blog Posts

  • Barrierefreie jQuery Lightbox nach WAI ARIA und WCAG 2.0
  • Barrierefreie Live Validierung von Formularen mit jQuery
  • jQuery UI Tabs barrierefrei erweitern
  • Barrierefreie, sortierbare Tabellen mit jQuery