Homepage bauen: Gratis-Tutorial HTML

Lektion 2: Textformatierungen

Natürlich möchte man seinen Text schon rein der Übersicht und Lesefreundlichkeit halber mit gewissen Formatierungen versehen. Was viele aber nicht wissen: Textformatierung auf der Homepage ist nicht Selbstzweck, sondern die Robots der Suchmaschinen suchen heutzutage gezielt danach, um die Wichtigkeit des Seiteninhalts bewerten zu können.

Daß für die Textformatierung natürlich Tags verwendet werden, wie wir das schon bisher gesehen haben, ist nicht überraschend. Vielleicht ist schon aufgefallen, daß den Tags im Englischen sinnvolle Begriffe zugrunde liegen. Genauso verhält es sich auch bei den Tags, die wir jetzt gleich kennenlernen werden. Ich stelle mal zusammen:

Tag	englischer Begriff	auf deutsch
<h1>	headline	Überschrift
<p>	paragraph	Absatz
<br>	break	Zeilenumbruch
<b>	bold	Fettdruck
<i>	italic	Kursivdruck

Überschriften-Tags gibt es in verschiedener Hierarchie, die man sinnvoll verwenden sollte. <h1> ist die Überschrift höchster Stufe und sollte nur ein einziges Mal auf jeder Seite vorkommen. <h7> ist die niederste Stufe einer Überschrift. In der Realität wird für Seiten normalen Umfangs aber nur selten niederer als <h4> verwendet.

Die Tags <p> und <br> scheinen auf den ersten Blick dasselbe zu sein. Sie unterscheiden sich aber so wie im Textverarbeitungsprogramm das weiche und das harte Return. Zu einem Absatz können noch weitere Eigenschaften gehören (die Ausrichtung linksbündig, zentriert oder rechtsbündig beispielsweise), während <br> so etwas nicht beeinflussen kann. Obwohl man <p> nicht zwingend verwenden muß, macht seine konsequente Anwendung aber Sinn.

Anwendungsbeispiel Textformatierung in HTML

Alle Tags, die in dem Beispiel zur Textformatierung dienen, habe ich hier durch Fettdruck hervorgehoben. Wenn Sie die Seite ansehen, wird Ihnen auch auffallen, daß Absätze automatisch von einer Leerzeile gefolgt sind.

<html>
<head><title>Das Thema Blindtext</title></head>
<body>
<h1>Ein interessanter Blindtext</h1>
<p>Weit hinten, hinter den Wortbergen, fern der Länder Vokalien (...) </p>
<h2>Das Abenteuer beginnt...</h2>
<p>Es ist ein paradiesmatisches Land, in dem einem <b>gebratene Satzteile</b> (...) </p>
<h3>Ein Titel dritten Grades</h3>
<p>Der große <i>Oxmox</i> riet ihr davon ab, da es dort wimmele (...) </p>
<p>Es packte seine sieben Versalien, schob sich (...) </p>
</body></html>

Die Seite anzeigen: hier klicken

Homepage optimieren

Analyse Ihrer Homepage

Tutorial HTML

Aktualisiert am 01.09.2010