Das Webangebot von FlixBus im Praxis-Test

Vor allem bei Menschen, die aufgrund ihrer Beeinträchtigung kein eigenes Fahrzeug führen können oder dürfen, sind öffentliche Verkehrsmittel aus dem Alltag meist nicht wegzudenken. Neben dem öffentlichen Personennahverkehr (ÖPNV) spielen vor allem Bahn und Fernbusse eine Rolle — und hier ganz besonders Flixbus.

FlixBus ist Deutschlands größter Fernbusanbieter. Dahinter steht die FlixMobility GmbH, ein junger Mobilitätsanbieter mit Sitz in München. Seit 2013 ist – unter der Marke FlixBus – eine stetig wachsende Fernbus-Flotte auf einem Streckennetz in ganz Europa unterwegs. Seit 2018 bietet das Unternehmen unter der Marke FlixTrain zudem erste Schienenverkehre an.

Basis ihres Erfolgs – so der Fernbusanbieter auf seiner Website – sei die Digitalisierung des Buchungs- und Ticketingsystems. Doch wie gut sind die digitalen Angebote für Menschen mit Behinderungen nutzbar?

Patrick Dembinski, zukünftiger IT-Kaufmann und von Geburt an blind, hat sich die Website flixbus.de angeschaut. Mit seinem Bildschirmleseprogramm, dem Screenreader JAWS, hat er beispielhaft einen Buchungsvorgang durchlaufen und dokumentiert, was gut und was weniger gut funktioniert. Er möchte Hinweise geben, um die Zugänglichkeit der digitalen Angebote des Mobilitätsanbieters zu verbessern.

Dembinskis Vorhaben passt gut in unser Projekt „Team Usability“, da wir anhand seines praktischen Testablaufs Fragen klären können, die für die Methodenentwicklung wichtig sind, etwa

• Welche Vorgaben sind für einen Praxis-Test sinnvoll?
• Was sind geeignete Formate, um Testabläufe und -ergebnisse zu dokumentieren?
• Welche Arbeitsweisen eignen sich für das Testen im Team?
• Wie valide oder aussagekräftig sind - verglichen mit einem Expertentest - die Testergebnisse und wie lässt sich die Validität verbessern?

Dembinskis Untersuchungsergebnisse wurden daher von seiner sehenden Kollegin Simone Lerche analysiert und qualitätsgesichert. Zusätzlich wurden einzelne Barrierefreiheits-Aspekte für visuelle Nutzer ergänzt, etwa zu Kontrastverhältnissen und Tastaturbedienbarkeit. Die Analyse des Testablaufs und die Zusammenarbeit im Team werden im Artikel Der FlixBus-Test – Ein Test-Szenario, viele Erkenntnisse zusammengefasst.

Als blinder Nutzer eine FlixBus-Verbindung suchen und buchen

Testumgebung: PC, Screenreader: JAWS 2019/ fallweise NVDA 2019.2, Browser: Mozilla Firefox Quantum 69.0.1 (allgemeiner Hinweis: Die Testergebnisse von Nutzern können je nach Screenreader- und Browser-Kombination bzw. aufgrund individueller Nutzungspattern variieren).

Ruft man die FlixBus-Website auf, bietet sie einem direkt auf der Startseite die Möglichkeit, nach einer Verbindung zu suchen. Das erfahren aber nur visuelle Nutzer. Als Screenreader-Nutzer erreiche ich das Element für die Verbindungssuche ohne Vorwarnung, indem ich das, laut JAWS: „Berlin Eingabefeld“ erreiche und mir zusammenreime, was dies sein könnte. Hilfreich wären hier eine aussagekräftige Beschriftung der Suchmaske sowie der einzelnen Formularfelder. Platzhaltertext hingegen sollte nicht als Beschriftung dienen.

Auswahl von Start- und Zielhaltestellen

In den ersten beiden Formularfeldern für die Start- und Zielhaltestellen sind bereits Werte vordefiniert (von: Berlin und nach: München). Der vordefinierte Ort für den Startpunkt hat allerdings nichts mit dem eigenen Standort zu tun. Ganz unabhängig von Fragen der Barrierefreiheit: Komfortabel wäre hier eine Vorbelegung mit dem korrekten Standort. So muss ich als Nutzer in das bereits erwähnte „Berlin Eingabefeld“ den Startpunkt hinterlegen: Nach manueller Eingabe eines Ortes, in meinem Fall Hamburg, denke ich, dass ich die von mir geforderte „Eingabe“ erfüllt habe. Doch beim Weitertabben setzt sich meine Eingabe wieder zurück auf den ursprünglichen Wert "Berlin". Das ist mir im ersten Moment allerdings nicht bewusst, weil die bei Eingabe erscheinende Ausklapp-Liste nicht angesagt wird. Nur weil ich nochmals zurückgehe, um zu prüfen, ob mein Startpunkt korrekt hinterlegt wurde, merke ich, dass es nicht geklappt hat und ich einen Hilfsweg beschreiten muss.

Da ich die Auswahlmöglichkeiten, die unterhalb des Formularfelds in einer Liste mit Vorschlägen (Hamburg, Hamburg Flughafen) erscheinen, nicht wie gewohnt mit den Pfeiltasten durchwandern kann, erreiche ich die als Schalter gekennzeichneten Auswahlmöglichkeiten erst nachdem ich den Formularmodus verlasse. Jetzt kann ich mit den Pfeiltasten (rauf und runter) oder mit den Tastenkürzeln f und b von Schalter zu Schalter springen und meine Wahl treffen. Von Schalter zu Schalter tabben ist nicht möglich, dann würde man direkt im nächsten Feld landen.

Datumsauswahl

Als Reisedatum ist das aktuelle Datum vordefiniert. Manuell kann nichts eingegeben werden, da es sich um ein schreibgeschütztes Eingabefeld handelt (verwirrender Weise wird vom Screenreader ausgegeben: „write something…, nur lesen“). Mir ist nicht sofort klar, wie ich jetzt weitermachen kann. Mit den Pfeiltasten durchwandere ich die umliegenden Elemente und erreiche einen nicht-bezeichneten „Schalter“. Ich drücke testweise die Enter-Taste: Dahinter verbirgt sich ein Date Picker, den ich erst nach einigen Fehlversuchen erreiche. Es erscheint für jeden Monat eine Tabelle, deren Reihen die Wochen und deren Spalten die Wochentage darstellen. Die Monate sind durch Überschriften voneinander getrennt. Da JAWS mir lediglich die Zahl, jedoch nicht den Wochentag vorliest, kann ich lediglich anhand der Spaltennummer (1 bis 7) ablesen, um welchen Wochentag es sich handeln könnte. Manche Tage lassen sich zwar mit Enter aktivieren, aber sie werden nicht übernommen. Es gelingt mir schließlich, einen Wochentag zu hinterlegen, aber auch das bekomme ich nicht angesagt.

Eingabe der Zahl der Reisenden

Das nächste Formularfeld definiert, wie viele Personen mitreisen (Standardwert: 1 Erwachsener). Beim Fokussieren des schreibgeschützten Eingabefelds (read-only) wird für visuelle Nutzer ein Fenster eingeblendet, über das eine Zahl für Erwachsene, Kinder und Fahrräder hinterlegt werden kann. Die Werte im eingeblendeten Fenster können dann entweder durch manuelle Eingabe oder über die Schalter (minus/plus) angepasst werden. Doch auch diese Funktionalität ist schlecht tastaturbedienbar und für mich als Screenreader-Nutzer nur mit Trial-and-Error und viel Geduld nutzbar. Schließlich kann ich mit Klick auf den darauf folgenden Schalter „Verbindung suchen“ meine Verbindungssuche abschließen.

Im Flixbus-Shop

Nach der Verbindungssuche erreicht man den FlixBus-Shop und es erscheint - entsprechend der angegebenen Parameter - eine Auflistung der verfügbaren Verbindungen, deren Details und eine Schaltfläche zur Reservierung der Sitzplätze. Da diese Auflistung nicht korrekt als Tabelle hinterlegt ist, kann ich als Screenreader-Nutzer darin nicht komfortabel navigieren, sondern muss alle Elemente durchgehen – eine ermüdende Sache. Die Filter, die die Suche vereinfachen sollen, erreiche ich, kann sie aber mit meinem Hilfsmittel nicht alle bedienen.

Als ich über den Schalter „1 Platz buchen“ eine Verbindung auswähle, verändern sich die Beschriftungen der Schaltflächen in „Sitzplatz entfernen“ (bei der gewählten Verbindung) bzw. „Sitzplatz wechseln“ (bei den nicht-gewählten Verbindungen). Obwohl ich eine Verbindung ausgewählt habe, die ich buchen möchte, muss ich erst die gesamte Auflistung durchwandern, bis am Ende der Warenkorb erscheint. Hier gibt es auch einen Timer, der anzeigt, für wie lange die Sitzplätze reserviert sind (startet bei 30 Minuten). Mit dem Schalter „Buchen“ erreiche ich die nächste Seite.

Auf der Folgeseite werden von jedem Mitreisenden einige personenbezogene Daten abgefragt. Weiterhin erhält man die Möglichkeiten, eine Versicherung für die gebuchte Reise abzuschließen, Sitzplätze zu reservieren oder Zusatzgepäck hinzu zu buchen.

• Eine Versicherung abschließen: Probehalber teste ich den Abschluss einer Versicherung aus: Durch Klicken auf den Schalter „Hinzufügen“ wird mir direkt eine Auswahl von Versicherungen angeboten, die ich mit der Pfeiltaste durchwandern kann (nicht aber mit der Tab-Taste). Als ich eine der Versicherungen auswähle, eine Gepäckversicherung, erscheinen zusätzliche Informationen zu den Versicherungskonditionen und jeweils ein Kontrollfeld für jeden Reisenden. Nachdem ich alle Fragen beantwortet habe, kann ich mit Klick auf „Bestätigen“ die Versicherung hinzufügen. Das gelingt also schon gut.
• Sitzplätze reservieren: Im nächsten Element soll ich Sitzplätze reservieren können. Mit Klick auf „Hinzufügen“ öffnet sich auch die Sitzplatzauswahl, sie ist jedoch mit meinem Screenreader nicht zugänglich: Ich kann keinen Sitzplatz auswählen bzw. reservieren. Gottseidank können FlixBus-Verbindungen nicht überbucht werden, dennoch stellt sich die Frage, welchen Platz man am Ende bekommt.
• Zusatzgepäck buchen: Das Anmelden zusätzlicher Gepäckstücke hingegen klappt wieder gut.

Nachdem ich noch ein letztes Kontrollkästchen aktiviere, um einen Klimabeitrag beizusteuern, erreiche ich die Schaltfläche „Zur Zahlung“.

Bezahlvorgang und Abschluss der Buchung

Auf der nächsten Seite soll man die Zahlungsmethode auswählen. Doch das ist schwer möglich, da die Schaltflächen, die man aktivieren soll, um beispielsweise über PayPal oder Visa zu bezahlen, nicht beschriftet und damit für mich unkenntlich sind. Ich rätsle mir die fehlenden Informationen zusammen, indem ich die – je nach ausgewählter Zahlungsmethode – unterschiedlichen weiterführenden Inhalte durchforste. Ich entscheide mich für PayPal und werde im nächsten Schritt auf die PayPal-Seite weitergeleitet, auf welcher man den Bezahlvorgang und somit auch die Buchung abschließt und wieder zurück auf die FlixBus-Seite geleitet wird. Diesen Vorgang habe ich für den Test natürlich nicht durchlaufen. Das Ticket könnte man wohl später von der Website aus abrufen und ausdrucken bzw. sie über die im Bezahlungsvorgang hinterlegte E-Mailadresse erhalten.

Barrierefreiheits-Aspekte für visuelle Nutzer

Nachdem Patrick Dembinski getestet hatte, wie zugänglich die FlixBus-Suche und -Buchung für ihn als Screenreader-Nutzer ist, hat Simone Lerche seine Ergebnisse aus sehender Expertensicht nachvollzogen und für die Methodenentwicklung im Projekt analysiert. Einzelne Ergebnisse des Kurzchecks, die Barrierefreiheits-Aspekte für visuelle Nutzer betreffen, im Folgenden kurz zusammengefasst:

Tastaturbedienbarkeit und Tastaturfokus

Obwohl auch blinde Nutzer Tastaturbedienbarkeit benötigen, haben wir sie nochmals getestet: Warum? Die Ergebnisse der Tastaturbedienbarkeit für Screenreader-Nutzer können sich von denen eines sehenden Tastaturnutzers unterscheiden. Das liegt daran, dass Screenreader Barrieren teilweise kompensieren können. Trotzdem: Die Tastaturbedienbarkeit muss auch für Menschen, die ohne Screenreader arbeiten, etwa Nutzer mit körperlichen Behinderungen, funktionieren.

Die Verbindungssuche auf der FlixBus-Startseite ist mit der Tastatur nicht nutzbar: Zwar können die Formularfelder mit der Tab-Taste erreicht werden, aber man kann seine Start- und Zielpunkte weder manuell eingeben, noch erreicht man die Vorschläge der Ausklapp-Liste über die Tastatur. Auch das Datum kann weder manuell, noch über den per Tastatur unzugänglichen Date Picker eingegeben werden. Das Eingabefeld zur Zahl der Fahrgäste bzw. Fahrräder ist fokussier-, aber ebenfalls nicht tastaturbedienbar. Auch im FlixBus-Shop gibt es deutliche Probleme mit der fehlenden Tastaturbedienbarkeit: Insbesondere das Dialogfenster, das sich zur Buchung von Versicherungen, Sitzplätzen oder Zusatzgepäck von der rechten Seite einblendet, wird bei Tastaturnutzung erst erreicht, nachdem man die Ursprungsseite durchwandert hat. Das könnte in schlüssigerer Reihenfolge gemacht werden

Insgesamt fehlt zudem die Hervorhebung des Tastaturfokus, d.h. als sehender Tastaturnutzer weiß ich nie, wo auf der Website ich mich befinde.

Farbkontraste

Menschen mit Sehbehinderungen, die sich visuell orientieren, benötigen gerade bei Bedienelementen gute Kontraste. Auch hier sollte bei FlixBus optimiert werden: Der gelbe Button „Verbindung suchen“ beispielsweise zeigt im entsprechenden Analyse-Programm, dem Colour Contrast Analyser, nur ein Kontrastverhältnis von 1,9:1 an. Der graue Button zum Tausch der Richtungen (für Screenreadernutzer gar nicht sichtbar) hat ein Kontrastverhältnis von 3,1:1. Beides ist für Menschen mit Sehbehinderungen nicht ausreichend (und für Personen, die mobil im Blendlicht surfen übrigens auch nicht besonders komfortabel): Standardkonform wäre ein Kontrastverhältnis von mindestens 4,5:1.

Da das Design im Shop die Farben der Verbindungssuche aufnimmt, gelten die oben beschriebenen Mängel der Kontrastverhältnisse auch hier.

Zudem ein Hinweis zum Timer im Buchungsvorgang: Wenn Zeitbegrenzungen sich nicht abschalten oder verlängern lassen, können Nutzer, die mehr Zeit für Eingaben brauchen – etwa Menschen mit kognitiven Einschränkungen –, Online-Transaktionen oft nicht rechtzeitig abschließen.

Fazit

Auch wenn man als versierter Screenreader-Nutzer den Buchungsvorgang mit viel Geduld und einigen Hilfswegen durchlaufen kann, zeigen sich doch insgesamt viele Barrieren.

Dieser Test ist keine Überprüfung der Konformität mit dem Standard für Barrierefreiheit im Web, den Web Content Accessibility Guidelines (WCAG), sondern ein individuelles Praxis-Test-Ergebnis zur Nutzbarkeit der Seite mit dem Screenreader JAWS, dem genutzten Browser und einer ganz persönlichen Art, sich in Webangeboten zurechtzufinden. Diese haben wir im Team lediglich punktuell um einige Hinweise zur Zugänglichkeit für Menschen mit Seh- oder Körperbehinderung bzw. mit kognitiver Einschränkung ergänzt.

Insgesamt zeigt sich, dass die Zugänglichkeit des Webangebots ausbaufähig ist. Da geht noch was, FlixBus! Als leidenschaftlicher Traveller wäre eine barrierefreie FlixBus-Buchung für Dembinski jedenfalls ein echtes Plus. Und außerdem: Mit der Richtlinie (EU) 2019/882 des Europäischen Parlaments und des Rates vom 17. April 2019 über die Barrierefreiheitsanforderungen für Produkte und Dienstleistungen (European Accessibility Act) wurde ein Rechtsakt verabschiedet, der zukünftig auch Wirtschaftsakteure wie „Personenbeförderungsdienste im Busverkehr“ zu barrierefreien Webangeboten verpflichtet. Auch wenn das noch Zukunftsmusik ist, sollten Anbieter das in den Blick nehmen.

Hinweise zur Umsetzung

• Einen Date Picker zu entwickeln, der Barrierefreiheitsanforderungen berücksichtigt, ist nicht ganz leicht – ein Beispiel findet man z.B. beim W3C unter Date Picker Dialog Example. Ansonsten wäre es vorteilhaft, alternativ zum Date Picker auch die manuelle Eingabe eines Datums zu ermöglichen.
• Ähnlich verhält es sich mit der Frage, wie man eine Combo Box zugänglich gestaltet: Eigentlich definieren das die WAI-ARIA Authoring Practices 1.1, § 3. Combo Box. Doch die Experten sind sich nicht ganz einig: Einige ziehen die Combo Box gemäß WAI-ARIA Authoring Practices 1.0 vor, andere finden das Pattern insgesamt nicht empfehlenswert, z. B. da es in manchen Browser/Hilfsmittel-Kombinationen nicht gleichermaßen die Navigation im Formularmodus und im Lesemodus unterstützt. Daher wäre es auf alle Fälle gut, auch die manuelle Eingabe zuzulassen.
• Weitere Informationen zu Umsetzung barrierefreier Komponenten zeigen das Projekt Access & Use und die Web Accessibility Tutorials des W3C.