Learning how to write a hero section for your website is one of the highest-value things you can do for your business, because the hero is the first thing almost every visitor sees. It is the block at the top of the page, usually a big headline, a line or two of supporting text, and a button. Get it right and people understand what you do in a few seconds. Get it wrong and they leave before scrolling.
The good news is that a strong hero section follows a pattern. You do not need to be a professional copywriter to get most of the way there. In this guide we will walk through the parts of a hero, share a few reliable copy formulas, and show before-and-after examples you can borrow for your own site.
What a hero section actually needs to do
A hero section has one job: help a visitor quickly answer three questions.
- What is this? What do you sell or do?
- Is it for me? Who is it meant to help, and with what problem?
- What do I do next? The obvious first step, like booking a call or getting a quote.
If your hero answers those three things clearly, it is doing its job. Clever wording is a bonus, not the point. Clarity always beats cleverness here, and that is the single most common mistake we see on small business sites.
The five parts of a strong hero section
Most effective heroes are built from the same handful of pieces. You do not always need every one, but this is the full toolkit.
| Part | What it does | Example |
|---|---|---|
| Headline | States the main promise or outcome | "Reliable heating and cooling, done right the first time" |
| Subheadline | Adds detail, who it is for, or how it works | "Licensed HVAC repair and installation for homes across Austin." |
| Primary button (CTA) | The main action you want people to take | "Book a free estimate" |
| Secondary link | A softer option for people not ready yet | "See our services" |
| Trust signal | Quick proof you are credible | "Rated 4.9 stars by 200+ local homeowners" |
Notice how plain the language is. No jargon, no vague slogans, no "we deliver world-class solutions." A stranger should understand it instantly. If you want to go deeper on writing the line that carries the most weight, our guide on website headlines that work covers this in detail.
Copy formulas that make writing the headline easier
Staring at a blank page is hard. Formulas give you a starting point. Here are four that work well for small businesses. Draft a version with each, then pick the one that sounds most like you.
1. Outcome + audience
State the result you deliver and who it is for.
"Clean, healthy lawns for busy homeowners in Denver."
2. Do X without Y
Name the goal and the pain you remove.
"Get a professional website without touching a line of code."
3. The plain-spoken promise
Just say what you do and why people trust it.
"Honest, on-time plumbing repair for your home."
4. Problem to solution
Acknowledge the frustration, then point to relief.
"Tired of chasing quotes? Get one clear price in 24 hours."
Tip: Write for the customer, not about yourself. "Family-owned since 1998" is nice, but it is about you. "Same-day repairs from a team you can trust" is about them. Lead with what they get, and save the company backstory for your about page.
Before and after examples
Here is how ordinary heroes improve when you apply the ideas above.
Example 1: A cleaning company
Before: "Welcome to Sparkle Cleaning Services LLC. Quality you can count on."
After: "A spotless home without lifting a finger. Trusted house cleaning across Phoenix, booked online in two minutes."
The "before" is a generic greeting that could belong to any business. The "after" names the outcome, the service, the location, and how easy it is to start.
Example 2: A bookkeeper
Before: "Comprehensive financial solutions tailored to your needs."
After: "Books that are always up to date, so you can stop worrying about tax season. Bookkeeping for small businesses and solo owners."
The "after" replaces vague jargon with a concrete relief the customer actually feels.
Example 3: A roofing contractor
Before: "Your premier roofing partner delivering excellence."
After: "Leaky roof? Get a free inspection and a clear, no-pressure quote within a day."
The "after" leads with the problem the visitor is searching to solve and offers an easy next step.
Writing the call to action
The button is where interest turns into a lead, so its wording matters. Be specific about what happens when someone clicks. "Submit" and "Learn more" are weak. "Book a free estimate," "Get my quote," and "Schedule a call" tell people exactly what they get.
A useful pattern is one strong primary button plus one softer secondary link for people who are not ready to commit. For more ideas, see our roundup of call to action examples and how to write a call to action for a service business website.
Design and layout matter too
Even great copy falls flat if the hero is hard to read. A few practical rules:
- Keep the headline short enough to read at a glance, ideally under about ten words.
- Make sure text has strong contrast against the background image or color.
- Check it on a phone first. Most visitors are on mobile, and hero text often gets buried or cut off.
- Do not hide the button below the fold on small screens.
The hero sets the tone for the rest of the page, so it should flow naturally into your homepage copy. If you are planning the whole page, our guide to homepage layout best practices shows how the hero fits with everything below it.
A quick checklist before you publish
- Can a stranger tell what you do in five seconds?
- Is it clear who you help and what problem you solve?
- Is there one obvious next step?
- Did you cut the jargon and lead with the customer?
- Does it read well on a phone?
If you can check all five, your hero section is in good shape. For the bigger picture on writing every page well, our website copywriting guide for small businesses is a helpful next read.
Frequently asked questions
How long should a hero section headline be?
Short enough to grasp instantly, usually one line and under about ten words. If your headline needs more explanation, move the extra detail into the subheadline underneath. The headline carries the promise, the subheadline fills in the specifics.
Should my hero section have an image or video?
An image that shows your actual work, your team, or a happy customer usually helps more than a generic stock photo. Video can work, but keep it short and make sure your headline and button are still readable over it on mobile. Never let the visuals crowd out the words.
What is the biggest hero section mistake?
Being vague. Slogans like "excellence delivered" or "solutions for your needs" say nothing a visitor can act on. Say plainly what you do, who it is for, and what to do next. Clarity converts better than clever wording almost every time.
Let Arbor write it for you
Writing a hero section that is clear, honest, and built to convert takes a few drafts and a good eye for what to cut. If you would rather not sweat over every word, that is exactly what Arbor does. We build your site, write the copy (hero included), and optimize it so people and AI answer engines can find you. When you want to change a line, you just ask Sage, our built-in editor, and it updates.
Want to know how your current site stacks up first? Try our free SEO & AI Score to see where your homepage stands and what to improve. Either way, you will walk away with a hero section that finally earns its spot at the top of the page.