Webformular

Ein Webformular ist ein Formular auf einer Webseite zur Erfassung von Daten, die zur Verarbeitung an einen Webserver gesendet werden. Man findet sie beispielsweise in Webmail-Anwendungen, Suchmaschineneingabefeldern, in Sozialen Netzwerken oder auf Login-Seiten. Das Absenden der Daten verläuft über das Hypertext Transfer Protocol via HTTP-GET, HTTP-POST oder dem XMLHttpRequest (Ajax).

Mögliche Auswahlfelder

Folgende Eingabefelder sind im HTML-4-Standard vorgesehen:

• einzeiliges Texteingabefeld (für Freitext)
• Passwortfeld (Eingaben werden maskiert auf dem Bildschirm ausgegeben)
• mehrzeiliges Texteingabefeld (Textarea)
• Auswahllisten (Dropdown-Liste)
• Radiobuttons (Auswahl einer Option aus mehreren)
• Checkboxen (Auswahl mehrerer Optionen)
• Felder zum Datei-Upload
• versteckte Formularfelder (z. B. für Session-IDs)
• Klick-Buttons, dazu gehört auch der Bestätigungsknopf (submit) oder ein Knopf zum Zurücksetzen der Eingaben

HTML5 erlaubt weitere Arten von Eingabefeldern, die sich oft zum einzeiligen Eingabefeld nur durch ihre Semantik unterscheiden:

• Telefonnummern
• E-Mail-Adressen
• Bereichsauswahl (englisch: range slider)
• Datumsauswahl
• Comboboxen

Erweiterte Widgets

Durch Einsatz clientseitiger Techniken, wie beispielsweise JavaScript, bieten viele Webframeworks erweiterte Eingabemöglichkeiten an. Dazu zählen unter anderem Widgets wie Slider, Kalenderboxen, Comboboxen, Farbwähler oder Drag-and-Drop-Felder.

Einige typische Webframeworks zu diesem Zweck sind:

• FormEngine – spezialisiertes Formular-Framework zur einfachen Ausführung auf einem Applikationsserver
• Dojo Toolkit – JavaScript-Framework zur Entwicklung von JavaScript-/Ajax-basierten Anwendungen
• jQuery UI – JavaScript-Framework zur Funktionserweiterung der Benutzerschnittstelle auf Basis von jQuery
• Apache Wicket – Web-Framework als Basis für die Entwicklung von Webapplikationen auf einem Java-Applikationsserver
• JavaServer Faces – Web-Framework als Basis für die Entwicklung von Webapplikationen auf einem Java-Applikationsserver
• Ext JS – JavaScript- bzw. Ajax-Framework für interaktive Webanwendungen

Verwendung

Neben Suchmaschinen und Webmailern gibt es noch die Onlineshops, die Formulare für die Korrektur der Adress- und Kontodaten anbieten. Auch werden Webformulare für Bestellung von Newslettern, für die Personalisierung oder das Hochladen von Dateien eingesetzt. Formulare werden eingesetzt, um Kommunikation ohne eine Angabe einer E-Mail-Adresse durchzuführen. Dabei kann Spam zum Beispiel durch Captchas größtenteils ausgeschlossen werden. Prinzipiell ist jede Seite, die ein Radio-, Checkbox- oder Button-Element anzeigt, ein Webformular.

Beispiel

Beispielausgabe eines einfachen Webformulars.

Der folgende HTML-Quelltext bindet eine Wikipedia-Suche in die entsprechende Stelle der Webseite ein.

<form action="http://de.wiki.li/Spezial:Suche">
  <fieldset>
    <legend>Suchen</legend>
    <input type="text"   name="search" value="" target="_blank" rel="nofollow" />
    <input type="submit" name="go" value="Artikel"/>
    <input type="submit" name="fulltext" value="Volltext" />
  </fieldset>
</form>

Weblinks

• Webformulare im SELFHTML-Wiki
• Bessere Formulare dank HTML5 und CSS3. In: iX