Die korrekte Verwendung der HTML P- und BR-Elemente

Verwenden Sie P- und BR-Tags ordnungsgemäß für sauberes HTML und ohne Überraschungen

Wenn es um das Erlernen von HTML geht, sind zwei Tags, die die meisten Menschen zu Beginn lernen, die Tags für Absätze und Zeilenumbrüche

und
beziehungsweise. Diese Tags setzen natürliche Brüche in Ihren Text, damit der Inhalt Ihrer Webseite leichter lesbar ist. Diese Tags sind zwar recht einfach zu verwenden, können aber auch Verwirrung stiften und missbraucht werden.

Richtige Verwendung des HTML-Absatzelements

Das Absatzelement

wird als Tag-Paar mit der

Tag öffnen das Element und die

Tag schließen. Beim Schreiben von HTML4 oder HTML5 ist das End-Tag technisch nicht erforderlich, es wird jedoch als bewährte Methode zum Schließen dieses Tags angesehen. In XHTML das Schließen

Wird benötigt.

Sie verwenden das Absatzelement auf einer Website genauso wie beim Schreiben von Inhalten für Off-Web-Anforderungen - wenn Sie eine neue Idee oder einen neuen Punkt erstellen möchten. Die meisten Browser zeigen Absätze mit einer Leerzeile dazwischen an. Hier ist ein Beispiel-Absatz in HTML:

Jetzt ist die Zeit für alle guten Männer, ihrem Land zu Hilfe zu kommen. Der schnelle braune Fuchs sprang über den faulen schlafenden Hund.

Zwischen den öffnenden und schließenden Absatz-Tags können viele andere Tags angezeigt werden.

Richtige Verwendung des HTML-Zeilenumbruchelements

Das Zeilenumbruch-Element
tag ist ein Singleton-Tag - es gibt kein End-Tag. In XHTML müssen Sie das Tag mit einem abschließenden Schrägstrich verwenden (
), aber in HTML (einschließlich HTML5) ist dies nicht erforderlich.

Das break-Element ist ein erzwungener Zeilenumbruch innerhalb des Textflusses der Webseite. Sie verwenden es, wenn der Text in der nächsten Zeile fortgesetzt werden soll, der Inhalt jedoch keine eigene Idee oder ein eigener Punkt ist, wodurch er zu einem weiteren Absatz wird. Ein Beispiel hierfür ist die Poesie, bei der Zeilenumbrüche normalerweise korrigiert werden.

Hier ist ein Beispiel für einen Zeilenumbruch in einem Absatz:

Jetzt ist die Zeit für alle guten Männer, ihrem Land zu Hilfe zu kommen.

Der schnelle braune Fuchs sprang über den faulen schlafenden Hund.


Da das Zeilenumbruch-Tag ein Singleton-Tag ist, können darin keine anderen Tags verwendet werden.

Häufige Missbräuche der

und
Stichworte

Menschen, die noch keine Erfahrung mit Codierung haben, machen beim Markieren einer Webseite häufig Fehler mit den Absätzen und Zeilenumbrüchen.

  • Verwenden
    So ändern Sie die Länge einer Textzeile : Wenn Sie das break-Tag verwenden, um zu erzwingen, dass der Text auf bestimmte Weise angezeigt oder unterbrochen wird, wird sichergestellt, dass Ihre Seiten in Ihrem Browser gut aussehen, jedoch nicht unbedingt in einem anderen Browser und mit Sicherheit nicht auf allen Geräten. Handelt es sich bei Ihrer Website um eine responsive Website, ändert sich das Layout basierend auf unterschiedlichen Bildschirmgrößen. Der Browser fügt automatisch einen Zeilenumbruch ein und dann, wenn es um das geht
    Tag, umschließt es den Text erneut, was zu kurzen und langen Zeilen und abgehacktem Text führt. Sie sollten CSS-Stylesheets verwenden, um visuelle Stile zu diktieren, anstatt zu versuchen, das Layout durch Hinzufügen bestimmter HTML-Elemente zu erzwingen.
  • Verwenden
    Hinzufügen von Leerzeichen zwischen Elementen: Auch hier wird auf HTML zurückgegriffen, um ein visuelles Layout zu erstellen, in diesem Fall Abstand, anstatt CSS zu verwenden. Dies ist eine gängige Praxis einiger HTML-Editoren, und obwohl dies technisch nicht falsch ist, führt dies zu unangenehmem HTML und kann zu Verwirrung bei der späteren Bearbeitung führen. Es entspricht auch nicht den Webstandards und der Trennung von Struktur und Stil. In einigen Fällen kann die Verwendung von nicht unterbrechenden Leerzeichen in ansonsten leeren Absatz-Tags zu unerwarteten Abständen in verschiedenen Browsern führen, da alle diese offenbar unterschiedlich interpretieren. Die beste Lösung, um die für Ihr Design erforderlichen Abstandselemente zu erzielen, ist die Verwendung von Stylesheets.

Weitere Informationen zu diesen und anderen Tags finden Sie in dieser HTML-Tag-Liste.