Möglichkeiten der Seitengestaltung
(HTML-Kurs, 5):

Zitate, Einrückungen, Schriftgröße und -art, Hintergrundgraphik und Farben, Style Sheets

Inhalt

Zitate

Längere Zitate kann man mit <blockquote></blockquote> definieren. Die Browser stellen diesen Text meist eingerückt dar. Davor und danach wird automatisch eine neue Zeile begonnen.

Über allen Gipfeln
Ist Ruh,
In allen Wipfeln
Spürest du
Kaum einen Hauch;
Die Vögelein schweigen im Walde.
Warte nur, balde
Ruhest Du auch.

Einrückungen

  1. Über BLOCKQUOTE

    <Blockquote> darf im strengen Sinn nur für Zitate verwendet werden (damit Suchmaschinen diese identifizieren können), wird aber oft für Einrückungen von beliebigem Text ge- bzw. mißbraucht.

  2. Über &nbsp;

    "Non-breaking space" - Leerzeichen, an dem kein Zeilenumbruch erfolgen darf.

    Damit läßt sich z.B. die erste Zeile eines Absatzes einrücken, z.B.

              Hier beginnt ein neuer Absatz, dessen erste Zeile eingerückt ist.

    Quelltext:

    &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Hier beginnt ein neuer Absatz, dessen
    erste Zeile eingerückt ist.

    Vorsicht: ältere Browser kennen diese HTML 3.2-Entity nicht und stellen sie im Klartext dar!

  3. Über Tabellen

  4. Text Positionieren

    HTML 3.2 erlaubt es, die Absatz-Markierung <P> durch das ALIGN-Attribut zu erweitern: LEFT, RIGHT, CENTER oder JUSTIFY. Das Ende der Markierung wird mit </P> angezeigt.

Schriftgröße ändern

Grundsätzlich ist auch hier Vorsicht und Zurückhaltung angebracht: die Schriftgrößendarstellung variiert von Browser zu Browser - was auf dem einen Rechner gut aussieht, kann auf dem anderen nur schwer lesbar sein.
  1. Schriftgröße der gesamten Seite ändern: BASEFONT

    Dies erreicht man dadurch, daß man nach <body> <basefont size="n"> eingibt
    (n=Zahl von 1-7, voreingestellt ist 3=die Browser-Einstellung).

  2. Schriftgröße einzelner Zeichen ändern: FONT

    Dies erreicht man dadurch, daß man das oder die betreffende(n) Zeichen mit <font size="n">Zeichen</font> umschließt
    (n=Zahl von 1-7, voreingestellt ist 3=die Browser-Einstellung; ist die Browser-Einstellung durch BASEFONT aufgehoben worden, bezieht sich FONT auf die dadurch bestimmte Schriftgröße. Statt einer einfachen Zahl kann man durch Voranstellen von + oder - auch eine relative Änderung bewirken).

  3. Schriftgröße einzelner Zeichen ändern: BIG oder SMALL

    Vergrößerung oder Verkleinerung einzelner Zeichen erreicht man auch durch <big></big> oder <small></small>.
    Diese relative Schriftgrößenänderung ist der absoluten (FONT) vorzuziehen, da sie dem Browser die Möglichkeit einer sinnvollen Darstellung läßt.

Schriftarten wählen

Über <FONT FACE="Font1,Font2,Font3, ...">...</FONT>, z.B. Arial.
Findet der Browser Font1 nicht, so benutzt er die nächste angegebene Schriftart, usw., bis er eine installierte gefunden hat.
Nur neuere Browser, und eben abhängig von den auf dem lokalen Rechner installierten Schriften, deshalb besser nicht verwenden.

Hintergrundgraphik und Farben

HTML 3.2 erlaubt die Erweiterung von <BODY> durch "#RRGGBB" - bezeichnet die hexadezimale Farb-Kodierung nach dem RGB-Modell.
Am besten arbeitet man mit einem geeigneten Editor wie HTMLed oder auch dem Netscape Composer, oder benutzt den ColorPicker oder diese Testseite.
Beispiel: diese Seite hat als <BODY>:
<BODY BGCOLOR="#FFFBF0" TEXT="#000000" LINK="#0000FF" VLINK="#008000" ALINK="#FF0000">

Mit <FONT COLOR="#FF0000">...</FONT> können Textteile hervorgehoben werden.

Style Sheets

HTML 4.0 erlaubt die Verwendung von Style Sheets oder CSS - Cascading Style Sheets. Das sind gewissermaßen Formatvorlagen, mit denen man das Layout bestimmter HTML-Markierungen festlegen kann - so daß beispielsweise alle Überschriften 1. Grades (<H1>) zentriert werden.

Struktur und Layout werden getrennt, und alle Seiten sehen einheitlich aus.

Außerdem können so beliebige Elemente pixelgenau auf der Seite positioniert werden (absolute Positionsangabe).

Da die Syntax nicht leicht zu erlernen ist und vielen Browsern Schwierigkeiten bereitet, wird hier nicht näher darauf eingegangen.

HTML-Kurs, 6: Tabellen, Teil 1

HTML-Kurs

Letzte Änderung: 7.7.2011.
Dr. Thomas Hilberer, th@hilberer.de.
http://www.hilberer.de/html/html5.html