HTML-Framework von E-Mail-Nachrichten
Es gibt folgende Formate für E-Mail-Nachrichten:
Nur-Text
HTML
Multipart (Nur-Text + HTML)
HTML-E-Mails sind das beliebteste Format zur Erstellung von attraktiven, interessanten E-Mail-Newslettern. HTML-E-Mail-Nachrichten bieten viele Vorteile gegenüber Nur-Text-E-Mails.
Die Funktion Content-Management (E-Mail) unterstützt derzeit nur die Erstellung von HTML-basierten E-Mail-Nachrichten. Multipart-E-Mails und Nur-Text-E-Mails werden noch nicht unterstützt.
Vorteile von HTML-E-Mails
HTML-E-Mails bieten folgende Vorteile:
Bilder und Formate: Bei HTML-E-Mails haben Sie die Möglichkeit, Bilder in Ihre Newsletter einzufügen. Darüber hinaus können Sie verschiedene Formate und Stile auf Ihre Inhalte anwenden. Dadurch werden Ihre E-Mail-Nachrichten für Ihre Kontakte interessanter und attraktiver.
Hyperlinks: In HTML-E-Mails können Sie den Link-Text einer URL ändern. Dadurch ist der Link für die Empfänger nicht sichtbar. Dies ist hilfreich, wenn ein Link einen Empfänger auf eine Engage-Webadresse umleitet. Der Empfänger sieht nicht direkt die Engage-Adresse in der E-Mail-Nachricht.
Performance: HTML-E-Mails ermöglichen Ihnen eine detaillierte Performance-Analyse für alle wichtigen Kennzahlen. Mithilfe eines Tracking-Pixels kann Engage leicht ermitteln, welcher Empfänger eine E-Mail-Nachricht geöffnet hat. Zudem können Sie Links in HTML-E-Mails auswerten.
Aufbau des HTML-Frameworks
Das HTML-Framework besteht aus zwei Teilen:
HTML-Head
HTML-Body
Ein HTML-Framework bildet das Gerüst Ihrer E-Mail-Nachricht.
Im Head legen Sie Stilinformationen und Medienabfragen für responsives Verhalten fest. Im Body definieren Sie das Tabellengerüst (sofern erforderlich) und den Blockbereich. Sie können dadurch entscheiden, wie Ihre E-Mail-Nachricht im Posteingang des E-Mail-Clients aussieht und welche Arten von Inhalten der Nachrichtenautor für die Erstellung seiner Nachricht nutzen kann.
HTML-Head
Der Head eines Frameworks definiert die Einstellungen, die für die gesamte E-Mail-Nachricht gelten. Globale Einstellungen können also geändert werden, ohne mehrere E-Mail-Vorlagen oder E-Mail-Nachrichten bearbeiten zu müssen.
Folgende Informationen sind im Head definiert:
Standardinformationen wie Inhaltstyp, Zeichenkodierung und Formaterkennung.
Anzeigeanpassungen für verschiedene E-Mail-Clients, zum Beispiel Anpassungen in Bezug auf die Darstellung von Links, die im iPhone-E-Mail-Client angezeigt werden.
Responsives Designverhalten für verschiedene Geräte, zum Beispiel die Anzeige auf einem Mobiltelefon oder einem Tablet.
Beispiel
Dieses Beispiel zeigt Ihnen, wie Sie den Head eines HTML-Frameworks für eine E-Mail-Nachricht definieren können.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<meta name="format-detection" content="telephone=no"/>
<title> My Company </title>
<style type="text/css">
/* Re-style iPhone automatic links (eg. phone numbers) */
.applelinks a {color:#222222; text-decoration: none;}
...
@media screen and (max-width:639px) and (max-device-width: 1100px) {
/* max-device-width: 1100px >> for devices with pixel-rario: 3 */
/* Height */
*[class].hauto {height: auto !important;}
*[class].h40px {height: 40px !important;}
...
}
</style>
...
</head>
HTML-Body
Der Body eines Frameworks ist der Teil einer E-Mail-Nachricht, der die für den Empfänger sichtbaren Inhalte enthält.
Das heißt, der Body ist der Bereich, in dem Ihre Inhalte in der endgültigen E-Mail-Nachricht angezeigt werden.
Folgende Informationen sind im Body definiert:
Blockbereiche, in die ein oder mehrere Blöcke eingefügt werden können.
Beispiel
In diesem Beispiel sehen Sie, wie ein Blockbereich mit einem Block im Body eines Frameworks definiert werden kann.
...
</head>
<body>
$tplBlockArea.begin('"name" : "block-area", "block-area-id" : "123"')
$tplBlockArea.end()
</body>