Preheader

Mit dem Begriff Preheader werden die ersten Textzeilen einer Email beschrieben, die in einigen Mail-Clients noch vor dem Betreff und dem eigentlichen Inhalt der Email angezeigt werden. Der Preheader wird in erster Linie auf Smartphones und mobilen Endgeräten verwendet, um dem Empfänger der Email einen ersten Einblick in die Inhalte zu geben und ihm eine alternative Onlineversion anzubieten, falls die Mail auf dem mobilen Endgerät nicht korrekt dargestellt wird. Vor dem Hintergrund einer Mobile First Strategie kommt der Preheader auch zum Einsatz, um das Interesse des Empfängers zu wecken und die Klickraten mit einer Handlungsaufforderung zu erhöhen. Denn gemeinsam mit dem Absender der Mail und der Betreffzeile bildet der Preheader bei mobilen Endgeräten das erste Element, das der Nutzer zu sehen bekommt und mit dem er interagieren kann.

Allgemeine Informationen zum Thema

Die Nutzung von mobilen Endgeräten ist in den letzten Jahren enorm gestiegen. Insbesondere Nutzer zwischen 18 und 30 Jahren verwenden ihr mobiles Endgerät und verschiedene Email-Clients zum Öffnen von Emails. Der Preheader gilt als effektives Mittel, um diesem Nutzungsverhalten aus Sicht des Email-Marketings Rechnung zu tragen. Der erste Satz einer Email bildet zusammen mit dem Betreff die ersten Elemente, die etwas über den Inhalt aussagen und somit sind sie ein wichtiges Entscheidungskriterium für das Öffnen einer Email seitens der Nutzer.

Ursprünglich wurde der Preheader dazu eingesetzt, den Rezipienten einer Email eine alternative Version anzubieten, wenn die korrekte Darstellung nicht gegeben war. Der Grund hierfür war die Tatsache, dass viele Email-Programme keinen HTML-Quellcode interpretieren konnten. So wurde der Nutzer auf eine lesbare Version der Email hingewiesen. Diese konnte er sich mit einem Browser durch einen Klick anschauen. Mittlerweile können viele Email-Programme HTML verarbeiten, aber die Anzeige auf kleinen Displays ist nach wie vor problematisch. Diese Einschränkung der Darstellungsoptionen von Emails auf mobilen Endgeräten wird mit dem Preheader umgangen, indem der zur Verfügung stehende Platz in Email-Clients dazu genutzt wird, den Inhalt der Email anzuteasern.

Funktionsweise

Der Preheader wird bei einigen Email-Clients direkt aus den ersten Textzeilen der Email ausgelesen, wenn er nicht gesondert definiert wird. In diesen Fällen kann es durchaus geschehen, dass der Preheader zwar einen Verweis auf eine Onlineversion der Email beinhaltet, aber den Text und die Betreffzeile nicht sinnvoll ergänzt. Insbesondere für Email Marketing Kampagnen, die auch im Bereich Mobile Leser erreichen wollen, ist der Einsatz eines gesonderten Preheaders deshalb empfehlenswert.

Ein Preheader kann mithilfe von HTML-Auszeichnungen eingebunden werden. Dafür gibt es grundsätzlich drei Möglichkeiten:

• Sichtbarer Preheader: Die einfachste Lösung ist es, eine sehr kurze Zusammenfassung den eigentlichen Inhalten voranzustellen. Fast jeder Email-Client kann diese Textzeilen einlesen und zeigt sie auch korrekt an. Je nach Mail-Client sind allerdings Beschränkungen bei der Anzeige zu beachten. Denn der Preheader darf bei einigen Programmen nur eine gewisse Zeichenanzahl haben. Häufig bemisst sich die Zeichenanzahl an dem verfügbaren Platz im Programm und dem jeweiligen Endgerät, und beträgt zwischen 50 und 140 Zeichen.
• Versteckter Preheader: Preheader können auch mittels HTML-Attributen implementiert und in der herkömmlichen Desktop-Ansicht versteckt werden. Üblich ist Einbindung mit dem
  -Element oder dem -Element. Der Parameter style=“...“ sorgt gemeinsam mit entsprechenden Attributen dafür, dass der Inhalt in der herkömmlichen Ansicht nicht sichtbar ist, sondern nur in der mobilen Ansicht im Mail-Programm dargestellt wird.
• Preheader bei Newsletter-Tools: Wenn eine Software für das automatisierte Verschicken von Emails verwendet wird, kann der Preheader oft per Einstellung integriert werden. Falls diese Option in der Software nicht angeboten wird, kann der Quellcode in der Regel dennoch manuell bearbeitet werden, um einen sichtbaren oder versteckten Preheader einzubinden.

Beispiele

In der Praxis kann die Einbindung eines Preheaders folgendermaßen aussehen. Das Div-Element wird über dem Header der Email notiert und durch die Style-Angaben in der normalen Ansicht versteckt.

• <div style="display: none !important; mso-hide:all; font-size:0; max-height:0; line-height:0; 
  visibility: hidden; opacity: 0; color: transparent; height: 0; width: 0;">Textzusammenfassung und 
  Handlungsaufforderung werden hier notiert. Plus: Ein Verweis auf die Onlineversion./>div

Falls Div-Elemente aus etwaigen Gründen nicht unterstützt werden, kann ein Span-Element verwendet werden. Auch hier wird der Text in der normalen Ansicht nicht angezeigt, sondern nur als Preheader im Email-Programm dargestellt.

• <span style="display: none !important; mso-hide:all; font-size:0; max-height:0; line-height:0; 
  visibility: hidden; opacity: 0; color: transparent; height: 0; width: 0;">Textzusammenfassung und 
  Handlungsaufforderung werden hier notiert. Plus: Ein Verweis auf die Onlineversion.</span>

Empfehlenswert ist das Testen der umgesetzten Lösung. Denn nicht alle Email-Clients können mit Preheadern umgehen. Ähnlich wie im Webdesign muss die korrekte Darstellung mit der Konfiguration des Systems und dem jeweiligen Mailprogramm beim Endanwender getestet werden. Möglich sind auch A/B-Tests, um unterschiedliche Versionen des Preheaders auf ihre Wirksamkeit hin zu überprüfen und die Öffnungsraten anhand der Wortwahl zu optimieren.

Bedeutung für das Online Marketing

Im Rahmen von Newslettern, Mailinglisten und E-Mail Marketing Kampagnen kann der Preheader als aufmerksamkeitsstarkes Element betrachtet werden, das die Öffnungs- und Responseraten deutlich erhöhen kann. Zugleich gilt der Preheader als low hanging fruit, da er mit relativ wenig Aufwand umgesetzt werden kann. Speziell beim Mobile Marketing sollte der Preheader obligatorisch oder zumindest in der einfachen, sichtbaren Form vorhanden sein. Der Preheader kann, wie bei anderen Email Marketing Kampagnen auch, als zentrales Element zur Nutzerinteraktion betrachtet werden. Der erste Blick auf den Absender, die Betreffzeile und den Preheader entscheidet, ob eine Email geöffnet oder ob sie gelöscht wird. Aus diesem Grund sollte der Preheader die Betreffzeile auch ergänzen und nicht das wiederholen, was bereits gesagt wurde.

Erkenntnisse aus anderen Marketingansätzen und -disziplinen, wie zum Beispiel der AIDA-Formel, dem Targeting oder den Handlungsaufforderungen mit einem Call-to-Action-Button, sollten ebenfalls in die Gestaltung des Email Preheaders einfließen. Gleiches gilt für das Leseverhalten der Nutzer, die eine Email öffnen: Sie handeln oft nach dem F-Form Muster und lesen Inhalte, die sich oben und linksseitig befinden als erstes. Zudem können Daten über Kundensegmente oder saisonale Aktionen und Kampagnen die Relevanz für die Empfänger und somit die Öffnungsraten weiter steigern. Personalisierte Emails, die auf Kundenwünsche und Interessen zugeschnitten sind, haben bessere Chancen geöffnet zu werden. Der Preheader kann ebenso wie Newsletter-Kampagnen auf den Lebenszyklus des Kunden zugeschnitten werden: Neue Abonnenten erhalten die Möglichkeit, den Absender dem Adressbuch hinzuzufügen; bestehende Kunden können durch Incentives dazu bewegt werden, an speziellen Angeboten teilzunehmen oder den Newsletter an Freunde und Bekannte weiterzuleiten.

Weblinks

• Definition Preheader
• Kurze Erklärung zum Preheader
• 4 ways to use a preheader in your marketing emails
• Welche Mail-Clients unterstützen den Preheader?