Absatztypen und Textgestaltung

Zuerst das Allerwichtigste - der Text!

Überschriften

Es sind 6 Überschriften mit unterschiedlichen Buchstabengrößen vorgesehen. Sie dienen der Hierarchie der Überschriften und sollen nicht zu der Darstellung von Texten mit unterschiedlicher Größe verwendet werden.

<h1>größte Überschrift</h1>

Überschrift

<h1 align=center>kleinste Überschrift im Zentrum</h1>
Überschrift
h = heading = Überschrift
align = Ausrichtung, center = zentriert


Die Überschriften können links, rechts, in der Mitte oder als Blocksatz ausgerichtet werden. Dazu ist das Attribut "align" (ausrichten) innerhalb des Anfangstags einzusetzen.
Links = normal, kein Befehl notwendig
Mitte = align=center
Rechts = align=right
Blocksatz = align=justify

Anmerkung: Am Anfang hab ich zum Zentrieren immer den Tag <div> verwendet (Absatz 9). Das ist jedoch unnnötig und verschwendet nur Speicherplatz.

Textabsätze

Textabsätze macht man mit <p>Absatztext</p>, wobei der Anfangstag auch alleine gesetzt werden kann. Der Tag <p> beendet die Textformatierung; daher ist normalerweise der Tag <br> vorzuziehen.
p = paragraph

Zeilenumbruch

Zeilenumbrüche werden mit dem Tag <br> gemacht. Mit <nobr>.....</nobr> kann man den Zeilenumbruch unterbinden.
Manchmal ist es notwendig den Zeilenumbruch (z.B. beim Datum) zu verhindern - mit <nbsp> kann eine geschütztes Leerzeichen geschrieben werden. Bei langen Wörtern oder Wörtern mit Bindestrich kann man einen Wortumbruch erlauben - <wbr> (=wordbreak).
br = break = Umbruch
nobr = no break = kein Umbruch
wbr = word break = Umbruch innerhalb eines Wortes

Listen

Listen erstellen ist kein Problem, wobei man drei Arten zur Verfügung hat.

Mit HTML kann man
  • geordnete Listen,
  • ungeordnete Listen,
  • und Definitionslisten
erstellen.
  
   <ul>
   <li>geordnete Listen,</li>
   <li>ungeordnete Listen,</li>
   <li>und Definitionslisten</li>
   </ul>


Die vorhergehende Liste etwa ist eine ungeordnete Liste. Sie wird realisiert durch das öffnende Tag <ul> (engl. für unordered list = ungeordnete Liste oder auch Bullet-Liste) und durch das schließende Tag </ul>. Dazwischen befindet sich für jeden Listenpunkt (engl. list item) ein Tagpaar: <li> und </li>, in welchen sich der Listentext befindet. Ungeordnete Listen werden von den Browsern mit einem Zeilenumbruch und mit einem Listenpunkt dargestellt.

Eine geordnete Liste - hier mit Nummern - schaut dann so aus:
<ol><li>Listeneintrag, bekommt "1." vorangestellt</li></ol>
ol = ordered list = nummerierte Liste
li = list item = Listeneintrag

  1. Listeneintrag, bekommt "1." vorangestellt
  2. Listeneintrag, bekommt "2." vorangestellt
  3. Listeneintrag, bekommt "3." vorangestellt
Alphabetische Listen sind ein bisserl anders:
<ol type=A><li>Listeneintrag, bekommt ein"A." vorangestellt</li></ol>
Weiters gibt es dann Menu- und Verzeichnislisten.

Wichtig sind dann noch sogenannte Glossarlisten( definierter Ausdruck und zurückgesetzte Erklärung):
<dl>
<dt>Ausdruck</dt>
<dd>Definition des Ausdruckes</dd>
</dl>

dl = definition list = Definitionsliste

So sieht das dann aus:
Fiaker
Pferdefuhrwerk in Wien
Anderer Ausdruck
Definition dieses Ausdrucks
Anmerkung: Ein Inhaltsverzeichnis kann man durch Verschachtelung von Listen erzeugen. Dazu erzeugt man z.B. eine nummerierte Hauptliste (Überschriften) und und schreibt zwischen den Punkten eine unnummerierte Liste.

Adressen definieren

Um Emailadressen oder URL-Adressen in einem Absatz hervorzuheben verwendet man den Befehl <adress>alfxxxx@yahoo.de</adress>
Ich bin erreichbar unter:
alfxxxx@yahoo.de
Wenn s was mitzuteilen gibt dann schreibt mir.

Präformatierter Text

Für Programmierung ist es wichtig, dass diese in dicktengleicher Schrift dargestellt werden, und dass Einrückungen so wiedergegeben werden, wie sie beim Editieren eingegeben wurden. Zu diesem Zweck besteht die Möglichkeit der "präformatierten Textabschnitte".
Beispiel:
  FUNCTION xyxyxyxyxyxyx
  VAR
  BEGIN
     a  :=  year MOD 19;
     b  :=  year DIV 100;
  END{FUNC};
oder (im Quelltext anschauen).........
xxxxxxx                  xxx
   x                   x     x
   x                  x       x
   x      xxxxxxxx    x       x
   x                  x       x
   x                   x     x
xxxxxxx                  xxx
Anmerkung: Zwischen <pre> und </pre> gelten die Sonderbestimmungen der Umlaute usw.

Textauszeichnungen (kursiv, fett, färbig)

a. logische Textauszeichnung

Diese Textauszeichnung ist besonders für textorientierte Umgebung (wissenschaftliche Arbeiten) geeignet.

b. physische Textauszeichnung

Da jedoch vorwiegend die grafische Umgebung verwendet wird, ist die physische Textauszeichnung sinnvoller.
Beispiele:
<b>...</b> - bewirkt fett formatierten Text
<i>...</i> - bewirkt kursiv formatierten Text
<big>...</big> - bewirkt größer formatierten Text
<sup>...</sup> - a bewirkt hochgestellten Text

Schriftgröße, Schriftfarbe, Schriftart

Die Normalschriftgröße ist auf +3 eingestellt. Sie kann jedoch mit <basefont size=...>verändert werden. Die Normalschriftart wird mit <basefont face=..>eingestellt.

Die Tags für -

Schriftgröße= <font size= -1 bis +7>Ziemlich riesiger Text</font>
Die Größe ist relativ zur eingestellten Schriftgröße, also bei einer Überschrift wirkt sich das größer aus als bei der Standardschrift.

Schriftfarbe= <font color=#FF0000>Knallroter Text</font>

Schriftart= <font face="Avalon,Wide Latin">Das ist Text in Schriftart Avalon</font>

Anmerkung: Die Zusatzangabe der Schriftart ist mit Angaben zur Schriftgröße und Schriftfarbe im gleichen Einleitungs-Tag möglich. Mit Schriftarten sollte man jedoch weniger experimentieren, da nicht jeder Browser diese bestimmte Schriftart verwenden kann.

Bereiche mit mehreren Elementen definieren

Man kann mit <div> ... </div> mehrere Absätze, bestehend aus ganz verschiedenen Elementen wie Text, Grafiken, Tabellen usw., in einen gemeinsamen Bereich einschließen. Diesen Bereich kann man dann gemeinsam ausrichten.
div = division = Bereich

Aquarell

Segelboote Segelboote © 1997 by Alf

Die Überschrift, der erklärende Text des Bildes und dieser Text wird zentriert


Auch ein kleines Gedicht wird zentriert wiedergegeben

Das Ideal

Ja, das möchste:
Eine Villa im Grünen mit großer Terrasse,
vor der Ostsee, hinten die Friedrichstraße;
mit schöner Aussicht, ländlich - mondän,
vom Badezimmer ist die Zugspitze zu sehen -
aber abends zum Kino hast Dus nicht weit.
Das ganze schlicht, voller Bescheidenheit.

by Christian Morgenstern

Lauftext (Marquee)

Dieser Text wird horizontal wie am Laufband gescrollt - <marquee>...</marquee>
Dieser Text wird von links nach rechts gescrollt - <marquee direction=right>...</marquee>
Dieser Text wird hin- und herbewegt - <marquee behavior=alternate>...</marquee>
Dieser Text wird ziemlich schnell gescrollt - <marquee behavior=alternate scrollamount=50 scrolldelay=5>...</marquee>

Leerzeichen

Ein Leerzeichen zwischen zwei Zeichen stellt der Browser als Leerzeichen dar, mehrere aufeinanderfolgende Leerzeichen im Quellcode werden ebenfalls als nur ein Leerzeichen dargestellt. Um den Browser dazu zu bringen, mehr als ein Leerzeichen darzustellen gibt es die Möglichkeit dieses Leerzeichen zu maskieren. Ein erzwungenes Leerzeichen wird durch den ASCII-Code & nbsp; oder durch & #160; erzeugt.
Der      Zwischenraum wurde durch & nbsp; und der nächste durch         die Zeichenfolge & #160;.

Homepage