Einfache HTML-Tags nutzen
Erfahre, welche HTML-Tags du in den DB-Templates von E-Mails und Views nutzen kannst. Du lernst, wie du Absätze, Zeilenumbrüche, Hervorhebungen, Links, Listen und Überschriften einfügst.
Inhalte des Artikels: Springe durch Klick auf das Thema direkt zum jeweiligen Absatz.
- Was ist HTML?
- Absätze mit <p> einfügen
- Zeilenumbrüche <br> mit einfügen
- Hervorhebungen mit <strong> einfügen
- Verlinkungen mit <a href=""> einfügen
- Listen mit <ul> und <li> einfügen
- Überschriften mit <h2> oder <h3> einfügen
- Beispiel für ein DB-Template mit HTML
- Häufige Fehler in HTML
- Weitere HTML-Tags
Was ist HTML?
HTML ist eine Sprache zur Darstellung von Inhalten. In DB-Templates nutzt du HTML, um den Aufbau einer Vorlage zu steuern. HTML-Tags stehen in spitzen Klammern < und >.
Absätze mit <p> einfügen
Nutze <p>, wenn ein Text als eigener Absatz erscheinen soll. Absätze helfen, Vorlagen übersichtlich zu gliedern. Verwende sie für neue Gedanken, Hinweise oder Abschnitte.
Setze <p> vor und </p> nach einem Absatz, um den Absatz abzuschließen.
Zeilenumbrüche mit <br> einfügen
Nutze <br>, wenn du innerhalb eines Absatzes eine neue Zeile beginnen möchtest. Ein Zeilenumbruch eignet sich besonders für Grußformeln, Adressen oder Kontaktdaten.
Verwende <br> sparsam. Für längere Textabschnitte sind Absätze mit <p> meist besser geeignet.
Hervorhebungen mit <strong> einfügen
Nutze <strong>, wenn ein Wort oder Satzteil hervorgehoben werden soll. Es eignet sich für wichtige Begriffe, Veranstaltungstitel, Fristen oder Hinweise. Aber vermeide zu viele Hervorhebungen. Sonst verliert die Vorlage ihre Übersichtlichkeit.
Setze vor den zu hervorhebenden Teil <strong> und danach </strong> zum Beenden der Hervorhebung.
Verlinkungen mit <a href=""> einfügen
Mit einem Link kannst du in einer Vorlage auf eine Webseite, ein Dokument oder eine E-Mail-Adresse verweisen. Dafür nutzt du das <a href=""></a>. Der Link besteht aus zwei Teilen:
- In die Anführungszeichen von
href=""kommt das Ziel des Links (zum Beispiel eine Webseite). - Zwischen dem öffnenden
<a>-Tag und den schließenden</a>-Tag kommt der Text, den die Person später anklicken kann.
Mehr dazu erfährst du im Artikel Links in DB-Templates einfügen.
Listen mit <ul> und <li> einfügen
Nutze Listen, wenn du mehrere Punkte untereinander darstellen möchtest.
Eine Liste beginnt mit <ul> und endet mit </ul>.
Jeder Listenpunkt steht zwischen <li> und </li>. Achte darauf, jedes <li> wieder mit </li> zu schließen.
Das Ergebnis sieht sinngemäß so aus:
- Teilnahmebestätigung
- Ausweisdokument
- unterschriebenes Formular
Listen eignen sich für Unterlagen, Hinweise, nächste Schritte oder Voraussetzungen.
Überschriften mit <h2> oder <h3> einfügen
Verwende Überschriften, wenn eine Vorlage mehrere Bereiche enthält. <h2> eignet sich für größere Abschnitte, <h3> für kleinere Unterabschnitte innerhalb eines <h2>-Abschnitts.
<h2> eignet sich für größere Abschnitte (orange markiert).
<h3> eignet sich für kleinere Unterabschnitte (grün markiert).
Verwende Überschriften nur, wenn die Vorlage dadurch klarer wird.
Verwende Überschriften in der richtigen Reihenfolge und überspringe keine Ebene, also zum Beispiel nicht direkt von <h2> zu <h4>. Das ist wichtig für die Barrierefreiheit, weil Screenreader Überschriften nutzen, um die Struktur vorzulesen und eine einfache Navigation zu ermöglichen.
Beispiel für ein DB-Template mit HTML
Das folgende Beispiel verbindet die zuvor beschriebenen HTML-Anweisungen:
- Orange markiert: Überschriften
- Grün markiert: Hervorhebung
- Lila markiert: Liste
- Blau markiert: Verlinkung
- Rot: Zeilenumbruch
Wenn du mehr zu den Platzhaltern erfahren möchtest, schaue hier vorbei.
Häufige Fehler in HTML
Ein Absatz wird nicht geschlossen:
Ein Link enthält keine Adresse:
Ein Listenpunkt wird nicht geschlossen:
Weitere HTML-Tags
Es gibt noch viele weitere, verschiedene HTML-Tags. Schau für weitere HTML-Tags hier vorbei.