Webkrauts Logo

Webkrauts Webkrauts Schriftzug

- für mehr Qualität im Web

Sonnenseiten: Formulare

Sonnenseiten: Formulare

Gerade bei Gestaltung und Programmierung von Formularen soll für den Webworker der Komfort des Benutzers oberste Priorität haben. Ralf Graf zeigt ein gelungenes Beispiel für Benutzerfreundlichkeit in Formularen durch einen Hauch von JavaScript.

Die wenigsten Webdesigner- und Entwickler mögen Formulare. Denn die Benutzer, die Formulare zwar brauchen, aber im Allgemeinen selbige noch weniger mögen als die Entwickler, können dabei falsche oder fehlende Angaben machen. Senden sie diese trotzdem ab, kommt nach einem Request eine Seite mit mehr oder weniger hilfreichen Hinweisen wie »Ihr Passwort darf keine Zeichen enthalten, die auf der hl. Steintafel der in Passworten verbotenen Zeichen verzeichnet sind«. Und, noch schlimmer, einige Felder, wie das mühsam mit einem supersicheren Passwort bestückte Passwortfeld, präsentieren sich dem staunenden Benutzer frisch geleert, weil der Seitenbetreiber das aus Sicherheitsgründen so möchte. Dafür hat er sicher gute Gründe, übermäßig benutzerfreundlich ist das, gerade bei längeren Formularen, nicht.

Signup-Formular auf Soundcloud

Das es auch anders geht, zeigt z.B. Soundcloud. In deren »Signup« werden die benötigten Informationen schon während der Eingabe validiert und im Fehlerfall eine nicht zu übersehende optische Benachrichtigung nebst hilfreichen Hinweisen zur Lösung des diagnostizierten Problems ausgegeben. Und der fehlerhaft ausfüllende Besucher kann das Formular gar nicht absenden, ohne diese Fehler zu korrigieren. Damit werden etwaige Datenverluste oder doppelte Anmeldeversuche erst gar nicht riskiert.

Wie macht der Entwickler das? Natürlich mit JavaScript. JS zur Formularvalidierung gab es schon in den 90er Jahren, das konnte sich seinerzeit aber nicht durchsetzen. Heutzutage kann der Webworker zu vorhandenen und erprobten Lösungen wie das Validation-Plugin von jQuery greifen und sich das Rumärgern mit Kompatibilitätsproblemen ersparen.

Ein Nachteil für die Web-Anwendungsentwicklung soll nicht verschwiegen werden: Es ist unschön, einen Teil der Formularverarbeitung in seiner Server-Skriptsprache und einen anderen Teil in JavaScript zu entwickeln, denn natürlich muss die übliche serverseitige Validierung, nicht zuletzt für Browser ohne JavaScript, trotzdem erfolgen. Hier gilt es, auf den Fortschritt zu hoffen, der uns in unseren Lieblings-Webanwendungs-Frameworks Methoden liefert, welche die gewünschten Funktionalität beschreiben und dann automatisch an die richtigen Stellen in Front- und Backend packen.

Aber auch heute kann und soll ein Seitenbetreiber sich die Mühe machen, die Formularhölle für den Benutzer zu entschärfen und bereits im Client Daten zu validieren. POST-GET-Request-Ketten zur Formular-Validierung, am besten noch mit »Wollen Sie das Formular wirklich noch einmal absenden?«-Warnungen sind in einer Webanwendung sowas von 1995…

Zur Aktion

Dies ist ein Text zur Aktion Sonnenseiten: Webkrauts loben – höchst subjektiv – einzelne Details von Webseiten. Entgegen unserer Gewohnheit steht diesmal nicht der Quelltext, sondern die Idee im Mittelpunkt.

Kommentare

Linda
am 21.06.2010 - 12:04

RoR und kein Frickeln? Not bad ;-)

Permanenter Link

Chris
am 06.07.2010 - 10:16

Ich denke auch, dass hier der Nutzen (sofortige Rückmeldung) eindeutig das "unschöne" (Javascript) überwiegt.

Also ich persönlich finds immer viel besser gleich auf Fehler aufmerksam gemacht zu werden, als erst nach dem ansenden des Formulars...

Permanenter Link
Susanne Jäger

Susanne Jäger
am 14.07.2010 - 14:26

Als Hintergrundinfo noch der Hinweis auf eine Usability-Studie und ein paar Überlegungen zu ähnlichen Lösungen: A List Apart: Articles: Inline Validation in Web Forms A List Apart: Articles: Inline Validation in Web Forms

Permanenter Link

Die Kommentare sind geschlossen.