10 Regeln für gelungene Web-Formulare

Veröffentlicht: 07.03.2013 | Geschrieben von: Redaktion | Letzte Aktualisierung: 07.03.2013

Web-FormularWenn sich ein Internet-Nutzer dazu entschieden hat, ein Produkt zu kaufen oder einen Newsletter zu bestellen, muss er häufig noch ein Web-Formular ausfüllen. Damit ihm dieser Schritt leicht von der Hand geht und dabei keine Missverständnisse entstehen, hat die Dresdener Web-Agentur Seto GmbH zehn Regeln für die Gestaltung gelungener Web-Formulare aufgestellt. Dafür hat sie in einer Metastudie 17 Untersuchungen zur Gebrauchsfreundlichkeit von Formularen ausgewertet.

Einfach, klar und angenehm in der Benutzung sollten Formulare gestaltet sein. Wenn eine logische Reihenfolge eingehalten wird und unnötige Abfragen weggelassen werden, erhöht sich die Chance, dass der Nutzer den Vorgang nicht vorzeitig abbricht. In der Broschüre „Formulare für den Nutzer leicht machen“ geben die Autoren Stefan Meißner und Johannes Titz klare Empfehlungen und zeigen Beispielformulare. Zusammengefasst lauten die zehn Regeln folgendermaßen:

1. Nur wirklich notwendige Angaben abfragen. Wenn Sie optionale Fragen stellen möchten, etwa für die eigene Marktforschung, sollten Sie dies genau abwägen. Als Faustregel gilt: Je weniger der Nutzer ausfüllen müssen, desto geringer ist die Abbrecherquote.

2. Optionale Felder kennzeichnen. Die Autoren empfehlen, freiwillige Angaben doppelt durch eine eigene Farbe und das bekannte Sternchen zu kennzeichnen. So kann ein Nutzer schnell die Pflichtfelder erkennen und optionale Felder ignorieren.

3. Die Beschriftung über das Feld setzen. Augenverfolgungsstudien haben gezeigt, dass die Nutzer die Formulare dann am schnellsten ausfüllen können. In die Formularfelder selbst sollten Sie die Labels nicht einsetzen, denn sobald der Nutzer das Feld ausfüllt, sieht er nicht mehr, was er dort eintragen soll.

4. Bei kleiner Auswahl Radiobuttons verwenden. Soll der Nutzer zwischen bis zu vier Möglichkeiten wählen, sind Radiobuttons am besten geeignet. Bei fünf oder mehr Items raten die Autoren der Broschüre zu einer Dropdown-Box, da sonst der Platzbedarf zu groß wird.

5. Nur eine Frage pro Zeile. Allerdings sollten die Felder sinnvoll gruppiert werden, etwa die Abfrage der Straße und diejenige der Hausnummer nebeneinander stehen. So kann der Nutzer das Formular schon optisch intuitiv verstehen.

6. Ein Datum mit drei Eingabefeldern abfragen. Die Alternative Kalenderfunktion sieht zwar schick aus, hat aber die höchste Fehlerrate der verschiedenen Varianten. Formatfehler bei der Datumseingabe lassen sich mit Dropdown-Boxen vermeiden, dafür benötigen die Nutzer jedoch vergleichsweise mehr Zeit.

7. Fehlermeldungen verständlich formulieren. Der Nutzer sollte klar und deutlich erkennen, wo ein Fehler liegt und wie dieser behoben werden kann. Verwenden Sie dafür Farben, Icons oder Text.

8. Einige Eingabefehler sofort melden. Nur bei einigen Feldern wie einem selbst eingetragenen Nutzernamen bei Registrierungen sollte ein schon vergebener Name sofort als Fehler angezeigt werden. Im Regelfall füllt der Nutzer zunächst alle Felder aus und hat dann die Möglichkeit, seine Angaben zu überprüfen.

9. Die wichtigste Nutzeraktion deutlich hervorheben. Die primäre Aktion wie „Weiter zur Kasse“ sollte von anderen Aktionsbuttons farblich unterschieden und logisch sinnvoll platziert werden.

10. Reihenfolge der Felder für Tabulatoren optimieren. Da einige Internetnutzer von Feld zu Feld mit der Tabulatortaste springen, sollten Sie die interne Reihenfolge der Formularfelder beim Design der Formulare entsprechend berücksichtigen.

Abschließend empfehlen die Autoren, ein überarbeitetes Formular ausgiebig zu testen, bevor es freigeschaltet wird.

Schreiben Sie einen Kommentar

Newsletter
Abonnieren
Bleibe stets informiert mit unserem Newsletter.