Email Preheader: What It Is + Best Practices

You spent 45 minutes agonizing over the perfect subject line. Tested three versions. Ran it by your team. Finally hit send.

Then you looked at how it actually appears in someone's inbox and saw: "View this email in your browser. Having trouble? Click here to..."

Congratulations. You just torpedoed your own email.

That snippet of text after your subject line? That's your preheader. And if you're not writing it intentionally, your email client is pulling whatever garbage sits at the top of your HTML. Usually an unsubscribe link. Sometimes a broken image alt tag. Always embarrassing.

The average professional gets 121 emails per day according to a recent Radicati Group study. Your preheader is the difference between "this looks interesting" and a split-second decision to archive without opening.

What Email Preheader Text Actually Is

The preheader is preview text that appears next to or below your subject line in the inbox. Different email clients call it different things. Gmail shows it after the subject. Apple Mail puts it on its own line. Outlook does whatever Outlook feels like doing that day.

Think of it as your subject line's wingman. The subject line gets their attention. The preheader closes the deal on whether they'll actually open.

Here's the thing most marketers miss: your preheader has more characters to work with than your subject line. Subject lines cap out around 40-60 characters before getting cut off. Preheaders give you 85-140 characters depending on the device.

That's almost double the real estate. And most people leave it blank.

Why Your Preheaders Are Probably Broken

If you've never set a preheader intentionally, go check what your last campaign displayed.

I'll wait.

Was it "View in browser"? Maybe "Having trouble viewing this email?" Or perhaps just the first line of your email body, which started with "Hey [First Name], hope you're doing well!"

Yeah. That's what I thought.

Here's what happens when you don't set a preheader:

Your carefully crafted email is being represented by housekeeping text that exists for compliance, not conversion.

Most ESPs pull from your email's first visible text if you don't specify preheader content. That means your unsubscribe link footer, your "having trouble?" header, or worse, a string of broken HTML characters.

How to Write Preheaders That Get Opens

Stop thinking of preheaders as an afterthought. Write them before you write the email body.

Here's the framework:

1. Don't repeat your subject line.

If your subject says "Flash sale: 40% off," your preheader shouldn't say "Get 40% off during our flash sale." You've wasted the space. Use the preheader to add information.

Bad: Subject "New arrivals just dropped" + Preheader "Check out our new arrivals"

Good: Subject "New arrivals just dropped" + Preheader "The jacket everyone asked about is back (in 3 new colors)"

2. Create curiosity or add urgency.

Your preheader can tease what's inside without giving everything away. Or it can add a deadline that didn't fit in the subject.

Examples that work:

• "You asked, we listened. Details inside."
• "Only 127 left at this price."
• "Plus: the mistake that cost us $12,000"

3. Include a mini-CTA.

Tell them what to do with the email. This works especially well for transactional and welcome emails.

• "Open to claim your code"
• "Reply by Friday to secure your spot"
• "Scroll to the bottom for the bonus"

4. Keep it under 100 characters for mobile.

Desktop clients show 85-140 characters. Mobile shows 35-50. Write your most important information in the first 40 characters, then add detail after. The important stuff needs to survive the mobile cutoff.

The Technical Side Nobody Talks About

Setting a preheader requires adding hidden text to your email's HTML. Every major ESP handles this differently.

In Klaviyo, it's a dedicated field in the email editor. In Mailchimp, same thing. But if you're coding emails manually or using a custom template, you need to add this at the top of your body:

<div style="display:none;max-height:0;overflow:hidden;">
  Your preheader text goes here
</div>

The hidden div trick works, but some email clients are getting smarter about ignoring it. The more reliable method is to use the mso-hide:all CSS property for Outlook and combine it with standard display:none.

One gotcha: if your preheader is too short, email clients will pull more text from your email body to fill the preview space. The fix? Add whitespace characters after your preheader text:

<div style="display:none;">
  Your preheader text here &zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;
</div>

Those zero-width non-joiners and spaces fill the remaining preview space with invisible characters instead of your body content.

What Preheaders Look Like in Practice

Here are real examples that work, broken down by email type:

Welcome emails:

• Subject: "You're in!"
• Preheader: "Here's your login info + 3 things to do first"

Promotional emails:

• Subject: "24 hours left"
• Preheader: "After midnight, this deal disappears (no extensions)"

Cart abandonment:

• Subject: "Still thinking it over?"
• Preheader: "Your cart's getting lonely. 15% off if you come back."

Newsletter:

• Subject: "This week in email"
• Preheader: "Open rates are lying to you. Here's what to track instead."

Notice how each preheader adds something the subject line doesn't. New information. Urgency. Personality. They work together, not redundantly.

If you want to improve your subject lines too, that's the logical next step after nailing your preheaders.

When to Skip the Preheader

Sometimes leaving it blank is the right call. Not often. But sometimes.

If your subject line is genuinely perfect and says everything needed, adding a preheader might dilute it. Some A/B tests show that ultra-short, punchy subject lines with no preheader outperform longer combinations.

Test it. But my default recommendation: always set an intentional preheader. The downside of leaving it blank (random technical garbage) is worse than the downside of having a mediocre preheader.

FAQ

What is the ideal email preheader length?

Aim for 40-100 characters. Put the essential information in the first 40 characters since that's all mobile shows. Use the remaining 60 for secondary details that appear on desktop.

How is a preheader different from a subject line?

The subject line is what appears in bold in the inbox. The preheader is the preview text that follows it, usually in lighter gray text. Subject lines get attention. Preheaders reinforce the decision to open.

Do preheaders affect email deliverability?

Not directly. But they affect open rates, which affect engagement metrics, which affect deliverability over time. Higher engagement tells ISPs your emails are wanted.

Should the preheader match the email content?

Absolutely. Misleading preheaders might get the open, but they'll tank your trust and increase unsubscribes. The preheader should accurately preview what's inside, just in an interesting way.

Can I use emojis in preheaders?

Yes, but use them sparingly. One emoji at the start can catch attention. Three emojis looks like spam. Test with your audience, because emoji performance varies wildly by industry and demographic.