HTML5: Absätze

Zurück zu Überschriften | Hoch zum Inhaltsverzeichnis | Vor zu Zitate

Laufender Text wird hauptsächlich innerhalb von Absätzen notiert werden. Dafür gibt es ein spezielles Element p. Daneben gibt es weitere Elemente, mit welchen laufender Text strukturiert werden kann.

Das Darstellungsprogramm ignoriert Zeilenumbrüche im laufenden Text. Genauer gesagt werden Zeilenumbrüche und ähnliche Zeichen zu Leerzeichen konvertiert. Danach werden mehrere aufeinanderfolgende Leerzeichen zu einem einzigen zusammengeschnurrt (sofern keine spezielles XML-Attribut, welches in XHTML allerdings nicht üblich ist, etwas anderes fordert). Zur Erzeugung eines Absatzes oder einer neuen Zeile wird ein dafür geeignetes Element notiert. Entsprechend gibt es in HTML ein spezielles Element für Bereiche, in welchen Zeilenumbrüche und Leerzeichen in der Präsentation aus dem Quelltext übernommen werden sollen.

Absätze, Element p

Grundsätzlich wird sämtlicher Text in Absätzen oder in anderen Textbereichen notiert. Für einen Absatz wird das Element p (englisch: paragraph; deutsch: Absatz) verwendet. In solch einem Absatz kann dann Phraseninhalt wie Text stehen. Wo fließender Inhalt erlaubt ist, können Absätze notiert werden. p selbst ist das Blockelement schlechthin. Bei einer guten Dokumentstruktur werden daher die Geschwisterelemente eines p ebenfalls Blockelemente sein.

Zwischen verschiedenen Absätzen erzeugen Darstellungsprogramme mit graphischer Ausgabe automatisch einen kleinen Abstand. Daher stammt auch die deutsche Bezeichnung der Struktur, sie wird vom Inhalt davor und danach abgesetzt.

Eine andere Variante der Präsentation besonders bei reinen Textausgaben ist die Einrückung der ersten Zeile eines Absatzes um typisch ein bis drei Glyphenbreiten. Diese Variante hat ihren Ursprung vermutlich in Sparmaßnahmen beim Satz von gedruckten Büchern, durch eine Einrückung wird bei einem umfangreichen Buch etwas weniger Papier benötigt als bei einer Absetzung. Nun heißen die Strukturen Absätze und nicht Einrücke, die Einsparung von Papier liegt bei einem digitalen Text auch nicht vor, von daher sind Einrückungen als reine Dekoration anzusehen.

Weitere Möglichkeiten, die allerdings eher einer speziellen Dekoration mit einer Stilvorlage bedürfen, sind Initiale und Rubrizierungen, also eine besondere Dekoration des ersten Zeichens eines Absatzes, besonders groß, meist in den Block des Absatzes nach unten eingebunden, damit oben nichts übersteht, gerne auch anders gefärbt.

Eine weitere Möglichkeit sind besondere Symbole, es gibt spezielle Zeichen für Absätze, das Alinea: ¶ (gespiegelt: ⁋). Diese werden an den Anfang, beziehungsweise das Ende eines Absatzes zur Kennzeichnung gesetzt.

Darstellungsprogramme mit akustischer Ausgabe (englisch: screen-reader) machen eine kleine Pause beim Vorlesen.

Das Element p umschließt einen einzelnen, abgeschlossenen Gedankengang innerhalb eines längeren Textes. Ein Text besteht zumeist aus mehr als einem Gedankgang. Ein Absatz ist inhaltlich einfacher Prosatext ohne weitere inhaltliche Struktur, die über die von Sätzen hinausgeht. Dies spiegelt sich auch darin wider, daß nur Text und Phrasenelemente als Inhalt erlaubt sind.

Gedankengänge sind typisch nicht leer, von daher gibt es in normalen Texten keine leeren Absätze.

Beispiel:

<p>
Wenn sich Garn zu einem wilden Knäuel verheddert, wird es schnell unübersichtlich.
Sucht man darin die Enden der Fäden, kann folgendes Theorem hilfreich sein:
Die Anzahl aller Garnenden im Knäuel ist gerade.
</p>
<p>
Bisweilen wird auch davon gesprochen, daß Seemannsgarn gesponnen wird, 
wenn eine erfundene, tolldreiste Geschichte erzählt wird.
Auch Analogien wie Erzählfaden oder Roter Faden greifen dieses Thema wieder auf, 
einschließlich der Implikationen des Verhedderns zu einem wilden Knäuel.
</p>
<p>
Ob das Theorem der Geradzahligkeit der Endenanzahl der Fäden auch 
bei Seemannsgarn, Erzählfäden und roten Fäden gilt, 
ist Gegenstand aktueller Untersuchungen der statistischen Literaturtheorie
und der quantitativen Textanalyse.
</p>

Zeilenumbrüche, Element br

Es gibt auch ein spezielles Element br für einen Zeilenumbruch, welches selbst nie Inhalt hat. Dies ist ein Beispiel für ein sogenanntes leeres Element. Es gehört zu den Phrasenelementen und kann dort notiert werden, wo Phraseninhalt erlaubt ist, zum Beispiel auch innerhalb von Absätzen. Mehrere Elemente br direkt hintereinander sind allerdings zumeist nicht sinnvoll und weisen auf eine schlechte Dokumentstruktur hin.

Inhaltlich tritt ein Zeilenumbruch eher selten auf. Dies kann etwa bei der Notation von Adressen der Fall sein. Innerhalb eines Absatzes könnte ein br noch eine minimale Gedankenpause kennzeichnen, um einen bestimmten Punkt in einem Gedankengang zu pointieren. Da das Element selbst keinen Inhalt hat, kann es auch kaum dazu dienen, inhaltliche Strukturen auszuzeichnen, welche über eine solch minimale Gedankenpause hinausgehen. Daher gibt es eher wenige inhaltlich korrekte Verwendungsmöglichkeiten für br.

In der Belletristik gibt es allerdings gelegentlich Bedarf, einen Absatz schwach zu strukturieren, etwa um kleinere Gedankenpausen von Protagonisten oder den Wechsel des Sprechers in Dialogen zu kennzeichnen. Das kann als Verfeinerung der klassischen Absatzstruktur interpretiert werden. Ähnlich wie die Strophe eines Gedichtes etwa aus mehreren Zeilen besteht, kann ein Absatz so also auch noch eine allerdings deutlich schwächere Substruktur haben.

Wer dies Element in anderem Zusammenhang öfter verwendet, verwendet vermutlich das falsche Element oder ist sich nicht klar darüber, was inhaltlich zum Ausdruck gebracht werden soll. In der Regel sollte ein Autor dem Darstellungsprogramm überlassen, die Zeilenumbrüche selbst festzulegen, da dem Autor nicht bekannt ist, wie breit eine Zeile ist. Ein Dokument kann in einem Fenster mit einer Größe von 1024×768px angezeigt werden oder auch nur in einem sehr kleinen Ausschnitt des Bildschirms oder in einem mobilen Endgerät mit kleinem Bildschirm. Oder es wird vorgelesen – und wer möchte schon gerne eine Schar aufeinanderfolgender Zeilenumbrüche vorgelesen bekommen …

Letztlich wissen Autoren nicht, wo in der jeweiligen Präsentation die Zeile aufhört. Wer zwanghaft ein bestimmtes Layout zu erzeugen versucht, muß damit rechnen, daß ein Besucher des Projektes mit einem anderen Darstellungsprogramm oder anderer Bildschirmauflösung und -größe sowie Schriftgröße die Seite nicht mehr so sieht, wie dies eigentlich beabsichtigt war.

Beispiel:

<p>
Adresse des Vertreters unserer Produkte auf der Erde im Sonnensystem:<br />
Dr. mult. Hotte Hööse<br />
Im günen Hain am dunklen Bache 13c<br />
30001 Hangover<br />
Deutschland<br />
Europa<br />
Erde<br />
Sonnensystem<br />
Nebenspiralarm 1a<br />
Milchstraße
</p>

Blockseparator, hr

Es kann vorkommen, daß zwischen zwei Absätzen, allgemeiner Blockelementen ein Separator eingefügt werden soll, der inhaltlich relevant ist. Dies kann zum Beispiel passieren, wenn ohne Überschriften (die in einem anderen Kapitel dieses Buches erklärt werden) mehrere Themen auf einer Seite behandelt werden, wobei jedes aber mehr als einen Absatz haben kann. Um nun die verschiedenen Bereiche voneinander zu trennen, kann das Element hr verwendet werden. Dies ist ein leeres Blockelement und kann dort notiert werden, wo fließender Inhalt erwartet wird. Hinsichtlich einer sinnvollen Struktur ist zu erwarten, daß es dort notiert wird, wo alle Geschwisterelemente ebenfalls Blockelemente sind.

Weil HTML5 anders als frühere Versionen von (X)HTML allerdings spezielle Elemente zur Gruppierung und Strukturierung von Inhalt hat, insbesondere das Element section, ist es zumeist sinnvoller, dieses Element zu nutzen, um Inhalt zu strukturieren.

Die meisten aktuellen Darstellungsprogramme erkennen zwar section und andere in HTML5 neue Gruppierungselemente als Blockelement, haben allerdings sonst keine weitere Hervorhebung dafür, um die Struktur ohne den Einsatz eigener Stilvorlagen der Autoren kenntlich zu machen. Ältere Darstellungsprogramme kennen neue Elemente wie section gar nicht und behandeln sie gar wie Phrasenelemente.

Daher kann es sinnvoll sein, zusätzlich zur Strukturierung das Element hr zu verwenden, etwa zwischen zwei aufeinanderfolgenden Elementen section. In einer Stilvorlage könnte dann die Struktur von section als Blockelement speziell hervorgehoben werden, das hr hingegen ausgeblendet werden. So ist gewährleistet, daß bei Interpretation einer Stilvorlage eine elegante Hervorhebung der Struktur sichtbar wird, bei einfachen oder alten Programmen ohne diese Fähigkeiten jedoch immerhin die Struktur aufgrund der vorhandenen Elemente hr erkennbar bleibt, weil dies Element in allen Versionen von (X)HTML bekannt ist.

Beispiel:

<h1>Kleinanzeigen - Vermischtes, Stadtteil Zoo</h1>

<aside>
<p>(Zur Kontaktaufnahme wird die angegebene email-Adresse
wie in den <abbr>AGB</abbr> beschrieben vervollständigt.)
</p>
</aside>
<hr/>

<section>
<p>
Unser Rauhaardackel Waldi, 
trägt ein Halsband mit Namen und ist sehr zutraulich,
ist letztes Wochenende spurlos verschwunden.
</p>
<p>
Wer ihn gefunden oder gesehen hat, melde sich bitte,
seine Lieben machen sich sehr große Sorgen.<br />
Kontakt waldi@
</p>
</section>
<hr/>

<section>
<p>
Kostenlos weiße Mäuse, Ratten und Hamster in gute Hände abzugeben.
</p>
<p>
Die Tiere sind auch als Futtertiere für entsprechende
Reptilien geeignet.<br />
Kontakt tierpfleger@
</p>
</section>
<hr/>

<section>
<p>
Unsere Katze Maunzi ist am Sonntag entlaufen.
Trotz intensiver Suche hat sich bislang keine Spur gefunden. 
Maunzi ist ein kastrierter, gut genährter Kater, 
weitgehend schwarzes Fell, 
weißer Fleck um rechtes Auge und linke Vorderpfote.
</p>
<p>
Seit Maunzi verschwunden ist, weint unsere kleine
Tochter Sybille-Antoinette nur noch. 
Wir sind verzweifelt. 
Wir sind dankbar für jeden Hinweis.
Im Erfolgsfalle bieten wir auch eine angemessene
Belohnung.<br />
Kontakt maunzi@
</p>
</section>
<hr/>

<section>
<p>
Männlicher, erfahrener Tierpfleger sucht neue Anstellung.
Gerne wieder mit Tieren. 
Auch eine Stellung im <abbr>SM</abbr>-Bereich,
gegebenenfalls auch mit Tieren wäre spannend, 
ebenfalls Erfahrung
vorhanden.<br />
Kontakt tierpfleger@
</p>
</section>
<hr/>

<section>
<p>
Freitag abends noch vor der Fütterung ist aufgrund
einer Unachtsamkeit eines Pflegers eine ausgewachsene
Große Anakonda (Eunectes murinus) entwischt.
Trotz intensiver Suche ist das Tier bislang 
spurlos verschwunden.
</p>
<p>
Sollten Sie das Tier entdecken, bitte festsetzen,
nicht streicheln oder füttern und sofort Kontakt aufnehmen:<br />
zoo-management@
</p>
</section>

Kontaktadresse, Element address

Mittels address kann ein Autor seine eigenen Kontaktdaten angeben. In Deutschland etwa wie in zahlreichen anderen Ländern gibt es gesetzliche Verpflichtungen zur Anbieterkennzeichnung. Innerhalb des Blockelementes address sind also nicht beliebige Adressen zu notieren, sondern nur jene der Ansprechperson für die komplette Seite oder auch für ein größeres Projekt. Der Inhalt ist fließender Inhalt, das Element kann von daher auch als Gruppierungselement aufgefaßt werden.

In früheren, strikten Varianten durfte es allerdings lediglich Phraseninhalt haben. Bei der Adressangabe bietet es sich dann natürlich an, das Element br für die Zeilenumbrüche zu verwenden.

Entscheidet sich der Autor für Blockelemente als Inhalt, kann eine reichhaltigere Struktur vorgesehen werden.

Das Element eignet sich auch, um etwa innerhalb von article notiert die Kontaktdaten für den Artikel anzugeben, die Information bezieht sich dann lediglich auf den umschließenden Artikel, nicht auf das gesamte Dokument.

Beispiel einfach:

<h1>Verantwortlicher für diese internet-Seite:</h1>
<address>
Dr. mult. Hotte Hööse<br />
Im günen Hain am dunklen Bache 13c<br />
30001 Hangover<br />
Deutschland<br />
Europa<br />
Erde<br />
Sonnensystem<br />
Nebenspiralarm 1a<br />
Milchstraße<br />
Email: hotte@example.org<br />
Phon: 49 (0)511 ....<br />
Fax: 49 (0)511 ...
</address>

Beispiel als Gruppierungselement:

<address>
<h1>Verantwortlicher für diese internet-Seite:</h1>
<p>
Dr. mult. Hotte Hööse<br />
Im günen Hain am dunklen Bache 13c<br />
30001 Hangover<br />
Deutschland
</p>
<p>
Europa<br />
Erde<br />
Sonnensystem<br />
Nebenspiralarm 1a<br />
Milchstraße
</p>
<p>
Email: hotte@example.org<br />
Phon: 49 (0)511 ...<br />
Fax: 49 (0)511 ...
</p>
</address>

Maschinenlesbar sind die Adressen so noch nicht unbedingt, wenngleich Roboter, welche nach email-Adressen suchen, diese zumeist bereits am Zeichen @ innerhalb einer nicht sehr speziellen Zeichenfolge erraten. Um die Adressen einheitlich zu kennzeichnen, kann mittels RDFa die nähere Bedeutung der Angaben durch Referenz der Strukturen eines speziellen Namensraumes dafür vorgenommen werden.

Formatierter Text, Element pre

Mit Hilfe des Blockelementes pre (englisch: preformatted; deutsch: vorformatiert) ist es möglich, den Inhalt im Darstellungsprogramm so anzeigen zu lassen, wie man es im Editor eingetippt hat. Das ist insbesondere relevant, wenn bei speziellen Gedichtformen oder Quelltexten von Programmiersprachen oder Auszeichnungssprachen etc Leerzeichen, Zeilenumbrüche etc relevant für das Verständnis sind. Für normalen Fließtext ist dies Element weder gedacht noch geeignet.

Der Inhalt ist Phraseninhalt. Das Element kann notiert werden, wo fließender Inhalt erwartet wird. Weil es ein Blockelement ist, wird es für eine gute Struktur nur dort notiert werden, wo auch die Geschwisterelemente Blockelemente sind.

Beispiel Quelltext notieren:

<p>Die Einrückung von Quelltext verbessert die Lesbarkeit. 
   Man vergleiche folgende Fortran-Programmfragmente:</p>

<pre>
      	open (2,file='106v240.out')
        i=0
700     continue
          i=i+1
          read(2,*,END=710) d1(i),d2(i),d3(i)
        go to 700
710     continue
        close(2)

        modus='new'
        do i=1,ia
          open (1, Status=modus, file=da(i))
            is=(i-1)*88
            do j=1,88
              k=j+is
              write(1,*) d1(k),d2(k),d3(k)
            enddo
          close(1)
        enddo
</pre>

<div>mit</div>

<pre>
      	open (2,file='106v240.out')
        i=0
700     continue
        i=i+1
        read(2,*,END=710) d1(i),d2(i),d3(i)
        go to 700
710     continue
        close(2)
        modus='new'
        do i=1,ia
        open (1, Status=modus, file=da(i))
        is=(i-1)*88
        do j=1,88
        k=j+is
        write(1,*) d1(k),d2(k),d3(k)
        enddo
        close(1)
        enddo
</pre>

Wie man hier bereits erkennen kann, ist das zwischen den beiden Beispielen stehende 'mit' bereits ein strukturelles Problem für (X)HTML. Es ist kein eigener Gedankengang, gehört aber zum allgemeinen Textablauf. Da pre wiederum ein Blockelement ist, kann es nicht in einem Gedankengang stehen, welcher mittels p markiert ist. Das 'mit' gehört auch nicht zu den Programmquelltexten, daher ist pre auch nicht angemessen. Was bleibt, ist die Improvisation mit div. Wenn man die Struktur des Dokumentes verbessern möchte, würde man vermutlich etwas umformulieren:

<p>Die Einrückung von Quelltext verbessert die Lesbarkeit. 
   Man vergleiche die Fortran-Programmfragmente 
   <a href="#F1">F1</a> und <a href="#F2">F2</a>.
</p>
<p>
...
</p>

<section id="F1">
<h2>Fortran-Programmfragment F1</h2>
<pre>
<code>
      	open (2,file='106v240.out')
        i=0
700     continue
          i=i+1
          read(2,*,END=710) d1(i),d2(i),d3(i)
        go to 700
710     continue
        close(2)

        modus='new'
        do i=1,ia
          open (1, Status=modus, file=da(i))
            is=(i-1)*88
            do j=1,88
              k=j+is
              write(1,*) d1(k),d2(k),d3(k)
            enddo
          close(1)
        enddo
</code>
</pre>
</section>
<section id="F2">
<h2>Fortran-Programmfragment F2</h2>
<pre>
<code>
      	open (2,file='106v240.out')
        i=0
700     continue
        i=i+1
        read(2,*,END=710) d1(i),d2(i),d3(i)
        go to 700
710     continue
        close(2)
        modus='new'
        do i=1,ia
        open (1, Status=modus, file=da(i))
        is=(i-1)*88
        do j=1,88
        k=j+is
        write(1,*) d1(k),d2(k),d3(k)
        enddo
        close(1)
        enddo
</code>
</pre>
</section>

Mit der Methode können die Programmfragmente auch getrennt vom laufenden Text oder in einem Anhang oder in figure notiert werden und stören so nicht notwendig den normalen Textfluß. Durch Verwendung eines Fragmentidentifizierers können die Quelltexte auch referenziert werden, durch Verwendung des Phrasenelementes code kann zudem eine allgemeine Strukturinformation gegeben werden, welche dann auch helfen kann, solche Inhalte in einem weiteren Schritt per CSS hervorzuheben oder aus dem normalen Textfluß herauszunehmen.

Zumindest beim klassischen Fortran, welches bei Bedarf noch auf Lochkarten notiert werden kann, ist auch die Anzahl der Leerzeichen vorne signifikant, weswegen die nicht einfach vor der Darstellung zusammengeschnurrt werden dürfen. Auch die maximale Zahl der Zeichen pro Zeile ist wegen der Lochkarten-Historie beschränkt, von daher sind auch die Zeilenumbrüche signifikant.

Ein anderes Beispiel für die Signifikanz von Leerzeichen ist Python, wo die Blockbegrenzung gezielt von der Einrückung abhängig gemacht wurde, um die Lesbarkeit des Quelltextes zu gewährleisten.

Strukturen in Gedichten

Poesie stellt besondere Anforderungen an die Textauszeichnung, die mit den in diesen Kapiteln genannten Elementen nicht erfüllt werden können. Allenfalls bei eher experimentellen Gedichten mit deutlicher graphischer Präferenz kommt das Element pre in Frage. Mittels der Erweiterung RDFa sollte angegeben werden, daß es sich bei dem Inhalt um Posie handelt.

Ansonsten sind Strophen von Gedichten keine Absätze und Strophenzeilen besondere Strukturen, für welche lediglich ein Zeilenumbruch am Ende nicht ausreicht. Für Gedichte ist die Kombination von p und br also ungeeignet. Zwar eignet sich section bereits für Strophen, darin allerdings br gleichfalls nicht für Strophenzeilen. Weil Strophenzeilen wiederum keine Absätze sind, eignet sich p für diese ebenfalls nicht. Kurzum, Gedichte bedrüfen einer besonderen Struktur, für welche es in (X)HTML keine besonderen Elemente gibt, eine Kombination von section für Strophen und div für Strophenzeilen ist plausibel. In der üblichen Präsentation wird section allerdings ähnlich wie div nicht abgesetzt vom umgebenden Inhalt präsentiert, die Einteilung per section allein führt also nicht zu einer sichtbaren Hervorhebung der Struktur. Empfehlenswert ist also die Verwendung des Attributes class für section, um eine Hervorhebung mit einer eigenen Stilvorlage vorzunehmen.

Ein alternativer Ansatz besteht darin, Strophen als Listen von Zeilen aufzufassen. Bei den Zeilen ist die Reihenfolge sicherlich signifikant, von daher kann auch das Element ol für eine Strophe verwendet werden, li für eine Strophenzeile darin.
Listen werden in einem eigenen Kapitel dieses Buches erläutert.

Weil bei ol in der üblichen Präsentation die Listenpunkte durchnumeriert werden, ist es bei diesen Ansatz erforderlich, die Präsentation mit einer Stilvorlage geeignet anzupassen. Empfehlenswert ist also die Verwendung des Attributes class für ol, eventuell auch für li, um eine Hervorhebung mit einer eigenen Stilvorlage vorzunehmen. Daher ist dieser Ansatz eigentlich auch keine optimale Lösung.

Das gesamte Gedicht könnte wiederum mit einem Gruppierungselement umgeben werden, bei welchem ebenfalls per Attribut class die Hervorhebung per Stilvorlage als Gedichtstruktur vorbereitet wird.

Die spezielle Bedeutung als Poesie, Strophen, Strophenzeilen sollte mit der Erweiterung RDFa angegeben werden. Die dafür notierten Attribute eignen sich ebenfalls, um die Strukturen gezielt per Stilvorlage hervorzuheben.

Zurück zu Überschriften | Hoch zum Inhaltsverzeichnis | Vor zu Zitate