Preheader
The term preheader describes the first text lines of an email, which are displayed in some mail clients before the subject and the actual content of the email. The preheader is primarily used on smartphones and mobile devices to give the recipient of the email a first glance at the email content and to offer them an alternative online version if the email does not display correctly on the mobile device. Against the backdrop of a Mobile First strategy, preheaders are also used to spark the interest of the recipient and increase opening rates with a call for action. Along with the email sender and subject line, the preheader is the first element mobile device users can see and interact with.
General information
The use of mobile devices has increased enormously in recent years. In particular, users between 18 and 30 years use their mobile devices and various email clients to open emails. The preheader is an effective means to utilize this usage behavior from the perspective of email marketing. The first sentence of an email along with the subject form the first elements that say something about the content and thus they are an important decision criterion for the opening of an email.
Preheaders were originally used to offer the recipients of an email an alternative version if the email did not display correctly. The reason for this was the fact that many email programs could not interpret HTML source code. Thus, users were presented with a readable version of the email which they could view in their browser with a click. In the meantime, many email programs can process HTML, but viewing on small display screen formats is still problematic. This limitation of the display options of emails on mobile devices is bypassed with preheaders by using the available space in email clients to tease with the email content.
How it works
Preheaders are read directly from the first text lines of the e-mail client, if it is not defined separately. In these cases, the preheader may contain a reference to an online version of the email, but it does not add to the text and the subject line in any way. A separate preheader is therefore recommended particularly for email marketing campaigns, which also want to reach the field of mobile readers.
A preheader can be embedded using HTML markup. There are basically three ways to do this: :[1]
- Visible Preheader: The simplest solution is to provide a very short summary of the actual content. Almost every email client can read these text lines and display them correctly. However, depending on the mail client, restrictions on display must be observed. The preheader may only have a certain number of characters in some programs. Often the number of characters in the available space in the program and the respective device is between 50 and 140 characters.[2]
- Hidden preheaders: Preheaders can also be implemented using HTML attributes and hidden in the conventional desktop view. The element or the element are commonly integrated. Along with corresponding attributes, the style="..." parameter ensures that the content is not visible in the conventional view, but is only displayed in mobile view of the mail program.
- Preheaders for newsletter tools: If a software is used for the automated sending of emails, preheaders can often be integrated in the settings. If this option is not offered in the software, the source code can be manually edited to include a visible or hidden preheader.
Examples
In practice, the inclusion of a preheader may look as follows. The div element is noted above the header of the email and hidden by the style information in the normal view.
<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;">text summary and Calls for action are noted here. Plus: A reference to the online version./>div
If div elements are not supported for any reason, a span element can be used. Again, the text is not displayed in normal view, but only as a preheader in the email program.
<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;">text summary and Calls for action are noted here. Plus: A reference to the online version.</span>
We recommend testing the implemented solution, because not all email clients can handle preheaders. Similar to Web design, the correct representation must be tested with the configuration of the system and the respective email program on the user device. A/B tests are advisable to check different versions of the preheader for their effectiveness and to optimize the opening rates by changing the selection of words.
Relevance to online marketing
In the context of newsletters, mailing lists, and email marketing campaigns, preheaders can be considered an attention-grabbing element, which can significantly increase the opening and response rates. At the same time, a preheader is a low hanging fruit, since it can be implemented with relatively little effort. Especially for mobile marketing, preheaders should be a must or at least in the simple, visible form. As with other email marketing campaigns, preheaders can also be viewed as a central element for user interaction. The first look at the sender, subject line, and preheader decides whether an email is opened or whether it gets deleted. For this reason, the preheader should supplement the subject line and not repeat what has already been said.[3]
Insights from other marketing approaches and disciplines, such as the AIDA formula, targeting or action requests with a call-to-action button, should also be incorporated into the design of the email preheader. The same applies to the reading behavior of the users who open an email. They often act according to the F-shape pattern and read the content which is above and on the left side first. Furthermore, data on customer segments or seasonal campaigns can further increase relevance for the receivers and thus opening rates. Personalized emails, which are tailored to customer requirements and interests, have better chances to be opened. Similar to newsletter campaigns, preheaders can be tailored to the customer lifecycle. New subscribers are given the option to add the sender to their address book. Existing customers can be encouraged to participate in special offers or to forward the newsletter to friends and acquaintances through incentives.
References
- ↑ A practical guide to preheaders campaignmonitor.com. Accessed on 04/13/2016
- ↑ Tips for Coding Email Preheaders emailonacid.com. Accessed on 04/13/2016
- ↑ How to write better preheader text in your next email marketing campaign campaignmonitor.com. Accessed on 04/13/2016
Web Links