3

3. Der Blick hinter die Kulissen von HTML

3.1 Aufbau einer HTML-Seite

Obwohl Frontpage Express keine detaillierte Kenntnisse über HTML voraussetzt, sollte man trotzdem den prinzipiellen Aufbau einer HTML-Seite kennen. Das sorgt für ein tieferes Verständnis und erlaubt auch Formatierungen, die FP Express nicht explizit anbietet.

HTML enthält nur druckbare Zeichen (7-Bit-ASCII). Das bedeutet, daß Formatierungsanweisungen auch aus diesem Zeichensatz gebildet werden müssen.

Im oberen Teil der folgenden Tabelle ist eine einfache HTML-Beispielseite so dargestellt, wie sie ein Browser anzeigt. Im unteren Teil sehen Sie den kompletten Text, der dahinter steckt.

Das ist eine Beispielseite

Das ist ein Text, der in dieser Seite enthalten ist.

Hier haben wir Fettschrift.
Das ist rot und größer geschrieben.

<HTML>
    <HEAD>
      <TITLE>Dies wird nicht vom Browser angezeigt</TITLE>
    </HEAD>
  <BODY>
    <H3>Das ist eine Beispielseite</H3>
    <P>
    Das ist ein Text, der in dieser Seite enthalten ist.
    <P>
    Hier haben wir <B>Fettschrift</B>.<BR>
    Das ist 
    <FONT COLOR=red SIZE=+1>rot und größer</FONT> 
    geschrieben.
  </BODY>
</HTML>

Man erkennt die Struktur von HTML. Um "Steuerzeichen" (englisch: tag = Etikett, Schildchen) als solche kenntlich zu machen, werden sie mit kleiner- und größer-Zeichen eingeschlossen. Zu (fast) jedem Tag gibt es ein "End"-Tag, das zusätzlich das / - Zeichen enthält und die entsprechende Formatierung beendet.

Das komplette Dokument wird durch die Tags <HTML>...</HTML> eingeschlossen.

<HEAD>...</HEAD> schließt einen Kopf ein. Die dort untergebrachten Informationen werden nicht anzeigt. Sie dienen der Verwaltung des Dokuments und werden z.B. von Suchmaschinen im WWW ausgewertet.

Alles, was zwischen <BODY>...</BODY> steht, wird dargestellt.
<H3>...</H3> markiert eine von 6 möglichen Überschriftarten.
<BR> bewirkt einen Zeilenumbruch und <P> erzeugt einen neuen Absatz. Diese beiden Tags brauchen keinen End-Tag.

Manche Tags können Parameter enthalten (u.U. sehr viele!). Als Beispiel sehen Sie oben das <FONT> - Tag, das als Parameter die Angabe der Farbe und Größe enthält.

In einigen Eigenschaftsfenstern von FP Express finden Sie einen Knopf Erweitert. Hiermit können Sie zu dem entsprechenden Tag Parameter "von Hand" hinzufügen.

3.2 Der in Frontpage Express eingebaute HTML-Quelltexteditor

Sie können die HTML-Dateien mit jedem beliebigen (ASCII-) Texteditor bearbeiten (z.B. mit Windows-Notepad). In Frontpage Express ist aber schon ein solcher Editor eingebaut, der zusätzlich die Tags farblich vom Text absetzt und die Struktur des Textes durch Einrückungen sichtbar macht.
Mit dem Menüpunkt Ansicht / HTML wird dieser Editor eingeblendet.

Verändern Sie am Quelltext etwas und schließen dann das Editor-Fenster, werden die Änderungen - falls von FP Express darstellbar - automatisch in die WYSIWYG-Ansicht übernommen.

3.3 Ein Formatierungsbeispiel mit dem Quelltexteditor

Geschachtelte Listen können von Frontpage Express nicht direkt erzeugt werden.
Im folgenden Beispiel wurde die Schachtelung der Listen deshalb von Hand im Quelltexteditor eingetippt.

<ol>...</ol> steht für "Ordered List"
<li>...</li> steht für "List-Element"
<ul>...</ul> steht für "Unordered List"

Verschiedene Parameter wurden verwendet:
type="a" start="24" bewirkt eine Numerierung mit Buchstaben, beginnend beim 24. Buchstaben im Alphabet.
type="disc" gibt an, daß gefüllte Kreise als Markierung verwendet werden sollen.

Das Beispiel erzeugt folgende Darstellung:

Insekten
Säugetiere
1. Waale
2. Affen
  - Schimpansen
  - Gorillas
3. Pferde
Vögel

Obwohl die geschachtelten Listen von Hand erzeugt wurden, lassen sich durch rechten Mausklick in die Teilliste ihre Eigenschaften einstellen. Obige Parameter müssen also nicht unbedingt im Quelltexteditor eingegeben werden.