Markup Webdesign Journal

Teil 1 dieser Serie hat sich mit den Überschriften beschäftigt.

Textabsätze bzw. das p-Element sind Thema dieses zweiten Teils. Auch sie sollten auf jeden Fall verwendet und richtig eingesetzt werden. Sie sind wie andere Elemente wichtiger Bestandteil der Seitenstruktur und Informationsverarbeitung auf einer Website. Dieses Thema ist nicht so ergiebig wie andere. Es gibt allerdings ein paar Dinge, die man im Hinterkopf haben sollte und die zu beachten sind.

Charakteristik

Absätze fügen automatisch einen Zeilenumbruch ein (sie sind Block-Level Elemente) und Abstände (Whitespace) davor und danach. Genau wie in einem ganz normalen Textdokument. Sie erhöhen die Übersichtlichkeit und teilen den Text in kleinere logische Einheiten ein. Aber nicht nur das. Sie machen Textpassagen auch als solche kenntlich. Für Browser, Suchmaschinen und auch Menschen mit Sehbehinderungen.

Überall dort, wo Text erscheint, sollte dieser auch entsprechend behandelt werden:

<p>Das ist ein Text.</p>

Auch wenn es wie in diesem Fall nur vier Wörter sind, handelt es sich hierbei um einen Textabsatz. Auf keinen Fall sollte dieser “blank” in einem Bereich (div) stehen. Vor allem auch deshalb, weil er sich so unserer Kontrolle (Layout) per CSS entziehen würde, bzw. das ganze zu umständlich werden würde.

Was man nicht darf

Es ist auch darauf zu achten, dass ein p-Element keine anderen Block-Level Elemente (außer weiteren p-Elementen) enthalten darf - im Gegensatz zu anderen Blockelementen. Also nur Inline-Elemente wie das <a>, <i>, <em> usw.

Das p-Tag sollte auch nicht dazu missbraucht werden, um vertikale Abstände in das Dokument einzufügen. So wie beispielsweise bei diesem Listing:

<p></p>

oder hier:

<p> </p>

Das zweite Beispiel füllt den Absatz mit einem Leerzeichen, damit er nicht ganz leer ist. Diese beiden Techniken sollten nicht verwendet werden - nicht zuletzt weil sie auch den Quellcode des Dokuments unnötig aufblähen. Das p-Tag kennzeichnet den Beginn eines Textabsatzes und hilft dabei Texte zu strukturieren. Also sollte darin auch wirklich Text enthalten sein. Abstände lassen sich, wie woanders auch, mit margin und padding realisieren.

Fazit

Das Thema der Textabsätze bietet meiner Meinung nicht so viel Raum für Interpretationen - zumindest nicht vor XHTML 2. So ist darüber auch relativ wenig in den Spezifikationen zu lesen. Das p-Tag hat die Aufgabe Text bzw. Textabsätze als solche kenntlich zu machen und den Text zu strukturieren. Man sollte daher davon absehen, Text - auch wenn er noch so kurz ist - alleinstehend in andere Elemente zu packen.

Der nächste Teil

In Teil 3 der Serie geht es dann um Listen und darum, warum es sinnvoll ist, diese auch für die Navigation und Menüs einzusetzen.