Use email preview text to improve email open rates

The email preview text, or email preheader, is a preview of an email in your inbox. This enables you to quickly scan your inbox and take the next step: open the email.

What you may not know is that you can set this text using an email preheader.

Before you optimize your email's inbox preview, make sure you read these tips to get your email to the inbox.

And if you aren't setting a preheader, you are leaving an important email optimization on the table:

• Preview text is often the first thing subscribers read after the subject line when deciding whether to open an email.
• Roughly 70% of email opens happen on mobile devices, where screen real estate is scarce and the preheader is often visible inline next to the subject.
• Apple Mail is now 45–65% of email opens globally. Its Mail Privacy Protection feature has made traditional open-rate tracking unreliable, which makes subject-plus-preheader the clearest signal of a campaign's real inbox appeal.

And you should use every part of your email to control your brand.

Before we explain how to set the email preview text, let's clarify exactly what it is.

Modern reality: Apple Mail Privacy Protection

Any current article on email open rates has to start here. In September 2021, Apple launched Mail Privacy Protection (MPP) in iOS 15 and macOS Monterey. MPP pre-fetches every image in every email, including the invisible tracking pixel that email service providers use to count opens. The result: every email delivered to an Apple Mail user registers as "opened," whether the recipient ever saw it or not.

MPP is now four years in and enabled by the vast majority of Apple Mail users. With Apple Mail accounting for roughly 45–65% of total email opens (depending on audience), this has fundamentally distorted the open rate as a metric. Campaigns that used to sit at 28% open rates now routinely report 50%+, not because anything changed in the creative but because machines are pre-opening the mail.

So why does preview text still matter if open rates are unreliable? Three reasons:

• Clicks, replies, and conversions are still real. A compelling subject-plus-preheader combo drives actual engagement, which is what you care about. Preview text influences the human decision to open, read, and click – all of which remain trackable.
• Non-Apple opens are still measurable. Gmail, Outlook, Yahoo, and webmail opens are mostly uninflated. Your preview text directly affects the open rate on that meaningful slice of your list.
• Brand presence in the inbox. Every scroll past your subject line is a brand impression. Bad preheaders ("View this email as a webpage") waste that impression. Good preheaders reinforce your message even when the email is never opened.

The short version: open rate as a KPI is increasingly a vanity metric. Preview text optimization has shifted from "lift the open rate" to "win the actual click." The tactics below still apply – just measure success differently.

What is email preview text?

The email preview text, also known as the email preheader, is the text displayed by an email client to preview the contents of an email.

This text displays to the right of the subject in Gmail and below the subject in both Microsoft Outlook and the Apple iOS Mail app.

Below is an example from Gmail highlighting the various parts of an email in the inbox:

How email clients preview your email content

Email clients set the preview text automatically from the first lines of your email – unless you set it yourself. The number of characters shown varies dramatically by client and device (more on that below), but essentially all modern clients will display something next to or below your subject line.

The technical explanation of where the email preview comes from

The preview text is the first non-HTML text found in the beginning of the text/HTML section of an email's multi-part MIME (Multipurpose Internet Mail Extensions) body.

While the email body may contain both plain text and HTML versions of the email content, the preview text comes from the HTML version.

With a little bit of HTML and CSS jiu-jitsu, you can control the preheader code directly.

Set the preview text yourself

Instead of letting the email client choose which text to display, set it proactively. Use the email preheader HTML to highlight your content or call to action.

There are two ways to control it. Let's start with the easiest.

Use visible text to set the email preheader

The first option is the easiest: include a short line of visible content at the top of your email body. This technique is a direct descendant of the Johnson Box – a summary block pioneered by direct-response copywriter Frank Johnson to put the key message of a letter front and center before the reader decided to read further.

Here is an example of several emails with their preview highlighted:

Looking at the first email in the example, the preview text of the email is set by the content at the top of the email:

This type of preheader is common, and you will see it often now that you know what it is. But you can see how the text "View on a web browser" leaked into the email preview text. Not exactly ideal.

A challenge with setting a visible preheader is that the amount of text shown by the email client is variable. The length of preview text shown depends on the screen size, device, and the email client itself.

This is a problem because the design and layout of your email won't allow you to set several sentences of visible text at the top!

While you can't control how much text will be shown in your preview, you can control what text is shown by using a hidden email preheader.

Use hidden text to set the email preheader

Let's look at an example email to help illustrate how a hidden text email preheader works:

As you can see, there is no visible text at the top of the email. Instead, the email is heavy with HTML and images. But clearly, Gmail is able to find the right text to display:

So how does Gmail know which text to show in the email preview? If you dig through the text/HTML section of the original email, you will find this code near the top:

This is known as a hidden email preheader. Hiding text using HTML and CSS requires a few tricks. We recommend the following HTML and inline CSS:

The class name preheader is incidental and not required unless you are also setting global styles that target it. The stack of overlapping hide rules is intentional – different email clients respect different properties, and some ignore others entirely. The mso-hide:all rule specifically covers Microsoft Outlook, which ignores display:none.

If you are sending email using DailyStory, the email preheader is easily set when drafting or editing an email – no manual HTML required.

Now that you know how to control the preview text, let's talk about writing an effective preheader.

Write good copy for your preview

A good preheader makes your email stand out in the inbox, or at the very least clearly communicates the purpose of the email.

The Toyota tire sales event above is a great example. The combined subject plus preheader text reads as a single statement:

Rob, The Tire Savings Event is Here – Buy 3 Tires, Get the 4th for $1 – Visit during the Month of April for this Great Deal

This message is personalized, has a clear value proposition, and has a clear call to action. All before the email is even opened.

The rule of thumb: write the preheader as a continuation of the subject, not a repetition of it. If the subject sets up the hook, the preheader delivers the substance. Short, specific, and concrete always beats long, vague, and promotional.

A good test: read your subject and preheader out loud as a single sentence. Does it sound like something a person would say? Does it make the next step obvious? If yes, you are done.

What happens when you skip the preheader

Here is what you are leaving on the table when you do not set a preheader. Below is a screenshot of an email sent daily by the Wall Street Journal – a perfect example of where a hidden preheader would clean up a messy inbox appearance:

The preview text is clearly being built off of the first text in the email:

Setting a hidden preheader like this would make the email far more compelling at a glance:

By setting the preheader proactively, you get a much more useful view of the email in the inbox.

Character limits per email client

You cannot control how much of your preheader text each client will display, but you can and should know the approximate limits. Aim for your most important words in the first 40–50 characters – anything past that is a bonus for clients that show more.

Practical guidance: write 80–130 characters of preheader copy, put the hook and value proposition in the first 40–50 characters, and treat the rest as optional expansion that some clients will show and some will not. Writing longer than 140 characters is wasted effort – no major client displays more than that.

If you want to avoid body-copy leaking into the preview when your hidden preheader is short, pad the end with non-breaking spaces or zero-width joiners:

The padding pushes body copy out of the preview window. How many padding characters you need depends on the client – Gmail handles non-breaking spaces differently than Apple Mail, for example – so test with your actual audience.

Emojis, special characters, and dark mode gotchas

A few modern tactical notes that did not exist when the original version of this guide was written:

Emojis in preheaders

Emojis in the preheader (and subject line) are now standard practice. They visually break up the inbox, draw the eye, and add tone in a single character. Use them sparingly – one, maybe two – and test across clients, because rendering varies. Outlook desktop in particular can render some emojis as monochrome glyphs or miss them entirely.

Lead with the emoji only if it adds meaning. Leading with "🔥 Flash Sale" reads fine; leading with a random smile face in front of a business email reads as noise.

Dark mode rendering

Most modern email clients offer dark mode, and most automatically invert certain colors to keep content readable. This occasionally creates problems with hidden preheaders: if you use color:#FFFFFF to hide preheader text on a white background, some dark-mode clients invert it to black on black – still hidden – but others show it as white on a dark background, suddenly visible. The CSS recipe above avoids this by hiding via display:none, visibility:hidden, max-height:0, and opacity:0 instead of relying on color, so it stays hidden regardless of background.

Special characters and symbols

Symbols like arrows (→), checkmarks (✓), stars (★), and vertical bars (|) can help chunk long preheaders into scannable pieces: "New arrivals in stock | Free shipping on orders over $50 | Shop now →". Use HTML entities or Unicode characters directly; both work reliably in modern clients.

Frequently Asked Questions

In summary

Preview text is one of the highest-leverage, lowest-effort email optimizations you can make. A tight checklist:

• Always set a hidden preheader. Do not let the email client pick your preview text.
• Write it as a continuation of the subject line, not a repetition. Subject hooks, preheader delivers.
• Put the most important message in the first 40–50 characters. Outlook cuts off there; everything after is bonus.
• Write 80–130 characters total, never more than 140.
• Measure success by clicks and replies, not the MPP-inflated open rate.
• Use emojis sparingly, test dark mode, and don't rely on color alone to hide the preheader.