Zehn Tipps, wie Formulare erfolgreich werden

Damit ein Formular erfolgreich einsetzbar ist, sollten laut der Analyse folgende Tipps beachtet werden:

• 1. Gruppierung und Reihenfolge
  Strukturieren Sie Ihre Formulare und fassen Sie inhaltlich zusammengehörige Felder zu Gruppen zusammen. Bei längeren Formularen kann es durchaus Sinn machen, das Formular auf mehrere Seiten zu verteilen, die dann Schritt für Schritt abgearbeitet werden können - vergessen Sie aber nicht, dem Benutzer immer aufzuzeigen, an welcher Stelle er sich gerade befindet und wie viele Seiten noch zu bewältigen sind.
• 2. Bereits eingegebene Daten speichern
  Bei Formularen, die wegen einer gewissen Komplexität auf mehrere Seiten verteilt werden müssen, sollten Sie eine Blätterfunktion anbieten. Bereits eingegebene Daten sollten auch bei einem Seitenwechsel erhalten bleiben - nichts ist ärgerlicher, als das komplette Formular nochmals ausfüllen zu müssen, nur weil der Zurück-Button benutzt wurde! Dies gilt natürlich auch für falsch ausgefüllte Formulare. Wer nur vergessen hat ein Häkchen vor dem Abschicken zu setzen, sollte nicht alles nochmals eingeben müssen.
• 3. Fehlermeldungen
  Lassen Sie den Benutzer nicht nach dem Fehler suchen: Die Fehlermeldung sollte an der Stelle stehen, an der auch der Fehler aufgetreten ist. Der Fehler kann zusätzlich zum textlichen Hinweis im Text auch noch durch Hervorheben des Formular-Elements, z.B. durch eine rote Umrandung oder ein Symbol gekennzeichnet werden. Weisen Sie bei langen Seiten zusätzlich am Seitenanfang darauf hin, dass ein Fehler aufgetreten ist.
  Verzichten Sie auch auf kryptische Fehlermeldungen und beschreiben Sie stattdessen den Fehler kurz und prägnant. Die Aussage "Ein Fehler ist aufgetreten" hilft selten weiter, wohingegen "bitte den Vornamen eingeben" schon mehr Sinn macht.
  Zeigen Sie alle Fehler auf einmal an. Wenn auf einer Seite an drei Stellen Fehler aufgetreten sind, dann zeigen Sie alle Fehlerstellen auf einmal an - muten Sie dem Benutzer nicht zu, das Formular drei Mal abschicken zu müssen, nur weil er drei Elemente nicht korrekt ausgefüllt hat!
• 4. Tab-Navigation und Fokus auf das erste Feld
  Beim Aufruf der Seite sollte das erste Formularfeld bereits fokussiert sein. Das lässt sich einfach im HTML-Code festlegen. Sie ersparen dem Benutzer dadurch einen Mausklick! Den Griff zur Maus können Sie dem Surfer ebenfalls ersparen, wenn Sie dafür sorgen, dass die Felder in der richtigen Reihenfolge mit der Tab-Taste angesprungen werden können. Auch das lässt sich mit wenigen Angaben im HTML-Code festlegen.
• 5. Klick auf Labels
  Jeder kennt die Funktion aus Dialogfeldern im Betriebssystem und in Programmen: Anstatt bei Kontrollkästchen und Optionsschaltern nur auf die verhältnismäßig kleinen Schaltflächen zu klicken, hat man hier die Möglichkeit auch die Beschriftung anzuklicken um das Element auszuwählen. In Websites muss man oft auf diesen Komfort verzichten und die relativ kleinen Elemente anklicken, um eine Auswahl zu treffen. Erleichtern Sie Ihren Benutzern den Umgang mit dem Formular, indem Sie auch die Beschriftung klickbar gestalten. Nicht nur motorisch eingeschränkte Menschen werden es Ihnen danken!
• 6. Doppeltes Abschicken vermeiden
  Manchmal benötigt eine Transaktion etwas länger - vermeiden Sie in diesem Fall unbedingt, dass der Nutzer den Absenden-Button mehrfach klickt. Das erzeugt unbrauchbare oder gegebenenfalls doppelte Datensätze. Teilen Sie dem Nutzer einfach mit, dass der Prozess etwas länger dauern kann und er den Button nur einmal klicken soll. Raffinierter ist es jedoch, den Button nach dem Senden inaktiv zu schalten. Dies kann einfach über Javascript erfolgen. Achten Sie darauf, dass der Button auch visuell als inaktiv und nicht klickbar wahrgenommen wird.
• 7. Das richtige Formularelement
  Überlegen Sie genau, welche Formularelemente Sie verwenden wollen und zweckentfremden Sie diese nicht.
  Kontrollkästchen (Checkboxes) bieten dem Benutzer eine Mehrfachauswahl - er kann eine beliebige Anzahl aktivieren - im Zweifelsfalle auch gar keines. Bei Optionsschaltern (Radio-Buttons) wählt der Benutzer eine von mehreren Optionen, die sich gegenseitig ausschließen. Steht nur ein einzelner Punkt zur Auswahl, muss dieser über ein Kontrollkästchen aktiviert werden - ein einzelner Optionsschalter lässt sich nicht mehr deaktivieren. Ab einer gewissen Menge an Optionsschaltern sollten Sie auch darüber nachdenken, ob ein Auswahl-Menü hier nicht sinnvoller wäre. Das Formularelement 'Auswahl' sollten Sie möglichst nicht benutzen - die Funktion der Mehrfachauswahl ist den meisten Web-Surfern nicht bekannt.
• 8. Die Größe der Eingabefelder
  Stellen Sie dem Benutzer ausreichend breite Felder zur Verfügung. Erfahrungen mit Suchmaschinen haben gezeigt, dass unerfahrene Nutzer in Sucheingabefeldern lediglich den zur Verfügung stehenden Platz nutzen und dann ihre Eingabe abbrechen.
  Beim Textbereich 'Eingabefelder' sollte der Benutzer ausreichend Platz haben, um seinen eingegebenen Text problemlos nochmals lesen zu können. Die Größe hängt von vielen Faktoren ab - 50 Zeichen in der Breite und zehn Zeilen in der Höhe gelten hier als Richtwert.
• 9. Kürzere Formulare und Pflichtfelder
  Fragen Sie nur Daten ab, die Sie wirklich benötigen - nichts schreckt den Benutzer mehr ab, als endlos lange Formulare.
  Überprüfen Sie, ob Sie alle Informationen die Sie abfragen auch wirklich benötigen. Dies gilt vor allem für die Pflichtfelder: Diese müssen für Sie wirklich unverzichtbar sein! Fragen Sie sich, ob Sie dem Benutzer wirklich die Möglichkeit nehmen wollen, z.B. mit Ihnen Kontakt aufzunehmen oder eine Bestellung abzugeben, nur weil er nicht bereit ist, ein bestimmtes Feld auszufüllen. Zeichnen Sie Pflichtfelder deutlich als solche aus. Es gibt verschiedene Methoden dies zu tun. Die gängigste und von den meisten Benutzern auch gelernte Version ist das Sternchen (*). Weisen Sie den Online-Surfer in einer Legende darauf hin, wie Pflichtfelder gekennzeichnet sind. Sehen Sie davon ab, die freiwilligen Felder mit einer Hervorhebung zu versehen - sonst wird der Benutzer das Formular garantiert falsch aufüllen!
• 10. Formatierungen
  Schreiben Sie dem Benutzer nicht vor, wie er seine Daten eingeben muss - die Arbeit, die Eingaben korrekt zu formatieren, kann man in den meisten Fällen dem Rechner überlassen - ein paar Zeilen Code filtern alle ungeliebten Daten wie Bindestriche und Klammern etc. aus einer Telefonnummer heraus.