In diesem Beitrag fokussieren wir auf das Thema der Formulare, denn diese können eine ganze Reihe von Barrieren aufweisen.
Online einkaufen, das machen alle. Alle? Einige von uns begegnen dabei unüberwindbaren Hindernissen. Viele Onlineshops sind nämlich leider nicht barrierefrei.
Formulare, Formulare
Früher oder später begegnet man in jedem Onlineshop einem Formular. Spätestens als Teil des Kaufprozesses werden die Adressangaben abgefragt. Teilweise – aber nicht immer – ist eine Registrierung notwendig. Auch diese geschieht selbstverständlich über ein Formular.
Formulare können diverse Hindernisse aufweisen. Barrierefrei ist ein Formular zum Beispiel dann, wenn es
- visuelle Labels pro Feld aufweist und nicht ausschliesslich mit Platzhaltertext gearbeitet wird,
- die Labels auch im Code richtig gesetzt sind und entsprechend von einem Screenreader vorgelesen werden,
- alle Felder mit der Tastatur bedienbar sind und die Reihenfolge der Felder sinnvoll ist,
- Pflichtfelder klar gekennzeichnet sind (visuell und auditiv),
- Fehlermeldungen informativ und barrierefrei sind.
Es kann also an vielen Ecken hapern. Wird ausschliesslich mit Platzhaltertext gearbeitet, verschwindet dieser beim ersten Klick in das entsprechende Feld. Für Menschen mit kognitiven Behinderungen kann das eine Hürde sein. Was sollte man nun hier schon wieder ausfüllen? Visuelle Labels pro Feld zeigen den (sehenden) User·innen immer auf, wo sie sich gerade befinden und welche Information in einem bestimmten Feld gefordert ist.
Sind die Labels im Code nicht korrekt gesetzt, stellt dies eine Barriere dar für blinde Menschen. Liest ein Screenreader nur vor «Eingabefeld» oder «Eingabefeld mit Autovervollständigung» oder «Auswahlschalter, nicht aktiviert», aber nicht ob es sich um das Feld für den Vornamen, das Geburtsdatum, die Anrede, etc. handelt, können blinde User·innen nur raten. Auch ob es sich um ein Pflichtfeld handelt oder nicht, sollte im Code hinterlegt sein. Ist das der Fall, liest der Screenreader nämlich beispielsweise «Vorname, Eingabefeld, erforderlich».
Dass Formulare mit der Tastatur bedient werden, ist häufig – unabhängig von der Benutzergruppe, ob mit oder ohne Behinderungen. Wird dabei ein Feld übersprungen, irritiert das. Ist ein Feld nur mit der Maus erreichbar, stellt das reine Tastaturnutzer·innen sowie Blinde vor Probleme: Sie können das Feld schlichtweg nicht bearbeiten. Und wenn es sich dabei um ein Pflichtfeld handelt, ist die Blockade komplett: Ohne ausgefülltes Feld geht es nicht weiter, aber ohne Maus ist es nicht bedienbar.
Last but not least ist auch der Umgang mit Fehlermeldungen in Formularen zu beachten. Besonders dürftig sind Meldungen wie «Fehler, überprüfen Sie Ihre Eingabe». Fehlerhinweise sollen möglichst informativ sein. Eine Meldung wie «Pflichtfeld: Füllen Sie das Feld ‘Vorname’ aus» ist deutlich hilfreicher. Wichtig ist auch in diesem Fall, dass die Fehlermeldung auch von Screenreadern vorgelesen wird und zwar idealerweise gleich beim Weitergehen auf das nächste Feld und nicht erst beim Abschicken des Formulars. Werden die Eingaben erst beim Übermitteln des Formulars überprüft und es bestehen Fehler, sollte der Fokus automatisch auf die erste dieser Meldungen springen. So kann die Ergänzung gleich gemacht werden, ohne dass die Nutzer·innen nach den fehlerhaften Eingaben suchen müssen.
Date pickers
Date pickers nennt man die Formularfelder, in denen Nutzer·innen anwählen, für welches Datum sie eine bestimmte Dienstleistung abfragen wollen. In Buchungsformularen, Fahrplanabfragen und ähnlichem Kontext sind sie ein Standardelement. Viele Date pickers sind leider schlecht bedienbar – es sei denn, man hat eine Maus.
Die Hindernisse, die wir in der Testphase aufgespürt haben, sind zahlreich. In einem Portal löst das Wechseln des Datums mittels Tastatur jedes Mal einen Reload der gesamten Seite aus. Schon steht man wieder am Anfang. Ist noch dazu das Feld so konzipiert, dass man nicht direkt ein Datum hineinschreiben kann, sondern eines auswählen muss, muss man auf die Hilfe anderer Personen zurückgreifen.
Handelt es sich beim Date picker um den Bestandteil eines Buchungsformulars für Ferienwohnungen oder mögliche Liefertage eines Lebensmittelhändlers, zeigen visuelle Schriftformatierungen in der Regel an, ob ein Datum verfügbar ist oder nicht (z.B. durchgestrichen, ausgegraut). Auch eine solche Information muss an alle Nutzer·innen vermittelt werden – nicht nur visuell, sondern auch auditiv (Screenreader).
Erfreulicherweise haben wir auch positive Überraschungen erlebt – es gibt sehr gut gemachte, informative, für alle bedienbare Date pickers. Nicht sehr verbreitet, aber es gibt sie.
Captchas
Bei Captchas handelt es sich um kleine Ergänzungen, die in manchen Formularen eingebaut werden als Spam-Schutz. Manchmal handelt es sich um Bilder, manchmal um kleine Rechenaufgaben. Die Bildervariante bringt auch manchen Menschen ohne Behinderungen aus der Ruhe, weil z.B. Buchstaben und Zahlen absichtlich so undeutlich dargestellt sind, dass man sie kaum erkennen kann. Dasselbe gilt für die Bilder von Fussgängerübergängen, Ampeln oder ähnlichem, die man in unscharfen Bildern markieren soll. Mittlerweile gibt es zum Glück Alternativen dazu, simple Rechnungen wie 2+5 oder die Aufgabe, aus einer Reihe die tiefste Zahl zu identifizieren.
Wir hatten vor der Testphase erwartet, dass Captchas eine relativ häufige Barriere darstellen würden. Dem ist nicht so. Beim Kaufabschluss traten sie nicht oder kaum auf. Eher in einem Registrierungsprozess, wobei dort dem Spam-Schutz mittlerweile eher Rechnung getragen wird, indem Kund·innen ihre Mailadresse bestätigen müssen, bevor ihr Konto aktiv ist. Nur wenige Onlineshops setzen Captchas noch so ein, dass sie nicht bedienbar wären. Das hat uns gefreut!
Résumé
Formulare scheinen für viele Onlineshopbetreiber ein schwieriges Thema zu sein. Da kann ganz vieles im Shop gut gemacht sein, wenn es dann um die Registrierung oder die Eingabe von Adressdaten geht, gibt es Hindernisse. Aber auch das Gegenteil gibt es – der Shop bietet Hürden unterschiedlichster Art, aber das Registrierungs- und das Adressformular sind offenbar als gut programmierter Standard eingekauft oder von einem Drittanbieter eingebunden worden und funktionieren einwandfrei.
