VII. Interaktive Formulare
DasDie Mailto-Funktion
Internet ist ein Medium mit einer überwiegend jungen Benutzerschaft. Darum eignet es sich besonders gut, um junge Leute zu erreichen. Außerdem ist es ein Medium, das sehr auf Kommunikation angelegt ist. Ein "trockenes" Informationsangebot mit langen Texten und ohne die Möglichkeit, mit den Anbietern in Kontakt zu treten, wird darum nur wenig Erfolg haben.
Wenn auf Ihrem Web- Server dagegen ständig etwas passiert, sich die Seiten verändern, neue Angebote hinzukommen, es etwas zu gewinnen oder zu bestellen gibt, oder eine Diskussion in Gang gesetzt wird, können Sie damit rechnen, daß ihr Server und Ihr Informationsangebot immer wieder frequentiert werden.
Vor allem sollte bei einem Engagement im World Wide Web auch daran gedacht werden, daß die eingegangenen E-Mails regelmäßig beantwortet und der Kontakt zu den Benutzern gepflegt wird.
Auf Anfragen und Kommentare der Benutzer nicht zu antworten, macht einen schlechten Eindruck, der das gesamte WWW-Engagement einer Organisation gefährden kann, wenn es sich im Netz herumspricht, "daß man von denen sowieso nie eine Antwort erhält".
1. Die Mailto-Funktion
Die einfachste und zugleich komfortabelste Methode, den Betrachtern einer WWW-Seite den direkten Kontakt zu Ihnen zu ermöglichen, ist die Mailto-Funktion
der HTML-Sprache. Diese Funktion folgt der Syntax eines normalen 
Links, doch statt der Dokumentadresse wird hier nach dem "mailto:"-Attribut die E-Mail-Adresse angegeben, an die die Post geschickt werden soll:
<a href="mailto:kirche.online@gep.de">E-Mail</a>Die meisten
Browser sind in der Lage, diese Mailto-Funktion auszuführen, indem sie ein Formular öffnen, in das nur noch der Betreff und die Nachricht eingefügt werden müssen. Damit wird es dem Betrachter sehr einfach gemacht, auf eine WWW-Seite zu reagieren: mit Fragen, Anregungen, Kommentaren etc.
2. Formulare
Gegenüber der Mailto-Funktion gehen Formulare noch einen Schritt weiter: der Betrachter einer WWW-Seite kann über Formulare spezielle Angaben machen
Ein Formular beginnt immer mit dem Tag <form> und endet mit dem Tag </form>. Zwischen diesen beiden Tags können auch Text, Tabellen, Aufzählungen, Bilder etc. plaziert sein. Es ist allerdings nicht möglich, Formulare ineinander zu verschachteln und Eingabedaten über mehrere Seiten hinweg zu akkumulieren. Das, was mit dem Formular eigentlich passiert, wird mit den Erweiterungen und Attributen des Form Tags definiert, die Eingabefelder, die der Benutzer sieht, folgen dann einer eigenen Syntax.
3. Attribute des "Form"-Tags
Die zwei wesentlichen Attribute des "Form"-Tags sind "action" und "method", die folgender Syntax folgen:
<form action="mailto:kirche.online@gep.de" method=post enctype="text/plain">
Durch das "action" Attribut wird festgelegt, was mit den Formulardaten geschehen soll. In obigem Beispiel würden sie an die bei "mailto:" angegebene E-Mail-Adresse geschickt. Alternativ dazu könnte auch ein sogenanntes CGI-Programm aufgerufen werden, das die Formulardaten weiterverarbeitet. Auf diese Weise arbeiten beispielsweise Suchmaschinen (
Altavista, Yahoo! etc.)
Über "method" wird die Art und Weise festgelegt, wie Formulardaten weiter behandelt werden sollen. Wenn Sie einfache Daten an eine Mailadresse schicken wollen, müssen Sie "post" (versenden) angeben. Soll dagegen ein CGI-Programm die Daten erhalten, müssen Sie unter Umständen "get" (bekommen) angeben (hängt vom verwendeten Programm ab).
Das Attribut "enctype" hat eine besondere Bedeutung: normalerweise sind Formulardaten so formatiert, daß Auswertungsprogramme damit arbeiten können. Dieses Format ist für den Empfänger aber sehr schlecht zu lesen. Die Angabe von "text/plain" verhindert diese spezielle Formatierung, so daß die Daten übersichtlich strukturiert beim Empfänger ankommen.
4. Die einzelnen Felder
Die folgenden Formularfelder sind möglich:
einzeilige Textfelder
<input type="text" name="name" size="xy">
mehrzeilige Textfelder
<textarea name="name" rows="x" cols="y">Text</textarea>
Checkboxen
<input type="checkbox" name="name" value="xy">
Radio Buttons
<input type="radio" name="name" value="xy"
Select Menüs
<select name="name"
<option>option1
<option>option2
<option><option3
</select>
Submit Buttons
<input type="submit" name="Abschicken">
Reset Buttons
<input type="reset" name="Löschen">
Die "input type"-Tags folgen alle der gleichen Logik: "type" bezeichnet die Art des Feldes: ob es Textfeld, eine Checkbox, ein Radio Button etc. sein soll; "name" bezeichnet den Namen des aktuellen Feldes, damit der 
form1.htm (Textfelder)
form2.htm (Radio- und Checkboxen)
form3.htm (Submit- und Reset-Buttons)
Server weiß, welche Daten zu welchen Feld gehören, denn es ist ja möglich, mehrere solcher Felder anzulegen, die dann alle einen unterschiedlichen Namen haben müssen. Die Namen können frei gewählt werden.
Bei einem Textfeld ist es wichtig, die Größe mit anzugeben (in Anzahl der Buchstaben des Eingabefeldes). Der Unterschied zwischen einer Checkbox und einem Radio Button besteht darin, daß bei einer Checkbox mehrere Optionen angekreuzt werden können, während bei einem Radio Button immer nur eine Option erlaubt ist.
Jedes Formular benötigt die "submit" und "reset"-Buttons, weil damit das Formular erst wirksam wird. Ohne den Submit-Button kann das ausgefüllte Formular nicht an den Server abgeschickt werden und ohne Reset-Button kann das Formular nicht gelöscht werden.
Mehrzeilige textarea-Felder werden vor allem dafür verwendet, Kommentare zu hinterlassen, während die select-Felder vor allem dafür gebraucht werden, aus mehreren Optionen eine auszuwählen.
Es hängt also von der Art der gewünschten Information ab, welches Feld verwendet wird: Für Name, Adresse, Telephonnummer, E-Mail-Adresse etc. kommen nur Textfelder in Frage, während für Felder, bei denen etwas ausgesucht werden soll, unterschiedliche Felder verwendet werden können.
Neben den eben besprochenen "Input-Types" gibt es noch weitere. An dieser Stelle sollen jedoch nur die zwei wichtigsten angesprochen werden, um den Umfang des Workshops nicht zu sprengen.
"<input type=hidden>" arbeitet wie jedes andere Formularfeld auch, wird dem Benutzer aber nicht angezeigt. "hidden" eignet sich sehr gut dazu, zusätzliche Informationen mit den Formulardaten an den Empfänger zu senden.
Für die Eingabe von Geheimnummern, Paßwörtern usw. gibt es einen speziellen Typ von Eingabefeld: "<input type=password>". Die eingegebenen Zeichen werden dabei durch Platzhalter (meistens Sternchen) dargestellt, so daß Personen im Raum des Anwenders nicht zufällig das eingegebene Passwort mitlesen können.
Ein typisches
mailform.htm könnte beispielsweise so aussehen:
<HTML>
<HEAD>
<TITLE>EKD-Karte Bestellformular</TITLE>
</HEAD>
<BODY BGCOLOR="#FFFFFF" TEXT="#4E2F55" LINK="#FF00FF" VLINK="#0000FF" ALINK="#FF0000">
<table border=0 cellpadding=5>
<font size="+3"><b>Neue EKD Karte '96</b></font><p>
<font size="+2"><b>Bestellformular</b></font>
<p>
<b>Preise:</b>
<table border=0 cellpadding=0>
<tr>
<td>1 Stück</td><td align=right> 12,00 DM</td>
<tr>
<td>5-19 Stück</td><td align=right> 10,00 DM</td>
<tr>
<td>20-29 Stück</td><td align=right>9,00 DM</td>
<tr>
<td>30-50 Stück</td> <td align=right>8,00 DM</td>
<tr>
<td colspan=2><i>Preise für mehr als 50 Stück auf Anfrage</i></td>
</table>
<p>
Hiermit bestelle ich verbindlich:<p>
</CENTER>
<FORM ACTION="mailto:kirche.online@gep.de" METHOD=POST enctype="text/plain">
<INPUT type=hidden name="Info" value="Bestellung der neuen EKD-Karte">
<table border=0 cellpadding=10>
<tr>
<td><b>Anzahl</b></td><td align=center><b>Artikel</b></td><td align=right><b>Gesamtpreis</b></td> <tr>
<td><INPUT TYPE="text" NAME="STUECK" size=4> Stück</td><td> Neue EKD Karte '96 </td><td align=right><INPUT TYPE="text" NAME="GESAMT" size=7</td>
<tr>
<tr>
<td colspan=3><i>jeweils einschl. Porto- und Verpackungskosten</i></td>
</table>
<p>
<table border=0 cellpadding=10>
<tr><td align=left width=180><font size="+1">Name: </td><td align=left width=300><INPUT TYPE="text" NAME="NAME" size=25></td>
<tr><td align=left width=180><font size="+1">Straße:</td><td align=left width=300><INPUT TYPE="text" NAME="STRASSE" SIZE=25></td>
<tr><td align=left width=180><font size="+1">PLZ/Ort: </td><td align=left width=300><INPUT TYPE="text" NAME="PLZ/ORT" size=25></td>
<tr><td align=left width=180><font size="+1">E-Mail: </td><td align=left width=300><INPUT TYPE="text" NAME="EMAIL" size=25></td>
<tr><td valign=top width=180><font size="+1">Kommentar:</td><td align=left width=300><TEXTAREA NAME="KOMMENTAR" ROWS=6 COLS=23></TEXTAREA></td>
<tr><td> </td><td><input type=SUBMIT value="Absenden"> <input type=RESET value="Löschen"></td>
<br>
</FORM>
</table>
</CENTER>
</BODY>
</HTML>
mailform.htm
|
Zum Seitenanfang
|