Case name
Share this post
The most important part of your website: 6 tips for the perfect Hero Section
Surely there is nothing more important and less underrated on your website than a really good one Hero Section. A visitor to your website makes decisions within 3 seconds (some studies even assume less than 1s) as to whether he stays on your side or just goes to the competition.
In addition to a great look & feel, 6 other factors play an important role here:
1. Clear header:
Your website navigation should be clear and concise. Every user should be able to immediately recognize what content they can still find. However, don't overload the navigation. If this is the case, try using a drop-down menu to better structure your links. In addition, your logo should be placed here.
2. Meaningful headline:
Headlines are certainly one of the most important elements on your website. The font size and thickness of the font should particularly highlight this headline. Since the user is the first to perceive this text, you should inspire them with this headline.
Talk about benefits for the customer and not the features of your product or service. Sentences such as: “Welcome to XYZ - we offer ABC” are just as out of place here. The customer is not interested in you, but rather in how you can help them with their specific problem.
A good example of this would be: “Healthier and more efficient employees through company fitness” → Customer advantage: Healthier and more efficient employees. How do we achieve this: corporate fitness.
3rd subheadline:
The subheadline is a sub-heading with which you can underline or supplement the message of the primary headline. Provide the user with additional information. How exactly or by what do you solve the user's problems?
4. Clear call-to-action (CTA)
A CTA is a call to action. This is an attempt to encourage the user to take a specific action on your website. On a website, a CTA is usually provided with a link that takes the user to a landing page, opens a pop-up or triggers another action. You usually use the CTA as a button. To formulate an appropriate CTA, you can ask yourself these questions: “What should the user do on your website?” , “What exactly happens when the user clicks on my button/ link?” or “What is your website's goal? ”
- The CTA should describe as clearly as possible what happens as a result of the click. For example: “Arrange an initial consultation.”
- The CTA should stand out from the rest of the page.
- The appearance of the CTA should force the user not to be able to look anywhere else.
5. Strong image:
Use a meaningful image. This can represent the function of your product, an end result of it or, if you are the face of your company, represent yourself. The image shouldn't distract from the CTA. In the best case, you direct your eye to the CTA through the image.
In this Hero Section, for example, the eye is subtly directed towards the headline. With the trainer's gaze and the outstretched hand pointing towards the headline, the text area comes to the foreground.
This can also be used even more strongly, for example by taking a large picture of a face whose eyes are directed towards the headline/CTA.
6. Social proof:
Social proof is created when people trust you more when they know that many other people already trust you. I'm sure you know it yourself. Nothing can generate more trust than opinions from real customers. Therefore, create trust in your brand through social proof. Which companies did you work with? Do you have any testimonials? How many customers have you had already?
Most companies already have reviews or ratings on platforms such as Trustpilot, ProvenExpert or Google. Write to these customers (if known) and ask if you can post their review on your website. Customer testimonials appear even more credible with an image of the customer.
Here you can see all 6 points again using the example of a Hero Section draft:
What does the Hero Section do? - In short
A good Hero Section is essential for the success of your website. It determines important key figures such as the bounce rate, scroll depth, length of stay or conversion rate.
In principle, your Hero Section is like a very short pitch from your company. Within a few seconds, you try to convince the user of your offer and persuade them to interact with your website or make a contact request.
If you take the factors mentioned above into account, you can significantly improve your website yourself. If there are high requirements for design or for the formulation of clear texts/a sharp positioning, it is often useful to bring a freelancer or an agency on board.
On LinkedIn, Yannik also summarized the most important things for a good Hero Section: