HTML-Einführung von Hubert Partl, Septmeber 1997


Interaktion mit dem Benutzer

Mehr Leben ins World Wide Web!

Hier finden Sie nur kurze Hinweise auf diese Möglichkeiten für "Fortgeschrittene". Genauere Informationen müssen Sie der Dokumentation des jeweiligen WWW-Servers und den Referenzen entnehmen. Dort finden Sie auch Informationen über die folgenden weiteren Möglichkeiten:


CGI-Programme am Server (Common Gateway Interface)

Eine CGI-Prozedur ist ein Computer-Proramm, das auf dem WWW-Server läuft und die Ausgabe wie ein HTML-File an den Client sendet.

Im Gegensatz zu HTML-Files, die einen fixen Inhalt haben, kann man damit Informationen verteilen, die sich laufend ändern oder die von Benutzer-Eingaben abhängen.

Der Aufruf der CGI-Prozedur erfolgt in einem Hypertext-Link oder einem Formular mit einem URL der Form
http://hostname/cgi-directory/filename
oder
http://hostname/cgi-directory/filename?parameterliste

Beispiel:

Eine einfache Unix-Shell-Prozedur, die Datum und Uhrzeit anzeigt:


#!/bin/sh

echo "Content-Type: text/html"

echo ""

echo "<html><head><title>Datum</title></head>"

echo "<body><p>Heute ist "

date 

echo "</body></html>"

exit

- - -

Eine etwas ausführlichere Version einer solchen Datumsanzeige finden Sie an der BOKU Wien.

CGI-Prozeduren können in verschiedenen Sprachen geschrieben werden (Shell-Scripts, Perl-Scripts, C-Programme u.a.). Die Detail-Informationen dazu finden Sie in der Dokumentation des jeweiligen WWW-Servers und in den Referenzen, siehe auch die Hinweise von Stefan Münz zu CGI-Programmen und Perl.


Zugriffe zählen

Sie als Autor möchten wahrscheinlich wissen, wie oft Ihre Informationen von Interessenten in aller Welt gelesen werden.

Relativ leicht können Sie erfahren, wie oft auf Ihr HTML-File am WWW-Server zugegriffen wurde. Die meisten WWW-Server führen ein "Log-File", in dem alle Zugriffe protokolliert werden, und Sie können mit einem einfachen Unix-Shell-Script zählen, wie oft Ihr Filename darin vorkommt. Beispiel:


#!/bin/sh

url="$1"

logfile=/usr/local/apache/logs/access_log

n=`grep -i "$url" $logfile | wc -l`

echo "$n Zugriffe auf $url"

exit

Außerdem finden Sie im Log-File auch die Information, von welchen Client-Rechnern auf Ihr File zugegriffen wurde (aber im allgemeinen nicht, von welchen Personen).

Damit zählen Sie aber nur die Anzahl der File-Übertragungen und nicht, wie oft die Information tatsächlich gelesen wurde. Schuld daran sind die sehr nützlichen sogenannten Cache-Speicher, die zur Entlastung der Netzverbindungen notwendig sind:

Die meisten Web-Browser haben einen lokalen Cache-Speicher. Wenn z.B. ein Benutzer in Berlin zehn mal die in Wien gespeicherte HTML-Einführung liest, wird sie nur beim ersten Mal von Wien nach Berlin übertragen und, solange der Platz ausreicht, in seinem Cache-Speicher abgelegt. Bei allen weiteren Zugriffen wird das File nicht nochmals von Wien nach Berlin übertragen, sondern viel einfacher und schneller aus dem lokalen Cache geholt (außer der File-Inhalt wurde inzwischen erneuert).

Viele Institutionen verwenden auch globale Cache-Server ("Proxy"), die dann für alle Zugriffe aus diesem Bereich wirken. Wenn z.B. tausend Benutzer in Berlin die in Wien gespeicherte HTML-Einführung lesen, wird sie nur beim ersten Mal von Wien nach Berlin übertragen und eine Kopie am Berliner Cache-Server abgelegt (solange der Speicherplatz ausreicht). Bei allen weiteren Zugriffen wird das File nicht nochmals von Wien nach Berlin übertragen, sondern viel schneller aus dem Berliner Cache-Server geholt (außer der File-Inhalt wurde inzwischen erneuert).

Die Zahl, wie oft Ihr File tatsächlich gelesen wurde, ist im allgemeinen also wesentlich höher als die am WWW-Server gezählte Zahl der File-Übertragungen.

Manche Autoren wollen die Zahl der Zugriffe auch innerhalb des HTML-Files speichern. Dies ist zwar technisch möglich (z.B. mit Hilfe einer CGI-Prozedur), aber nicht empfehlenswert, weil das eine zusätzliche Netz- und Server-Belastung bedeutet und weil die Anzahl der File-Übertragungen meist ohnehin nur für den Autor der Information und den Verwalter des WWW-Servers, aber nicht für die Leser interessant ist.


Formulare <form>

Der Inhalt von HTML-Files wird jeweils vom WWW-Server zum Benutzer am Client gesendet. Mit Hilfe von Formularen, die in HTML-Files stehen, können in der Gegenrichtung die Benutzer bestimmte Informationen am Client eingeben und an den WWW-Server senden. Diese Daten werden meistens von einer auf diesem Server laufenden CGI-Prozedur verarbeitet.

Beispiel:

- - - Die Eingabe von


<form method="get" 

action="http://www.boku.ac.at/cgi-bin/hein-get">

<b>Anmeldung</b> zur Geburtstagsfeier am 8. M&auml;rz 

<p>

<input type="radio" name="kommt" value="ja" checked> 

Ich komme.

<br>

<input type="radio" name="kommt" value="nein"> 

Ich komme nicht.

<p>

Name: 

<input name="wer" size="40" maxlength="512">

<p>

Telefonnummer: 

<input name="tel" size="20" maxlength="512">

<p>

<input type="submit" value="Anmeldung absenden">

</form>

- - - bewirkt eine Darstellung wie

Anmeldung zur Geburtstagsfeier am 8. März

Ich komme.
Ich komme nicht.

Name:

Telefonnummer:

- - -

Anmerkung: Die in diesem Beispiel verwendete CGI-Prozedur dient nur für Tests durch die Leser dieser Einführung. Wenn Sie dieses Formular ausfüllen und absenden, bekommen Sie eine kurze Test-Antwort, aber (leider) keine wirkliche Einladung zum "Heurigen".

Eine "echte" Anmeldungs-Prozedur würde die Zu- und Absagen mit Name und Telefonnummer in einer Datenbank speichern und dann die Bestätigung an den Client senden.

Das Senden einer solchen Antwort ist immer notwendig, denn der Benutzer muß auf seinem Bildschirm erkennen können, daß das "Anklicken" des Submit-Knopfes funktioniert hat ("Feedback"). Im einfachsten Fall genügt eine kurze Meldung, daß die Eingabe verarbeitet wird, und eventuell ein Hinweis, daß der Benutzer mit der Back-Taste oder dem Back-Befehl seines Browsers zur vorherigen Information zurückkehren und weiterarbeiten kann.

Bei der Gestaltung von Formularen müssen die Normen und Konventionen für Benutzerschnittstellen und die Gewohnheiten und Erwartungen der Benutzer berücksichtigt werden.

Für genauere Informationen über die vom Server unterstützten Übertragungs-Methoden ("get" oder "post") und die Übergabe der Eingabedaten an die CGI-Prozedur wird auf die Dokumentation des jeweiligen WWW-Servers und auf die Referenzen verwiesen. Die CGI-Prozeduren müssen so geschrieben werden, daß Ihre Ausführung kein Sicherheitsrisiko für den Server-Computer darstellen kann, egal was für eventuell seltsame Eingaben von den Benutzern kommen.

Wenn Sie keine Möglichkeit haben, ein CGI-Programm auf dem von Ihnen verwendeten WWW-Server zu installieren, bietet sich als Alternative die Verwendung von Electronic Mail an.

Manche (wenige) Web-Browser bieten die Möglichkeit, Formulare per E-Mail zu verarbeiten. Dazu würden Sie im Formular mit
<form action="mailto:user@host.domain" enctype="text/plain">
Ihre eigene Mail-Adresse angeben, und jedesmal, wenn ein Leser dann den Submit-Knopf "drückt", bekommen Sie den Formularinhalt als lesbaren Text per E-Mail in Ihre Mailbox gesendet und können ihn dann händisch oder mit einem auf Ihrem Computer laufenden Programm verarbeiten.

Allerdings werden solche Mailto-Formulare von sehr vielen Web-Browsern nicht unterstützt. Diese Methode kann daher nur innerhalb von kleinen, geschlossenen Benutzergruppen eingesetzt werden, bei denen man sicher ist, daß sie alle eine dafür geeignete Browser-Version verwenden, abe nicht für allgemein verwendbare Anwendungen.

Deshalb sollte man, wenn man keine CGI-Programme verwenden kann, lieber gar keine Formulare verwenden sondern ein normales Mailto-Link, bei dem die Benutzer den Text "formlos" schreiben und per E-Mail absenden können. Diese Möglichkeit steht dann allen Internet-Benutzern offen.

Beispiel:


<p>

Bitte senden Sie Ihre Anmeldung per

<a href="mailto:user@host.domain">E-Mail

an user@host.domain</a>

oder per Telefax an ...

- - -


Image-Maps (ismap <map> usemap)

Image-Maps (Bild-Karten) erlauben die Verzweigung zu bestimmten Informationen durch die Auswahl ("Anklicken") von bestimmten Regionen innerhalb eines Inline-Bildes.

Dafür gibt es zwei verschiedene Verfahren:

In HTML 4 wird empfohlen, in Zukunft nur mehr Client-seitige und nicht mehr Server-seitige Image-Maps in HTML-Files einzubauen.

Server-seitige Image-Maps (ismap)

Bei Server-seitigen Image-Maps muß die Verarbeitung durch eine auf dem WWW-Server laufende CGI-Prozedur erfolgen. Diese Möglichkeit war bereits in HTML 2 vorgesehen und wird von allen graphikfähigen Web-Browsern unterstützt.

Im HTML-File ist eine Kombination aus einem <a href>-Befehl für die CGI-Prozedur und einem <img>-Befehl für das Bild mit der Angabe "ismap" anzugeben.

Beispiel:

- - - Die Eingabe von


<a href="http://www.boku.ac.at/cgi-bin/hein-map">

<img src="austria.gif" ismap></a>

- - - bewirkt eine Darstellung wie

und je nachdem, wo in diesem Bild Sie "klicken", bekommen Sie eine entsprechende Antwort von der CGI-Prozedur.

- - -

Für genauere Informationen über das Zusammenspiel zwischen Bild und CGI-Prozedur und über Hilfsprogramme zu deren Erstellung wird auf die Referenzen verwiesen.

Client-seitige Image-Maps <map> usemap

Bei Client-seitigen Image-Maps erfolgt die Verarbeitung durch den Web-Browser auf Grund von entsprechenden Angaben im HTML-File, und es ist keine CGI-Prozedur notwendig. Diese Möglichkeit ist seit HTML 3.2 vorgesehen und wird von allen neueren Web-Browsern unterstützt.

Die Spezifikation, welche Teile des Bildes den Sprung zu welchem Hypertext-Link bewirken sollen, erfolgt mit Hilfe von <map> entweder im selben HTML-File wie die Verwendung des Bildes oder in einem separaten File, das gemeinsam mit dem Bild abgespeichert ist.

Im <img> oder <object>-Befehl des Bildes wird dann mit "usemap" auf diese Map-Spezifikation verwiesen.

Da nicht alle Benutzer die Darstellung von Bildern eingeschaltet haben und da manche Web-Browser und viele Suchmaschinen solche Image-Maps nicht richtig verarbeiten, muß man bei einer Image-Map zusätzlich ein "normales" Link mit <a href> angeben, das zu einer Liste von Hypertext-Links in einfacher Textform führt. Damit wird sichergestellt, daß alle Benutzer und Suchhilfen die betreffenden Informationen erreichen können.

Beispiel:

- - - Die Eingabe von


<map name="map3">

<area shape=rect coords="0,0,89,15"  href="#oben"  alt="oben">

<area shape=rect coords="0,16,89,31" href="#mitte" alt="mitte">

<area shape=rect coords="0,32,89,47" href="#unten" alt="unten">

</map>

<p>Klicken Sie auf eines der drei Felder der Fahne 

<a href="#ohnemap"> 

<img src="austria.gif" alt="oder hier!" usemap="#map3"></a>

- - - bewirkt die Ausgabe von

oben mitte unten

Klicken Sie auf eines der drei Felder der Fahne oder hier!

Je nachdem, wo Sie in diesem Bild "klicken", gelangen Sie zu einer der folgenden vier Stellen:

  1. Sie haben das obere rote Feld ausgewählt.
  2. Sie haben das mittlere weiße Feld ausgewählt.
  3. Sie haben das untere rote Feld ausgewählt.
  4. Ihr Browser unterstützt Client-seitige Image-Maps nicht. Sie sind deshalb hier bei der Alternative "ohne Map" gelandet und können die drei Möglichkeiten nun mit normalen Hypertext-Links auswählen:

Die Eingabe für die im vierten Punkt beschriebene Alternative hat einen Aufbau der folgenden Form:


<a name="ohnemap">Ihr Browser ... </a> 

Sie ... k&ouml;nnen ... nun ... ausw&auml;hlen:

<ul>

<li><a href="#oben">Informationen zum oberen Bereich</a>

<li><a href="#mitte">Informationen zum mittleren Bereich</a>

<li><a href="#unten">Informationen zum unteren Bereich</a>

</ul>

- - -

Manche Web-Browser stellen <map> nicht als Bild sondern als eine Art Pull-down-Menü mit den in den ALT-Parametern angegebenen Texten dar. Die Angabe dieser Texte mit alt= in <area> ist deshalb zwingend vorgeschrieben.


Electronic Mail (mailto)

Die Angabe eines mailto-URL in einem <a href>-Befehl gibt dem Leser die Möglichkeit, von seinem Client aus eine kurze Nachricht per E-Mail an eine bestimmte Mail-Adresse zu senden, z.B. an den Autor der Web-Page.

Der Benutzer muß das Subject, den Text der Nachricht und seine Absender-Adresse am Client eintippen, und er muß die Erlaubnis zum Absenden von Mail haben.

In HTML 4.0 ist vorgesehen, daß man das "Subject" (den Betreff) in der Form
<a href="mailto:mailadresse" title="subject">...</a>
angeben kann. Dies wird allerdings derzeit noch von vielen Web-Browsern ignoriert, d.h. die E-Mail wird von denen zwar richtig zugestellt, aber eventuell nicht mit den angegebenen Subject.

Es gibt einen Web-Browser, der stattdessen die nicht genormte Form
<a href="mailto:mailadresse?subject">...</a>
unterstützt. Diese Form sollte man aber niemals verwenden, denn sie führt bei allen anderen Web-Browsern dazu, daß die E-Mail überhaupt nicht zugestellt werden kann, weil sie eine durch das "Anhängsel" ungültige Mail-Adresse aufweist.

Ob das Absenden von E-Mail innerhalb des Web-Browsers funktioniert, hängt von der Konfiguration am Client-Rechner ab. Außerdem sind "richtige" Mail-Programme für das Versenden von Electronic Mail im allgemeinen besser geeignet, insbesondere für wichtige oder längere Mail-Texte und für das Lesen von Antworten.

Deshalb und auch für den Fall, daß der Benutzer die Web-Page auf einem Drucker ausdruckt, sollte man die Mail-Adresse nicht nur "versteckt" im URL sondern auch sichtbar im Text angeben.

Beispiel:

- - - Die Eingabe von


Wenn Ihnen meine HTML-Einf&uuml;hrung gef&auml;llt, 

sagen Sie es bitte Ihren Kollegen. <br>

Wenn Sie darin Fehler finden, sagen Sie es bitte 

<a href="mailto:partl@mail.boku.ac.at">mir</a>. 

<br>

Meine Mail-Adresse ist 

<a href="mailto:partl@mail.boku.ac.at">partl@mail.boku.ac.at</a>. 

- - - bewirkt eine Darstellung wie

Wenn Ihnen meine HTML-Einführung gefällt, sagen Sie es bitte Ihren Kollegen.
Wenn Sie darin Fehler finden, sagen Sie es bitte mir.
Meine Mail-Adresse ist partl@mail.boku.ac.at.

- - -


Vorwort . Wegweiser . Inhaltsverzeichnis . Wörterbuch . Referenzen . Copyright
© Hubert Partl, BOKU Wien