Absätze und Text: p, br, strong und em
Der allergrößte Teil des Webs ist Text. Entsprechend wichtig sind die Elemente, mit denen man Text strukturiert und betont. Die gute Nachricht: es sind nur eine Handvoll.
Der Absatz: p
HTML-Code
<p>Ein Absatz ist ein zusammenhängender Gedanke.</p>
<p>Der nächste Gedanke bekommt den nächsten Absatz.</p>Das <p>-Element ist das Brot-und-Butter-Element für Fließtext. Der Browser setzt zwischen Absätzen automatisch Abstand. Und hier direkt die wichtigste Regel: dieser Abstand wird mit CSS geregelt, nicht mit Umbrüchen. Womit wir beim nächsten Element wären.
Der Zeilenumbruch: br
<p>Mozartstraße 53<br>
53340 Meckenheim</p><br> erzwingt einen Umbruch innerhalb eines Absatzes und ist für Fälle gedacht in denen der Umbruch zum Inhalt gehört: Adressen, Gedichte, Liedzeilen. Der Klassiker unter den Anfängerfehlern ist, mit mehreren <br><br> Abstand zwischen Absätzen zu schummeln. Funktioniert irgendwie, ist aber der falsche Weg: dafür gibt es Absätze und CSS-Abstände.
Betonung: strong und em
<p>Bitte <strong>vor</strong> dem Backen den Ofen
<em>wirklich</em> vorheizen.</p>Bitte vor dem Backen den Ofen wirklich vorheizen.
<strong> markiert starke Wichtigkeit und wird fett dargestellt, <em> markiert Betonung und wird kursiv. Es gibt auch <b> und <i>, die sehen gleich aus, transportieren aber keine Bedeutung, sie sind rein optisch. Faustregel: Wenn du beim Vorlesen die Stimme heben würdest, nimm strong oder em.
Noch zwei Nützliche
<hr>zieht eine horizontale Trennlinie, gedacht als thematischer Einschnitt. Auf dieser Website siehst du sie ständig, die Linie gehörte 1998 einfach dazu.<mark>hebt Text hervor wie mit einem Textmarker: so nämlich. Praktisch für Suchtreffer oder wichtige Stelln.
Die kleinen Text-Spezialisten
Neben em und strong gibt es eine Reihe seltener gebrauchter, aber nützlicher Textelemente die jeder mal gesehen haben sollte:
<p>Der Termin ist am <time datetime="2026-09-12">12. September</time>.</p>
<p>Preis: <del>49 Euro</del> <ins>39 Euro</ins></p>
<p>Drücke <kbd>Strg</kbd> + <kbd>S</kbd> zum Speichern.</p>
<p>Das <abbr title="World Wide Web Consortium">W3C</abbr> pflegt Standards.</p>time macht Datumsangaben maschinenlesbar, del und ins zeigen Streichungen und Ergänzungen (Preisänderungen!), kbd steht für Tasteneingaben und abbr erklärt Abkürzungen beim Daraufzeigen. Nichts davon ist Pflicht, aber alles davon macht Texte präziser, und Browser bringen für jedes eine sinnvolle Grunddarstellung mitt.
Leere Absätze als Abstandhalter
Der Klassiker aus alten Baukasten-Zeiten: mehrere leere p- oder br-Elemente übereinander, um Luft zu schaffen. Das gehört in dieselbe Mottenkiste wie die Spacer-GIFs, Abstand ist Gestaltungssache und damit ein Fall für margin. Die Faustregel: Wenn ein Element keinen Inhalt hat, hat es im HTML nichts verlorenn.
Weiter im Lernpfad: Kommentare · Verwandt: Überschriften · Sonderzeichen