HTML - Eine Einführung in die Sprache des WWW (1)

Die Grundlage des World Wide Web bilden Dokumente im HTML-Format, die auf den WWW-Servern bereitliegen und von den Internet-Teilnehmern mittels geeigneter Browser abrufbar sind. Seit geraumer Zeit gibt es nun auch für den ATARI einen WWW-Browser -CAB - der die Dokumentenbeschreibungssprache HTML beherrscht. Damit eröffnet sich für den Anwender eine neue Art von Dokumenten.

Die enorme Anziehung» kraft des WWW rührt nicht zuletzt aus der Fähigkeit, dank HTML (Hypertext Markup Language) ' zeichenorientierte und grafische Browser auf jeder Plattform mit einem identischen Inhalt zu versorgen. Die Struktur eines Dokuments bleibt gleich und unterliegt nur der typischen Interpretation durch den Browser, der für das Layout zuständig ist. So kann ein Browser die Hervorhebung einer Textpassage durch einen kursiven Schriftstil darstellen, während ein anderer für dieselbe Hervorhebung einen fetten Schriftstil verwendet. Das ändert nichts daran, daß der Autor den Leser besonders auf diesen Teil seines Dokuments hinweisen will.

Mit der rasanten Entwicklung des WWW gewinnt zwangsläufig die verwendete Dokumentenbeschreibungssprache HTML immer mehr an Bedeutung, so daß mittlerweile eine große Anzahl von Dokumenten, die nicht über das WWW verbreitet werden, in HTML verfaßt sind.

Standardisiert

HTML stammt von SGML (Standard Generalized Markup Language) ab, ein Standard von 1988 zur Definition plattformunabhängiger Dokumenttypen. HTML ist gegenüber SGML um einige Kommandos erweitert, die zwischen Leser und Autor einen Rückkanal ermöglichen. Für die interaktiven Elemente - den Formularen - ist ein WWW-Server notwendig. Da eine solche Software für den ATARI nicht existiert und Erläuterungen zu Formularen den zur Verfügung stehenden Rahmen sprengen würden, gehe ich im weiteren nicht näher auf sie ein.

HTML selbst entwickelt sich sehr schnell weiter. Zur Zeit wird vom W3C (WWW Consortium) der Standard für HTML 3.2 erarbeitet. Unter http:// www.w3.orgfinden Sie zur Standardisierung weitere Informationen. Der hier verwendete „Referenz-Browser" ist CAB, der zumindest HTML 2.0 beherrscht. Der Autor Alexander Claus ist bemüht, die meisten, teilweise proprietären Erweiterungen, über die Netscape gegenüber HTML 2.0 verfügt, zu implementieren. Diese Einführung hat daher nicht den Anspruch „Standard-Konform" oder vollständig zu sein, sondern will vielmehr dem Leser die Grundlagen von HTML näher bringen, um mit bzw. für CAB HTML-Dokumente zu erstellen.

Syntaktisch

HTML-Dokumente lassen sich mit jedem beliebigen ASCII-Editor erstellen, denn es handelt sich um gewöhnliche Textdateien mit speziellen Steueranweisungen, den sogenannten Tags. Jede HTML-Anweisung befindet sich zwischen einer offenen und geschlossenen spitzen Klammer (Kleiner-/Größerzeichen), wobei einige Kommandos auch paarweise auftreten können. In diesem Fall kennzeichnet „<Kommando>" den Anfang und „</ Kommando" das Ende des Bereichs, in dem das Kommando wirkt. Innerhalb der spitzen Klammern können noch Attribute angegeben werden, die spezielle Eigenschaften einer Steueranweisung beeinflussen. Der typische Syntax eines HTML-Kommandos lautet in etwa so:

Hardware Zeichen Code Beschreibung &   & nicht trennbares Leerzeichen Und-Zeichen < &K; kleiner als > > größere als Ä Ä großesÄ Ö Ö großesÖ Ü &Unml; großesÜ ß ß scharfes s ä ä kleines ä ö &numl; kleines ö ü ü kleines ii

Tabelle: Auszug aus dem ISO-Latin-1-Zeichensatz

<Kommando [Attribut[="WERT,"]...]
>Text[</Kommando>]

HTML unterscheidet bei den Tags übrigens nicht zwischen Groß-oder Kleinschreibung. Zwischen „<Kommando>“ und „</Kommando>“ können anstatt des Textes auch weitere Tags stehen. Tags können - soweit sinnvoll - also auch verschachtelt werden. In den meisten HTML-Dokumenten wird davon auch rege Gebrauch gemacht.

Kryptisch

Die Syntax eines HTML-Kommandos läßt schon erkennen, daß die spitzen Klammern nicht direkt im Text enthalten sein dürfen. Andere Zeichen, beispielsweise die deutschen Umlaute, sind im 7-bit-ASCII-Zeichensatz gar nicht erst enthalten. HTML umgeht diese Beschränkungen, indem es den ISO-Latin-l-Zeichensatz verwendet. Dieser Zeichensatz definiert Codes, die mit dem Zeichen „&“ beginnen, mit einem Kürzel fortfahren und mit einem enden. Das Kürzel legt fest, welches Zeichen letztendlich vom Browser dargestellt wird. Das kleine „ä“ hat beispielsweise den Code „ä“, während das große „Ä“ mit dem Code „Ä‘‘ dargestellt wird. Die Tabelle auf dieser Seite stellt einige Codes des ISO-Latin-l-Zeichensatzes dar. Nicht alle Sonderzeichen haben Codes: In diesem Fall muß der numerische Wert verwendet werden, der wiederum mit „&“ beginnt, gefolgt von „#“ plus numerischen Code und abschließendem Eine komplette Aufstellung des ISO-Latin-l-Zeichensatzes finden Sie im WWW unter http://www. infocom.net/~bbs/iso8859.html.

Struktural

Neben der Syntax muß ein HTML-Dokument auch im Aufbau festen Regeln folgen. Jedes wird durch die Tags <HTML> und </HTML> umrahmt. Innerhalb dieser wird das Dokument in einen Head (<HEAD> und </HEAD>) und einen Body (<BODY> und </BODY>) unterteilt. Im ersteren wird unter anderem derTitel des Dokumentes mit dem Kommando <TITLE>TEXT</TITLE> angegeben, der üblicherweise im Titelbalken des Browser-Fensters erscheint. Im Body steht der eigentliche Inhalt des Dokuments. Am Ende eines HTML-Dokuments, aber noch innerhalb des Body-Bereichs, findet sich im allgemeinen ein Hinweis auf den Autor mit der Anweisung <ADDRESS>TEXT</ ADDRESS>.

Von Anker und Links

Ein Aspekt, der HTML-Dokumente von herkömmlichen unterscheidet, sind Verweise, auf Weitere, die die gewohnte Linearität von gedruckten Dokumenten durchbrechen. Die Verweise-im allgemeinen Links genannt - können an beliebiger Stelle im Text integriert sein und werden vom Browser meist durch Unterstreichungen kenntlich gemacht. Mit einem Mausklick auf einen Link lädt der Browser das adressierte Dokument. Links müssen nicht zwangsläufig auf ein anderes HTML-Dokument zeigen, sondern können jedes beliebige Medium, beispielsweise Grafiken, Sounds oder Videos, über eine URL ansprechen, weswegen sie auch gerne Hyperlinks genannt werden.

Links von einem Dokument auf ein anderes lauten allgemein <A HREF= ,,URL,,>TEXT</A>. Um auch bestimmte Positionen in einem Dokument ansprechen zu können, erlaubt HTML Markierungen im Dokument mit den Tags <A NAME="POS">TEXT</A>. Diese Markierungen werden Anker genannt. Der Link <A HREF="#POS" >TEXT</A> verzweigt dann an die markierte Stelle.

Anschaulich

Ansprechend gestaltete HTML-Dokumente enthalten neben der Information in Form von Text vor allem Grafiken, die einen Sachverhalt entweder anschaulich darstellen oder schlicht die Seite auflockern. Eine Grafik wird mit den Tags <IMG SRC^’URL" ALT= "TEXT1" in das Dokument eingebunden. Das Attribut ALT gibt den Text an, der dargestellt wird, falls der Browser rein textorientiert ist (z.B. Lynx) oder wenn das Anzeigen von Bildern im Browser ausgeschaltet ist. Die Angabe dieses Textes sollte daher unbedingt erfolgen. Grafiken können übrigens auch als Links fungieren.

Die meisten Browser bieten die Möglichkeit GIF und JPEG-Bilderdirekt anzuzeigen. Bei anderen Formaten werden externe Programme vom Browser gestartet und mit der Darstellung betraut. CAB kann ohne Zusatzprogramme Bilder im GIF-, JPEG- und XBM-Format darstellen.

Fließend

Alle Bereiche eines HTML-Dokuments, die sich nicht innerhalb eines Tags befinden, erscheinen als Fließtext. Der Browser übernimmt insbesondere den Umbruch des Textes. Er ignoriert dabei alle Sonder- oder Formatierungszeichen wie Tabulatoren oder Zeilenendezeichen und erzeugt aus dem laufendenTexteinen Absatz, der durch die in einem Fenster maximal darstellbare Breite vorgegeben ist.

Natürlich gibt es eine Reihe von Tags, die den Umbruch beeinflussen. Neben dem Kommando <P>, das einen neuen Absatz einleitet, ist das zum Beispiel das Kommando <HR>, das zwei Absätze durch eine Linie trennt, oder die Überschriften, die immer einen neuen Absatz erzwingen. HTML kennt übrigens sechs verschiedene Überschriften (<H1> bis <H6>). Mit steigender Ordnungsziffer nimmt die Fontgröße der Überschrift im allgemeinen ab.

Im Fließtext selbst kann das Aussehen einzelner Textpassagen auch beeinflußt werden. So heben die Tags <EM>TEXT</EM> den Text hervor, <B>TEXT</B> stellen den Text halbfett dar und <CITE>TEXT</CITE> kennzeichnen kurze Zitate. Weitere Tags diesen Typs finden Sie in einer Tabelle, die Sie in unserer Mailbox beziehen können, unter der Rubrik „Text-Attribute".

Aufzählungen und Listen

Neben Fließtext kommen in vielen Dokumenten Strukturen vor, die einzelne Textzeilen von Textabschnitten mittels spezieller Formatierung optisch abheben. Häufig sind diese Strukturen Aufzählungen oder Listen, die die einzelne Elemente etwas einrücken, durchnumerieren oder mit Aufzählungssymbolen versehen.

Solche Strukturen könnte man mit Hilfe des Kommandos <PRE>TEXT <PRE> erzeugen, weil der Browser den so umschlossenen Text nicht formatiert. HTML sieht aber für Aufzählungen und Listen eine Reihe von eigenen Anweisungen vor. Für eine ungeordnete Liste gibt es unter anderem die Tags <UL>TEXT</UL>. Im allgemeinen werden die Elemente einer solchen Liste vom Browser mit einem Aufzählungssymbol versehen - CAB markiert jedes Element der ersten Ebene mit einem gefüllten Kreis. Für eine geordnete Liste, deren einzelne Elemente numeriert werden, sind die Tags <OL>TEXT</OL> vorgesehen. Die einzelnen Elemente der beiden Listen werden innerhalb des entsprechenden Tags mit dem Kommando <LI> angegeben. Schließlich unterstützt HTML mit den Tags <DL>TEXT</DL> noch Glossare und Definitionen. Der zu definierende Ausdruck wird mit <DT>, die zugehörige Definition mit <DD> angeben. Dem Verschachtelungsprinzip folgend können alle Aufzählungen und Listen weitere HTML-Elemente wie Bilder, Links oder Tabellen enthalten.

Tabellarisch

Zu den mächtigsten Elementen von HTML sind ohne Zweifel die Tabellen zu zählen. Tabellen werden nicht nur für ihre ureigene Aufgabe eingesetzt, sondern dienen beispielsweise auch dazu die von Zeitungen gewohnten Textspalten zu realisieren.

Die Tags <TABLE> und </TABLE> umschließen eine Tabelle. Innerhalb der Zellen dürfen, wie auch schon bei Aufzählungen, weitere HTML-Elemente Vorkommen. Für die Kennzeichnung der einzelnen Elemente einer Tabeile dienen die Tags <TR>TEXT</TR> für die Zeilen und <TD>TEXT</ TD> sowie <TH>TEXT</TH> für die Zellen. <TD> ist für einen normal Zelleninhalt vorgesehen, während <TH> den Zelleninhalt hervorhebt. Mit dem Kommando <CAPTION> TEXT</<CAPTION> können Tabellen schließlich noch beschriftet werden. Diverse Attribute ermöglichen eine vielfache Variation.

Ausblick

Nicht nur bei Tabellen, auch bei vielen anderen Tags bilden die Attribute gewissermaßen das Salz in der HTML-Suppe. Einigen der zahlreichen Attribute lernen Sie im zweiten Teil dieser Einführung kennen. Außerdem bekommen Sie die Anwendung der Tags an Hand einiger Dokumente demonstriert. Bis dahin kann Ihnen Listing 1 als Grundlage für Ihr erstes eigenes HTML-Dokument dienen.

URL

Mit Hilfe der URLs (Uniform Resource Locator) können bestehende Dienste des Internets (z.B. FTP oder Gopher) einfach in das WWW integriert werden. Eine typische Adresse Im URL-Format Ist: http://www.camelot.de. Der Bestandteil vor dem Doppelpunkt gibt dabei den zu verwendenden Zugriffsmechanismus auf die dahinterstehende Adresse an. In obigem Beispiel wäre es HTTP. Weitere Zugriffsmechanismen sind FTP, Gopher, News oder auch File. Letzteres dient zum Zugriff auf das Dateisystem des eigenen Rechners.


<HTML> <HEAD> <TITLE>Was Sie schon immer &uuml;ber HTML wiesen wollten</TITLE> <BODY> <H1>Eine Einf&uuml;hrung in die Sprache des WWW</H1> <HR> <OL> <LI»Grundlagen von HTML 9: <UL> <LI>Einleitung <LI>Syntax <LI>Dokumentenstruktur <LI>Text, Grafiken, Linke, Listen und Tabellen </UL> <LI>Beispieldokumente und Erg&auml;nzungen </OL> <HR> Ein Link, der auf ein anderes <A HREF="Start.html">Dokument</A> zeigt. <HR> <IMG SRC="Figur.gif" ALT="Grafik"> <P>Eine Grafik im Dokument 23: <HR> <ADDRESS>J&uuml;rgen Koneczny</ADDRESS> <£M> <P>Entworfen mit CAB, Alexander Clause' Cool Atari Browser <BR»Letzte &Auml;nderung: 22. Juli 1996 </EM> </BODY> </HTML>

Listing 1: Ein erstes HTML-Dokument


Jürgen Koneczny
Links

Copyright-Bestimmungen: siehe Über diese Seite
Classic Computer Magazines
[ Join Now | Ring Hub | Random | << Prev | Next >> ]