How to Write a Perfect Website Hero Message (And How Not To)
Note: We’ve updated our thinking on the perfect website hero message. Check out the update: We Got It Wrong: How to Write a Perfect Website Hero Message, Revisited
A hero message is the statement that appears at the top of a web page—often the homepage, usually in a large font—that communicates something about the organization.
When crafted well, hero messages can seize your user’s attention and convince them to explore further.
Problem is, most hero messages aren’t well crafted.
This is because, in an attempt to be clever and show-offy, too many marketers ignore clarity and directness. My gut tells me they do this for two reasons: (1) Being clever is easier than being clear, and (2) They mistakenly believe that the best way to “cut through the advertising noise” is via wordplay, punnery, and (worst of all) ambiguity.
Consider this doozy:
The hero message—“Driving innovation to change the world for good”—says absolutely nothing.
Here’s an analogy: Mighty Citizen (my company) is headquartered in Austin, Texas—a city boasting many residents who have tattoos. There are so many tattooed people that, in Austin, not having a tattoo is the new having a tattoo.
The same goes for hero messages: While everyone else is attempting to be all things to all people, choosing instead to write a direct message using plain language is the real novelty.
Know Your Numbers
I’d encourage you to jump into your website’s Google Analytics account and view the percentage of your website visitors who are first-timers. It’s these new people for whom your hero message matters most because we can assume that returning visitors know what you’re about.
If more than half of your website users are coming for the first time, your hero message becomes especially important. It can ensure that they experience zero confusion. Confusion leads to higher bounce rates and lost opportunities. A great hero message is your first line of defense in the confusion war.
A Few Bad Hero Messages
A blog post from Kuno Creative is a great example of what most marketers get wrong about the hero message. Titled “8 Inspiring Website Hero Messages”—and appearing atop a Google search for “hero message”—the article offers eight examples of hero messages. All of them have shortcomings. Some are downright bad. And zero of them are inspiring.
(Let’s get this out of the way real quick: Despite what that blog article’s title suggests, hero messages aren’t meant to be inspiring. That word has been overused to the point of irrelevance—i.e., when was the last time 8-12 words atop a company’s homepage inspired you?)
Sometimes, knowing what not to do is more instructive than knowing what to do. So before we jump into how to craft a working hero message, let’s look at examples of what to avoid.
Here’s one, from Intel:
What’s wrong with this hero message?
- It’s all about Intel—e.g., “what powers us.”
- It’s wildly obscure—i.e., What constitutes an amazing experience?
- It’s passive and awkward—i.e., A better phrasing would’ve been “Amazing Experiences Power Us”
- It doesn’t say what Intel does.
To be fair, most people probably know what Intel does when they land on their homepage. (“They make computer stuff, right?”) So we can give them a bit of a pass.
Alright, for this next one, try to determine what this company does within 8 seconds:
The human attention span is clocked at about 8.5 seconds. If you don’t capture attention within that time, you’re going to lose them.
So what does “Insight2Profit” do? Sure, they “deliver bottom-line growth.” But how? What do they do?
(The answer: They help companies price things. But I only learned that after 30 seconds of scouring the homepage and, eventually, noticing their tagline in the upper left.)
The two big problems with this hero message are:
- It’s a question, not a statement.
- It’s ambiguous—i.e., no “what” or “why” or “how.”
Here’s another say-nothing homepage:
The problems with HDR’s hero message?
- It has zero concrete language, only buzzwords.
- The only way HDR knows how to collaborate is “together”? Imagine that.
- It is totally incongruous with the images that scroll across the screen.
Thoughts on content delivered to your inbox
So what is a Hero Message supposed to do?
A hero message’s primary goal is to inform. A perfect hero message should make clear what your does, for whom you do it, and why you exist.
What. Whom. Why.
Those are in descending order of importance. If your hero message captures all three things (without venturing into wordiness) it’s doing a perfect job.
At a minimum, your hero message should tackle the What and Whom. Bonus points for the Why because it’s often the trickiest feature to work into your hero message. (But makes a great sub-headline or h2.)
(And if you can’t do the What and Whom, at least do the What. If you can’t manage the What either, just put up a big picture of a chubby kitten playing with a baby monkey.)
Elements of an Effective Website Hero Message
The What
The What is a must-have in your hero message. It says what you sell, make, or do.
You need your What because, without it, you risk user confusion—a pitiable syndrome that we in the design profession label as “cognitive strain.”
The gist of cognitive strain vs. cognitive ease is this: The more you make your users think, the worse off you’ll be (especially online, where patience is thin and your competitors are just a click away). Your goal as a marketer is almost always to make things easy. Hero messages without an obvious What are not easy. They are hard.
Even worse: A hero message without a clear What (or no hero message at all) can produce unrealistic expectations. Users might misunderstand what you do, only to discover after 20-30 seconds of irritating browsing that they had you all wrong. They leave, irritated.
Even worse than that: Your organization does exactly what you user wants, but your homepage copy suggests that you don’t, and your prospective customer leaves your website—forever unaware of just how close they were to being satisfied.
Here’s a good example of the What in action:
Note that some of the heavy lifting is done by the sub-header—which, for purposes of our discussion today, is part of the hero message. The key is to make sure both the hero message and it’s accompanying sub-header are in the same place, are both easy to read, and work in harmony.
The Whom
What do people care about most? Themselves.
Humans are hardwired to respond to images or reflections of their own identity. It’s why, when looking at photos with our friends, our eyes immediately go to ourselves before, if ever, anyone else. (This can be a harrowing experience.)
Great hero messages name the specific audiences they’re targeting—often by demographic or professional category (though certainly not always).
Stating your Whom gives your users the chance to instantly imagine themselves in your world. It’s the closest you can get online to saying someone’s specific name. (Imagine the day when websites you’ve never visited greet you with a big message saying, “Hi, Andrew, we’re here to help you!”)
Here’s a good example of the Whom in action:
An Alternative to The Whom
Instead of naming your Whom by job title or whatever, simply use the word “you.” If you take the “you” route, be sure:
- To attach a benefit or two. Say what specific benefits you’ll offer the “you.”
- To include a What and/or Why
Here’s a good example of this approach:
The Why
Here at Mighty Citizen, much of our work centers around branding—which is just a catchall phrase for what people think of you. “Brand” comprises many things, of course, but at its most authentic core is the question of Why.
Why do you exist?
Simon Sinek gave a famous TED Talk that has helped promote this idea. (Watch it here.) His premise is simple enough: An organization should take stock of why it exists in the first place.
- What do we believe about the world that makes this organization exist?
- Why should employees get up in the morning for this organization?
- What’s your point of view? What do you embrace, what do you shun?
I once asked a nonprofit organization what their Why is. They answered, “We want to change our community.” An important goal, but it’s not a Why. (And “to make profit” is never ever your Why.)
Complete this sentence: “We exist because ___________.” That’ll make for a decent Why.
With this in mind, our nonprofit examples might become: “We exist because there is an education crisis in our community and we have the solution.”
When you eventually nail down your Why, it should give you a filter through which to both view and conduct your work. Why is a mindset, a way of perceiving your organization’s place in the world.
Good news: The Why can often be implied in your hero message. Remember, the Why might not fit neatly into your otherwise perfect hero message, so no shame in demoting it one level to your h2 (or sub-headline).
Here’s a good example of that tactic:
(Zengistics has a very Zen homepage. Between the two messages on this page, they manage to nail every component of the Hero Message Trifecta.)
Do you always need a hero message?
Yes.
(Unless you’re a massive global organization with near total brand awareness.)
(Or unless your hero message is built into your company name—e.g., “WeBuyUglyHouses.com”)
(Or unless you have a company tagline that is prominently displayed on your homepage.)
Otherwise, yes.
A Note on Style
I love excellent writing. I’m obsessed with how each word fits together. The only book on my desk is my beloved American Writer’s Thesaurus:
(This is the finest thesaurus I’ve ever come across, and you can get your own right here.)
Please don’t take this article as an indictment of stylish copywriting. If you have a good writer on your staff, they might be able to craft a hero message that hits the Why, the What, and the Whom—and also inject some personality and poetry. Let them have a crack at it. (Or hire someone else to, wink wink.)
But if you have to choose between a stylish hero message and an informative one—and you don’t, usually—lean informative. Reduce confusion. Give the people what they want and need.
Because at the end of the (work)day, we are marketers. Our job is to position our product or service as effectively as possible in the marketplace. That’s what the hero message can do.
So let your hero message be just that: your website’s hero, vanquishing the evil forces of bounce rate and poor user experience. Be gone, villains!!!
If you’d like to know more about writing short, check out this idea-filled book.
