 |
Web-Formulare verstehen und benutzen |
| Von Stefan Bucher Erstellt: 20.07.2003 Geändert: 07.02.2004 |
Inhalt
- Web-Formulare
- Formular-Elemente
- «Absenden»-Knopf
- «Zurücksetzen»-Knopf
- Von Feld zu Feld springen
- Datenschutz und -Sicherheit
- Web-Formulare gestalten
Web-Formulare
Bitte geben Sie hier ihre Kreditkartennummer ein:
Würden Sie dieses Formular ausfüllen? Wohl kaum, denke ich
mir.
Im WWW kommt es unzählige Male vor, dass Sie Angaben machen oder
eine Auswahl treffen sollten. Sie werden gebeten, ein elektronisches
Formular auszufüllen, etwa wie in der realen Welt auf einem Amt
oder bei der Bestellung aus einem Warenkatalog.
Mit dem Ausfüllen von Formularen haben wir normalerweise keine Probleme. Und auch im Web laden uns Formulare oft auf einfache intuitive Weise ein, unsere Angaben einzugeben. Das Prinzip ist simpel: Mit einem Klick auf einen Knopf werden Ihre Angaben übermittelt und am anderen Ende werden sie verarbeitet. Als Resultat erwarten Sie die bestellten Waren in Ihrem Briefkasten oder zumindest eine Bestätigung per E-Mail.
Formulare sind auch für Webentwickler leicht zu erstellen. Die Formularelemente gehören zum Standard von HTML. Zur Auswertung und Übermittlung der Daten kommen Script-Anwendungen zum Einsatz.
Problemlos ist die Benutzung für viele User jedoch nicht. Meist sind unklare oder zu komplexe Formulare dafür verantwortlich, dass Online-Konsumenten eine Bestellung abbrechen und sofort auf die Site des Konkurrenten wechseln. Die Zahl dieser Abbrüche ist im Allgemeinen recht hoch.
Im Folgenden sollen Sie Web-Formulare näher kennen lernen, damit Sie sich besser zurecht finden und auch über die Gefahren Bescheid wissen.
Formular-Elemente
Eine Reihe von Elementen treffen Sie in Formularen an:
Text
Hier geben Sie beispielsweise Namen, E-Mail-Adresse, einen Suchbegriff
oder ein Passwort ein. Sie klicken mit der Maus in das Feld und erhalten
eine Schreibmarke (Cursor), die Ihnen anzeigt, dass Sie jetzt Text eintippen
können.
Webentwickler haben die Möglichkeit, die maximale Zeichenzahl zu beschränken. Das kann bei manchen Feldern Sinn machen. Beispielsweise kann das Feld für eine Bestellnummer auf acht Stellen beschränkt sei, wenn eine neunstellige Zahl ungültig wäre. Der Vorteil kann aber auch zum Verhängnis werden: Es könnte Ihnen im schlimmsten Fall passieren, dass Sie Ihren 12-stelligen Familiennamen nicht vollständig eintippen können, weil die Programmierer für das Feld nur zehn Zeichen vorgesehen haben.
Speziell sind Textfelder für Passwörter. Anstatt der eingetippten Zeichen werden Punkte oder Sternchen dargestellt. Dies aus Sicherheitsgründen, damit Passwörter nicht auf dem Bildschirm ablesbar sind.
In manchen Textfeldern ist bereits Text enthalten. Der Anbieter möchte den Nutzerinnen und Nutzern damit einen Hinweis darauf geben, welche Eingabe in welcher Form in diesem Feld erwünscht ist. Als User können Sie den enthaltenen Inhalt mit Ihren Angaben ergänzen oder überschreiben.
Vielleicht verschwindet der schon enthaltene Text auch komplett, sobald Sie ins Textfeld klicken. Das ist ein Trick, den die Entwickler so angewendet haben.
Grosses Textfeld
Dieses Feld nimmt freien Text auf. Oft für Bemerkungen, Kommentare
oder Nachrichten verwendet. Das Feld ist mehrzeilig im Unterschied
zum einfachen Text-Feld. Am Zeilenende wird der Text normalerweise umgebrochen.
Das Feld stellt Rollbalken dar, wenn der enthaltene Text die Dimensionen
des Eingabefeldes übertrifft.
Markierungskästchen
«Zutreffendes bitte ankreuzen», heisst es in herkömmlichen Formularen. Die quadratischen Kästchen (in HTML Chockboxen genannt) erlauben es Ihnen, in den von Ihnen gewählten Feldern einen Haken zu setzen. Sie können so eine oder mehrere Optionen in einer Bestellung als für Sie zutreffend markieren.
Es kann sein, dass eine Checkbox schon im Voraus markiert ist. So kann ein Anbieter versuchen, ihnen beispielsweise das Zusenden von Werde-E-Mails unterzujubeln. Achten Sie also darauf, ob Sie mit dieser Auswahl einverstanden sind. Falls nicht, entfernen Sie die Markierung.
Auswahlknopf
Mit den runden Knöpfchen (Radiobuttons) können Sie aus einer Auswahl eine Option auswählen. Diese Funktion finden Sie beispielsweise wenn Sie danach gefragt werden, auf welche Art Sie die bestellte Ware bezahlen möchten. Auch hier ist oft eine Möglichkeit schon voraus ausgewählt.
In diesem Beispiel können Sie entweder Rechnung oder Kreditkarte als Ihre bevorzugte Zahlungsart auswählen.
Auswahlmenü
Ebenfalls eine Auswahl aus mehreren Optionen können Sie aus einem Auswahlmenü wählen. Bekannt ist das Auswahlmenü um beispielsweise ein Land zu wählen.
Ihr Heimatland:
Das Menü zeigt einen Eintrag an. Zur Auswahl einer der anderen Optionen klicken Sie auf das Pfeilchen rechts, das nach unten zeigt.
«Absenden»-Knopf
Am Ende des Web-Formulars steht gewöhnlich ein Knopf mit der Aufschrift «Absenden» oder «Weiter» (englisch «Submit»). Klicken Sie auf diesen Knopf, wird eine Anwendung gestartet, die die Formulardaten überprüft und verarbeitet.
Meist überprüft die Anwendung die Richtigkeit bzw. Gültigkeit der Eingaben. Werden Fehler festgestellt, wird dies durch eine Meldung angezeigt. Es wird ihnen angegeben, in welchen Feldern Ihre Eingabe nicht akzeptiert wurde. Sie müssen nun die Angaben in den bezeichneten Feldern anpassen. Vielleicht müssen Sie dazu zuerst zum Formular zurückkehren. Falls Ihnen kein «Zurück»-Link angeboten wird, betätigen Sie die Zurück-Taste des Web-Browsers.
Bestehen keine Fehler mehr, kann die Anwendung Ihre Daten verarbeiten und weiterleiten. Eventuell erhalten Sie eine Bestätigung.
Klicken Sie nur ein Mal auf den «Absenden»-Knopf, auch wenn es zu einer Verzögerung in der Formularverarbeitung kommen sollte. Klicken Sie zwei Mal, wird Ihr Formular auch zwei Mal übermittelt. Das kann dazu führen, dass Sie eine Ferienwohnung zwei Mal reservieren oder für die Oper vier statt zwei Karten bestellen.
«Zurücksetzen»-Knopf
Neben dem «Absenden»-Knopf befindet sich gelegentlich ein zweiter Knopf mit der Aufschrift «Zurücksetzen» oder «Löschen» (englisch «Reset»). Klicken Sie darauf, verschwinden alle ins Formular eingegebenen Daten.
Über den Sinn dieser Funktion herrschen unterschiedliche Meinungen. Tatsächlich kommt es vor, dass Benutzerinnen und Benutzer den «Absenden»- mit dem «Zurücksetzen»-Knopf verwechseln. Eine Bestellung löst sich dann per Mausklick in Nichts auf. Das ist ärgerlich und Kunden werden am Kauf gehindert.
Von Feld zu Feld springen
Umfangreiche Webformulare lassen sich einfacher ausfüllen, in dem Sie mittels der Tabulator-Taste von einem Element zum anderen springen. Die Elemente werden der Reihe nach aktiviert (erkennbar an einer Umrandung).
- Sie befinden Sich mit dem Cursor in einem Textfeld. Drücken Sie die Tabulator-Taste (Tab). Der Cursor springt zum nächsten Formular-Element.
- Ist das aktive Element eine Checkbox, können Sie mit der Leertaste (Space-Taste) eine Markierung setzen oder entfernen.
- Ist das aktive Element ein Radiobutton, können Sie mit den Pfeiltasten nach oben und nach unten durch die Optionen springen.
- Ist das aktive Element ein Auswahlmenü, können sie ebenfalls mit den Pfeiltasten nach oben und nach unten durch die Optionen springen.
- Drücken Sie die Entertaste, wird die «Absenden»-Taste betätigt Ò das Formular wird übermittelt.
Datenschutz und Sicherheit
Für das Zusenden einer Warenbestellung wird die Adresse des Bestellers benötigt. Für das Abonnement eines E-Mail-Newsletters sind hingegen Wohnort, Beruf, und Telefonnummern nicht zwingend notwendige Informationen.
Einige Anbieter versuchen trotzdem auch Informationen über die User einzuholen, die für den gewünschten Service nicht erforderlich sind. Das Sammeln von Benutzerdaten ist unter dem Begriff «Data Mining» bekannt.
Datenschützer rufen seit einiger Zeit zur Vorsicht auf. Geben Sie Ihre persönlichen Daten nicht unkontrolliert preis.
Besondere Gefahren bestehen selbstverständlich bei Angaben zu Kreditkarten. Als Tipp gilt: Nur bei vertrauenswürdigen Anbietern online über Kreditkarte einkaufen und darauf achten, dass die Daten über eine «sichere Verbindung» (Hinweis im Browser beachten) übermittelt werden.
Eine andere Gefahr besteht bei der Angabe von Adressen und Telefonnummern. Besonders Kinder und Jugendliche sollten in Foren oder Chat-Räumen keine persönlichen Angaben preisgeben. Die Folge könnten Belästigungen und unmoralische Angebote oder auch nur eine Flut von Werbesendungen sein.
Auch die E-Mail-Adresse ist eine schützenswerte persönliche Information. Weit gestreute E-Mail-Adressen können leicht in die Hände von zweifelhaften Unternehmern gelangen, die diese Daten missbrauchen. Unter dem Begriff «Spam» ist die Plage der unerwünschten Massen-Werbemails bekannt.
Viele Unternehmen geben auf ihren Websites ihre Privacy Policy bekannt. Das ist ein Hinweis darauf, welche Benutzerdaten erhoben und wie diese behandelt werden. Damit soll Tranparenz geschaffen und das Vertauen gestärkt werden.
Webformulare gestalten
Für benutzerfreundliche Webformulare können sich Web-Entwickler an folgende Tipps halten:
- Formulare so kurz und übersichtlich wie möglich halten
- Auf logische Tab-Reihenfolge achten: Besonders bei Formularen in Tabellen kann die Reihenfolge der Formularelemente durcheinander geraten. Um die Tabulator-Reihenfolge manuell anzugeben, das Attributt «tabindex» verwenden. Mehr Infos dazu bei SELFHTML.
- Verwechslung von «Absenden»- und «Zurücksetzen»-Knopf ausschliessen. Entweder auf den «Zurücksetzen»-Knopf ganz verzichten oder die zwei Buttons gut voneinander getrennt anordnen.
Viele Hinweise und Tricks für die Formulargestaltung finden Sie bei Dr. Web unter http://www.drweb.de/formulare/index.shtml.