Zum Hauptinhalt springen Skip to page footer

Barrierefreies Responsive Webdesign mit TYPO3 CMS

Projekt: Online-Bildungsberatung VHS Wien barrierefrei in TYPO3 CMS

Screenshot Startseite TYPO3-Projekt Online-Bildungsberatung

Startseite TYPO3-Projekt Online-Bildungsberatung

User Interface der Beratungssoftware

Beratungssoftware in TYPO3 integriert

  • Grafisches Konzept/User Interface für Website und Beratungsanwendung
  • Responsive Webdesign, barrierefrei
  • TYPO3-Umsetzung
  • Umsetzung Barrierefreiheit
  • Integration Beratungssoftware
  • Software-Tests, Screenreader-Test, Projektberatung
  • Design für Social Media Portal (Facebook)

Das Projekt Online-Bildungsberatung Österreich stellt einen direkten schriftlichen Dialog zwischen Beratungs-Suchenden und Beratern/Beraterinnen zu allen Fragen der Bildung her. Besucher können sich anonym, auf Wunsch auch ohne Email-Adresse, registrieren und können über eine eigene Mailbox sowie verschiedene Chatfunktionen Kontakt zu Beratern herstellen. 

Konzept und Webdesign

Grafisches Ziel des Projektes war ein modernes, zielgruppengerechtes und gemeinsames Erscheinungsbild der Online-Bildungsberatung für alle teilnehmenden österreichischen Bundesländer. Das Design sollte frisch und geradlinig sein, gegenüber dem bisherigen Portal vor allem aber auch über eine wesentlich bessere Usability und Accessibility verfügen. 

Pixel Melange erarbeitete eine grundlegende Neugestaltung, die unter anderem aus neuem Schriftzug, allgemeinem Schriftbild und Typografie, Farbprofil, Leitmotiv und einer Übertragung der Web-Gestaltung auf die Social-Media-Kanäle besteht. Auf Basis der neuen Gestaltung wurde auch das Facebook-Profil angepasst. Die zu integrierende Beratungssoftware, eine bestehende TYPO3-Erweiterung, sollte sich möglichst nahtlos in das Gesamt-Design integrieren und so den bisherigen „Bruch“ zwischen einer (Einstiegs-)Website und einem Beratungsportal verschwinden lassen. 

TYPO3 CMS

Als technische Basis für das Projekt wurde TYPO3 CMS herangezogen, das einerseits Grundvoraussetzung für die Integration der Beratungssoftware war, andererseits durch seine Flexibilität und Anpassbarkeit für die Umsetzung von barrierefreien Webprojekten optimal geeignet ist. 

Einen Großteil der technischen Projektarbeit nahmen Maßnahmen zur Verbesserung der Barrierefreiheit der Fremdsoftware (TYPO3-Erweiterung) sowie die Qualitätssicherung für den Anmelde- und Beratungsprozess in Anspruch. Denn Fehler und eine unzureichende Zugänglichkeit in der Beratungssoftware bzw. deren Implementierung waren schließlich einer der Hauptgründe für die bisher unzureichende Akzeptanz und/oder einen Abbruch durch die Beratungskunden gewesen. Zuverlässigkeit und eine robuste Implementierung hatten deshalb oberste Priorität.

Die Umsetzung erfolgte in „Responsive Design“, das heißt Interface und Menüführung passen sich automatisch an Desktop-, Tablet- und Mobilgeräte an – je nach zur Verfügung stehender Bildschirmfläche. 

Barrierefreies Webdesign

Das Projekt wurde grundsätzlich WAI-AA-konform umgesetzt. Bei der zu integrierenden Beratungssoftware wurde eine Reihe von Maßnahmen gesetzt, um mit einem vertretbaren Aufwand eine möglichst barrierearme Implementierung zu erreichen. Zur Kontrolle und Optimierung wurde ein Screenreader-Test durch externe Screenreader-Nutzer durchgeführt, der das sehr gute Ergebnis dokumentiert und zusätzlich Verbesserungsmöglichkeiten – speziell für Screenreader-Nutzer – aufzeigt, die nach und nach umgesetzt werden. 

Ein hoher Testaufwand und eine möglichst lückenlose Qualitätssicherung sind neben entsprechendem Know-how für eine hohe Qualität im Bereich Barrierefreiheit zwingend. Pixel Melange greift auf eine langjährige Erfahrung mit barrierefreien Web-Projekten zurück: Bereits 2006 gab es eine „BIENE“ beim renommierten BIENE-Award in Berlin, später den Sonderpreis Barrierefreiheit beim ebiz egovernment Award in Wien und den alternativen Medienpreis im Bereich Internet für die Chronologie des Holocaust. 

In den vergangenen Jahren wurden eine Reihe barrierefreier Webprojekte umgesetzt, unter anderem für das österreichische Bundeskanzleramt, den Wiener Musikverein oder die Deutsche Verkehrswissenschaftliche Gesellschaft.