Stage 1 Setup
Below is an example hero section.
Your Hero section is the first thing your website visitor sees when they land on your homepage, so it’s primary goal is to inform.
A perfect hero message should make clear what you do, for whom you do it, and why you exist.
What, Whom, Why
Your Hero Section Should:
- Help your visitor quickly determine if your website, product, or service will be useful to them
- Establish credibility and trust
- Seize your user’s attention and convince them to explore further
- Entice your visitor to perform your desired call to action (the “next step” you want users to take on your site)
- Be crisp, clear and compelling
- Be short, snappy, and memorable
- Be related to what your client is trying to achieve
An Effective Hero Section
Here is a good example of a hero section from web-based list-making application Trello:
Why it works:
- It explains what they do: Trello offers boards, lists, and cards its customers can use to organize and prioritize their projects
- It explains how their service benefits their customer: Trello “lets you work more collaboratively and get more done.”
- It focuses on the “you”: Trello “lets you work more collaboratively.” It “enables you to organize and prioritize your projects.”
- It has a clear call to action: The bright green button stands out against the blue background and calls for the visitor to sign up for the service for free