Barrierefreie Web-Formulare

Wie Online-Formulare barrierfrei werden?

Der Weg, wie Web-Formulare barrierfrei werden ist nicht sehr kompliziert. Vor allem muß man dabei einfach mitdenken, wie ein Formular wahrgenommen wird, wenn es linear gelesen wird. Lineares Lesen des Formulares bedeutet einfach: Die Reihenfolge des Formulares muß logisch nachvollziehbar und verständlich sein. Außerdem sollte man darauf achten, dass Eingabefelder immer beschrieben sind mit dem, was die Eingabe verlangt.

Logisch nachvollziehbare Formulare

Formulare sollten so aufgebaut sein, dass die Felder in der Reihenfolge gut bearbeitet werden können. Grundsätzlich sollen Formulare freundlich sein. Und wenn schon nicht freundlich, dann wenigstens höflich. Klingt seltsam, ist aber so. Erklären Sie vor dem Formular, welche Daten erhoben werden sollen und beginnen Sie auch um es barrierefrei zu halten mit dem Anliegen der Person, die vor dem Computer sitzt.

Denkweise: Die Formular-Feld-Reihenfolge ist entscheidend!

Freundlichkeit bei Formularen ist ganz einfach erklärt: Sie wenden die Idee an, dass Sie einer Person, die in Ihrem Geschäft / Büro (...) ist mit den Fragen konfrontiert würde. Denken Sie die Situation durch: Wenn Sie eine Person, die bei Ihnen einkaufen möchte, nicht zuerst nach dem Wunsch bzw. Anliegen fragen, sondern nach den persönlichen Daten, dann wäre das in einem Geschäft seltsam.

Stellen Sie sich vor, Sie gehen in ein Geschäft und wollen etwas kaufen. Bevor Sie gefragt werden, was Sie kaufen wollen oder was Sie suchen, fragt die Person am Verkaufsschalter zunächst nach Name und Adresse. Wäre das nicht seltsam? Das ist auch für die barrierefreie Gestaltung von Formularen wichtig. Sie müssen zuerst das Angebot unterbreiten, damit die Person sagen kann, worum es geht und was sie möchte. Dann erst dürfen Sie fragen, was Sie wissen müssen um beispielsweise ein Angebot zu machen.

Keine Überraschungen am Formular-Ende

Bevor jemand beginnt ein Formular auszufüllen, sollte klar sein, was mit dem Formular passiert. Beispielsweise gehört dazu die Information, dass man mit dem Formular eine Anfrage schickt, die sich auf ein bestimmtes Produkt bezieht, damit eine Person, die vor dem Computer sitzt, auch vorher schon weiß, was das Ergebnis des Ausfüllens ist - schließlich ist es die Person vor dem Computer, die sich die Arbeit antut das Formular auszufüllen.

Wichtiges Kriterium: Das trifft auch alle, die glauben, dass es eine gute Idee ist am Ende eines Formulares eine Datenverarbeitungs-Checkbox anzubringen. Es ist einfach unhöflich erst nach der ganzen Mühe das Formular auszufüllen, zu sagen was damit passiert.

Diese Regelung betrifft auch die Tatsache, dass es natürlich nicht klug ist am Ende des Formulares - oder noch schlimmer - nach dem "Absenden"-Knopf - erklären, welche Felder überhaupt verpflichtend ausgefüllt werden müssen.

Technik: Label für Formular-Felder

Wichtig für barrierefreie Web-Formulare ist, dass jedes Feld ein eigenes, sichtbares Label hat. Mit Label ist die Bezeichnung des Feldes gemeint, das auch in HTML so codiert wird, dass die Markierung des Labels zum Focus auf das Feld führt. Wenn man also auf das Wort "Vorname" klickt, sollte der Cursor zum Eingeben im Feld Vorname stehen. Die Programmierung ist relativ einfach zu bewerkstelligen, wird aber teilweise immer noch nicht gemacht.

Beispielhafter HTML-Code für ein Label und ein Formular-Feld:

<label for="vorname">Vorname</label>
<input type="text" id="vorname">

Das Problem mit mehrteiligen Feldern

Es gibt immer wieder im Netz Eingabemasken, die sich auf mehrere Felder beziehen. Typischerweise gehören dazu Felder wie Telefonnummern, dabei wird oft die Landesvorwahl und die Regionalvorwahl sowie die Hauptnummer selbst getrennt abgefragt. Kurz gesagt: Sofern keine wirklich gut erklärten Formular-Labels vorhanden sind ist das keine gute Idee. Das Problem ist dabei oft schon das fehlende Label (siehe vorhin), weil eben für 3 Felder ein gemeinsames Label "Telefonnummer" gesetzt wird.

Fehler gefunden?

Wenn Sie auf der Webseite über Webseiten, Agenturen, Programmierung, SEO und Optimierung unter der Domain webseite-agentur.com bzw. eigentlich spezifisch auf dieser Seite mit der Überschrift Barrierefreie Web-Formulare einen Fehler gefunden haben, freuen wir uns über einen Hinweis. Bitte schicken Sie ein Mail an unser Content-Team und schreiben Sie uns kurz, was wir falsch gemacht haben. Im Betreff der E-Mail wird die Adresse dieser Seite mitgeschickt, damit wir den Fehler schnell finden können, bitte löschen Sie daher den Betreff der Mail nicht.