JavaScript – M+T Pocket . Das Programmier-Handbuch (Office Einzeltitel) [Taschenbuch]

4.1
HTML-Grundstrukturen

Eine aus HTML aufgebaute Webseite beinhaltet nur zwei
grundsätzlich zu unterscheidenden Strukturen:

Steueranweisungen

Reiner Text

Steueranweisungen sind die HTML-Befehle. Alle
HTML-Steueranweisungen werden in so genannte »Tags« geschrieben, die von
spitzen Klammern – dem »Kleiner« und dem »Größer«-Zeichen – begrenzt werden.
Ein HTML-Tag sieht also von der Struktur her immer so aus:

<xyz>

Alles, was kein Tag ist (d.h., es ist nicht von einem
»Kleiner« und einem »Größer«-Zeichen eingeschlossen), wird in einer Webseite
als reiner Text verstanden. Das ist nicht so trivial, wie es im ersten Moment klingt.
Es hat fatale Auswirkungen. Ein großes Problem beim Interpreterkonzept (das ja
zur Darstellung von HTML-Dokumenten zum Tragen kommt) ist das schnelle Veralten
der Interpreter. Wenn in einer Interpretersprache ein oder mehrere neue
Befehl(e) hinzugefügt wird bzw. werden, können die bis dahin entwickelten
Interpreter diese Anweisung(en) noch nicht kennen und entsprechend nicht
ausführen. Anwender, die ein Dokument mit solch neuen Anweisungen in einem
davor veröffentlichten Interpretern laden, bekommen Schwierigkeiten. Da HTML
über die Zeit immer weiter entwickelt und vor allem durch Browser-spezifische
Zusatzanweisungen angereichert wurde, gibt es dementsprechend eine Vielzahl von
Dialekten und kein Browser kann alle vollständig. Was soll aber geschehen, wenn
ein Browser in einer HTML-Seite eine Anweisung findet, die er nicht versteht?
Abstürzen, wie es normalerweise Windows-Programme tun? Oder eine Fehlermeldung
bringen, mit der üblicherweise kein Anwender etwas anfangen kann?

Es gibt noch eine dritte Lösung – ignorieren. Und das ist,
obwohl es erst einmal nicht besonders positiv erscheinen mag, zumindest bei der
Beschreibung von Dokumenten die beste der drei Varianten. Das Ignorieren von
unbekannten Anweisungen durch den Browser basiert auf dem Prinzip der
Fehlertoleranz, welches zu den Eckdaten von HTML gehört. Dieses Prinzip
veranlaßt die Programme zur Auswertung von HTML-Dokumenten, bei der
Interpretation so fehlertolerant wie irgend möglich zu sein. Der äußerst
positive Effekt ist, dass dann auch syntaktisch unkorrekte Dokumente so weit
wie möglich ausgewertet werden können. Soweit Browser korrekte HTML-Anweisungen
vorfinden, werden diese Anweisungen ausgeführt und angezeigt. Falsche oder
unvollständige Anweisungen werden ganz einfach ignoriert. Und alles, was sich
außerhalb eines Tags befindet, wird als reiner Text im Anzeigebereich des
Browsers dargestellt.

Das Prinzip der Fehlertoleranz ist unumgängliche Voraussetzung dafür, dass immer neue HTML-Anweisungen oder neue Technologien im
Internet eingeführt werden können (das betrifft natürlich auch JavaScript) und
dennoch die älteren Browser beim Laden solcher Webseiten nicht
"abschmieren". Was sie nicht kennen, wird einfach ignoriert. Der Rest
wird dargestellt. Eine Abwärtskompatibilität der HTML-Dokumente ist also immer
sichergestellt, auch wenn signifikante Informationen beim Anzeigen verloren
gehen können. Dummerweise kann man bei Script- und Programmiersprachen nicht so
tolerant verfahren, da viele Schritte auf einander aufbauen.

Es gibt Tags, die zwingend einen Beginn- und einen
Ende-Befehl benötigen. Beide zusammen einen so genannten Container, der
den Bereich für die Wirkung einer HTML-Anweisung festlegt. Etwa, von wo bis wo
ein Text fett dargestellt werden soll. Bei Tags nennt man das Einleitungs- und
Abschluss-Tag. Abschluss-Tags sind bis auf einen den öffnenden Klammer
folgenden Slash (/)
identisch zum Einleitungs-Tag. Der Abschluss-Tag zum Einleitungs-Tag <xyz> würde
wie folgt aussehen:

</xyz>

Beispiele:

<i> … </i>

<h6> … </h6>

<center> … </center>

<p> … </p>

Andere Tags kommen in der strengen HTML-Syntax hingegen nur
als Einleitungs-Tag vor. Beispielsweise ein Zeilenumbruch, der durch <BR> auch
ohne Ende-Tag vollständig beschrieben ist.

Bei den HTML-Steueranweisung spielt es im Gegensatz zu den
Befehlsanweisungen vieler anderer Sprachen keine Rolle, ob sie groß oder klein
geschrieben werden (bei JavaScript wird das aber eine Rolle spielen). Die
Anweisung <h4>
bewirkt das gleiche wie
<H4>. Auch eine unterschiedliche Groß- und Kleinschreibung
im Einleitungs- und Abschluss-Tag oder sogar innerhalb einer Anweisung hat
keine negativen Auswirkungen, erhöht jedoch nicht gerade die Lesbarkeit. Für
die Zukunft steht aber zu erwarten, dass auch in HTML Groß- und Kleinschreibung
relevant wird. Dann werden HTML-Anweisungen wahrscheinlich klein geschrieben.

Viele Tags sind erst dann sinnvoll einzusetzen, wenn sie
genauer spezifiziert werden. Nicht jeder, denn ein Zeilenumbruch ist immer
durch die Anweisung <BR>
vollständig beschrieben. Dann gibt es Anweisungen, die mit oder ohne Parameter
funktionieren. Etwa der <BODY>-Tag.
Wenn Parameter angegeben werden, werden bestimmte Aspekte genauer spezifiziert.
Fehlen sie, werden Grundwerte zum Einsatz kommen. Aber nicht alle Anweisungen
sind so eindeutig oder flexibel. So gibt es beispielsweise die Steueranweisung <FONT>, mit
der die Bedingungen für die Schrift angegeben werden. Aber ohne genauere
Angaben ist die Anweisung sinnlos. Die Schriftgröße, die Schriftart oder die
Schriftfarbe sind genauere Spezifikationen, welche durch so genannte Parameter
erfolgen. Diese werden bei Bedarf den einleitenden Tag – durch Leerzeichen
abgetrennt – erweitern. Dabei gibt es zwei Formen von Parametern:

1.
Parameter mit einer Wertzuweisung

2.
Parameter, die bereits einen Wert repräsentieren

Parameter mit einer Wertzuweisung bekommen über einen
Zuweisungsoperator – dem Gleichheitszeichen (=) – den entsprechenden Wert zugeordnet.
Dies kann ein Text oder eine Zahl sein oder aber auch andere Dinge (etwa eine
Internet-Adresse). Meist werden die Werte in Hochkommata eingeschlossen, aber
das ist nicht unbedingt notwendig. Ein Tag mit einem Parameter mit einer
Wertzuweisung sieht schematisch so aus:

<Anweisung Parameter = Wert>

Beispiele:

<FONT color=red>

<IMG
src="https://rjs.de//devil.gif">

Parameter, die bereits einen Wert repräsentieren, brauchen
bloß durch ein Leerzeichen abgetrennt (!) in den Einleitungs-Tag geschrieben
werden. Sie fungieren immer als Schalter. Wenn sie angegeben werden, wird eine
Eigenschaft aktiviert, fehlen sie, ist die jeweilige Eigenschaft deaktiviert.
Ein Tag mit einem Parameter, der bereits einen Wert repräsentiert, sieht
schematisch so aus:

<Anweisung Parameter>

Beispiel:

<TABLE border>

Diese Anweisung setzt einen Tabellenrahmen.

Es wird immer nur der einleitende Tag durch Parameter
erweitert. Beim beendenden Tag wird niemals ein Parameter angegeben!

Viele Befehle lassen sich über mehr als einen Parameter
spezifizieren. Diese werden dann einfach durch Leerzeichen getrennt
aufgelistet. Dabei spielt die Reihenfolge der Parameter keine Rolle.

Beispiele:

<BODY bgcolor=white text=red>

Das nachfolgende Beispiel bewirkt das analoge Resultat:

<BODY text=red bgcolor=white>

4.1.1
Das Grundgerüst einer Webseite

Da HTML eine äußerst fehlertolerante Beschreibungssprache
ist, werden Webseiten selbst in Situationen, wo in anderen Sprachen
geschriebene Dokumente oder Programmstrukturen einen Fehler oder einen
Programmabbruch auslösen würden, trotzdem oft noch brauchbare Resultate liefern.
Reine HTML-Seiten haben (bis auf Sonderfälle) die Dateiendung htm, html oder shtml.
Alleine diese lassen das Dokument zu einem HTML-Dokument werden. Für eine
HTML-Seite gibt es jedoch dennoch wie für jedes andere Dokument oder andere
Programmiersprache immer ein Grundgerüst und gewisse Grundregeln.

Eine korrekt aufgebaute HTML-Seite wird immer in die
Anweisung

<HTML>

am Anfang und

</HTML>

am Ende eingeschlossen. Die beiden Anweisungen immer
das äußere Gerüst einer HTML-Seite. Davor dürfen höchstens Kommentarzeilen
stehen, die natürlich auch überall im Inneren einer HTML-Seite verwendet werden
können. Die Steuerzeichen für Kommentarzeilen sind ein Ausrufezeichen und zwei
Striche am Anfang und zwei Striche am Ende des Tags. Jeder in diesem Tag stehende
Text wird vom interpretierenden Browser als Kommentar betrachtet. Ein Kommentar
kann über mehrere Zeilen gehen und natürlich ebenfalls im Inneren einer
HTML-Seite verwendet werden. Auch ein Kommentar-Tag muss von spitzen Klammern
eingeschlossen werden, also sehen die Zeichenfolgen so aus:

<!– … –>

Beispiel:

<!– Generated by RJS –>

Das weitere Grundgerüst einer HTML-Datei besteht
grundsätzlich aus folgenden zwei Teilen:

Dem (optionalen) Header (Kopf)

Dem Body (Körper)

Nach der einleitenden HTML-Anweisung steht in einer Webseite
normalerweise ein Header-Teil, das heisst ein Kopfteil, in dem die allgemeinen
Hintergrundinformationen über eine Webseite notiert werden. Beispielsweise der
Titel, welcher in die Zeichenketten

<TITLE>

und

</TITLE>

eingeschlossen wird. Im Header werden auch so genannte
Metainformationen platziert. Etwa Copyright-Informationen und vor allem
wichtige Angaben für Suchmaschinen. Dies erfolgt mittels des <META>-Tags,
der auf verschiedenste Art und Weise verwendet werden kann. Oft finden Sie <META>-Tags
in Verbindung mit den Attributen name und content. Über name wird eine Eigenschaft angegeben
(etwa der Autor, Schlüsselworte, auf Grund denen die Webseite in einer
Suchmaschine gefunden werden soll oder eine Beschreibung der Webseite) über content der Wert
dieser damit benannten Variablen. Diese beiden Informationen zusammen
ein Wertepaar, das auch nur in Verbindung Sinn macht.

Grundsätzlich wird ein Header mit dem Tag

<HEAD>

begonnen und mit

</HEAD>

entsprechend wieder geschlossen.

Die eigentlichen Daten, die der WWW-Browser einem Anwender
auf dem Bildschirm anzeigen soll, werden in den Body geschrieben. Die Tags <BODY> und </BODY> umschließen den
Anzeigebereich einer Webseite. In dem Body ist der eigentliche Text mit
Überschriften, Verweisen, Grafikreferenzen und auch die Referenz für
Java-Applets zu notieren. Das vollständige Grundgerüst einer normalen
HTML-Datei sieht also schematisch immer so aus.

<!– Kommentar –>

<HTML>

<HEAD>

<TITLE>Titel</TITLE>

</HEAD>

<BODY>

Überschriften, Text,

Verweise, Grafiken, Java-Applet-Referenz usw.

</BODY>

</HTML>

Mehr zu HTML finden Sie in tabellarischer Form im Anhang.