A Hero: The Web Design Edition

There’s Batman, Superman, Wonderwoman, Thor… the list could go on and on. But what are we really talking about when we use the term ‘hero’ in web design?

With only 50 milliseconds for a user to form an opinion about your website, every second counts. Literally! As a decision is formed in the blink of an eye, it’s important that you make a fantastic first impression. How you go about doing that is entirely up to you!

So… What is a Hero anyway?

Some define is as a home page and some define it as the main call to action. But that’s not necessarily 100% accurate. A hero is a (very important) part of your home page. More often than not, it’s the first thing your potential clients and customers see. This is what can make or break your website.

Firstly, let’s look at what makes a great home page!

You may not realise it, but most fantastic website home pages have the same skeleton. Think of them as people! Sure, every website looks different but underneath, the structure is relatively similar.

So what do the majority of websites have in common?

• The logo and company branding is present throughout the website. It’s important that your website visitors know it’s your website they are visiting. This may sound obvious, but there is a lot of competition out there. Would there be anything worse than losing a sale to a competitor because a customer thought you were the competitor?
• Either contact information or a link to a contact form. Your customers and clients will hopefully want to get in touch with you. Whether this is to find out more or maybe even ask questions, it needs to be obvious how to get in touch. Here’s a fun fact: up to 44% of website users will leave if there is a lack of contact information. Just let that sink in.
• A strong call to action (CTA). Whether this is to buy a product or enquire about a quote, it’s important that it’s clear to a customer what their next step is. Customers can easily get overwhelmed if they are offered too much choice. This can lead to frustration and also a loss of a sale. Make it easier for your customers and yourself by just telling them where they need to go!
• Important links to the rest of the website. This could be to view pricing, a gallery or read more about the company. The longer a user stays on your website, the more of a chance you have of building the trust and rapport you need to make that ever important sale.
• Social media links and shareable content. In this day and age, it’s important that your content is shareable. Think of it this way, whenever someone shares your website, it’s free publicity!

That’s all well and good, but how does a hero fit into all of this?

It’s a good question, so let us help explain! As we have said earlier, the hero is the first thing that a website user sees. Not only that, but we have also seen that it takes just 50 milliseconds for a user to form an opinion about a website.

Where does that leave us?

Basically, your hero needs to encompass the key goals of your website into one area. It needs to have your branding and it needs to make clear the intention of your website.

For example, take a look at Abbey Masterbatch. Their hero consists of a bright, eye catching visual and some about text that tells you exactly what they do. There’s also links to other parts of their website so you know what products they sell without having to do any work!

It’s arguably one of the most important aspects of your overall website design, so it’s needs to be at the forefront of your design mind.

Need help redesigning your website? Here at Sitely we specialise in beautiful template websites. Get in touch to see what we can do for you!