If you are redesigning a website, homepage or are about to design a website for the first time, it’s a really exciting time for any business.

And if you’re not excited, I want to encourage you and say that you’re taking a great step in doing the task in hand. *pat yourself on the back and first bump the closest person to you*. To help you get started I’m going to show you how to create the best homepage and make the best first impression from your website.

Have you ever been on a website and thought to yourself “Wow this is for me” as soon as you land there! You’ve probably been driven there from google, an attractive ad or a blog post. And it’s probably has been designed with you in mind.

Companies will invest thousands of dollars, time and testing into finding what makes customers come to their website and why their visitors end up purchasing from them. But it all starts with the first few seconds on that all important homepage.

A few seconds eh?

You’ve got to capture the viewer’s attention before then even think about scrolling or clicking on anything. The first 3 seconds are the difference between someone choosing to continue on your website or hitting backspace and choosing your competitor.

I’m going to talk about the part of your homepage which in the web design world we call “above the fold.” This is the part of your website that people see before they start scrolling or clicking on a new page.

And this process all starts with tailoring this small part of your website to your niche!

So who’s your niche? Well, It’s the individuals who is most in need of your product. And unfortunately these people come in all shapes and sizes but don’t worry – once you know what you’re doing you’ll be able to speak directly to them.

Landing pages vs Homepage

Before we begin I want to get very clear about using landing pages vs. a website homepage.

Landing pages are tailored to a very specific niche.

This can be as small as just a few people that have come from a certain form of traffic. Like a keyword from google.  

Let’s say your business is Small Business Accounting. But you have many different customers from all different kinds of areas. You have eCommerce, IT, Cafes. Your website needs to appeal to anyone looking for Small Business Accounting. But you can have a landing page for each of those different niches.

So if someone was to type “Accountants for Cafes” sending them to your homepage probably isn’t going to help them as much as a landing page will. But sending them to your landing page designed for Accounting for Cafes is where you’re allowed to get very specific and write all your content relating to your cafe owners.

Customers want to feel confident that you can help them before you have even begun using your service. If they feel like they’re going to be the first cafe you’ve worked with then they’re going to feel you don’t have the right experience.

Xero

“Your landing page becomes about the customer. Your Homepage becomes about the product”.

Landing pages are design to get a customer to purchase your product as quickly as possible. Your homepage is designed to get sales from a broader approach.

So How do I Design the Homepage?

Well here’s a tip.

Treat your homepage like your home. You want to design your home interior so that it shows off who you are and what you’re about. People will judge your home as soon as they step through the door. As it’s far too much effort to redecorate the house based on who’s coming into your home you don’t need to be worried about it being specific. With a homepage It’s about you or your product. Your guests explore all that you have to give and build the trust up before you invite them round again.

So here are the three parts you need at the top of the homepage to make a great first impression.

Headline

First Impressions count.

As I said before, a few seconds after someone enter your home they have already made up their mind about it. If your hallway is clean, easy to manoeuvre and makes someone feel comfortable then they will be more at peace with going into the living room.

You’re heading is everything you represent in a few words. (And I mean only a few words)

Uber

Uber’s headline is “Get There.” What they primarily care about is that you get to your destination safely and securely. So showing their users that getting you there is what’s most important to them make users feel comforted instantly. Keep it super short. There’s absolutely no need for the opening title to be “Our goal is to make sure you get to your destination and we’re really confident about getting you there.” Short and simple.

Sub Heading

Now your sub heading is going from what the problem is to how you’re going to provide the solution. Sounds lengthy right?

Well, yes it is. But it shouldn’t be too long, so you’ve got to work on narrowing it down further and further until you have got it in just one sentence. (remember you’ve only got a couple of seconds to make an impression – don’t waste time with lots of text)

The pain point

Now when I say pain point you want to address what is one of the biggest problems your customers are having before they’ve used your product. This can be things like ‘other software is too pricey’, ‘it takes too long to accomplish the task’, ‘there’s too much paper trail’.

Xero (again) Have a great example of a sub heading. “Join 1 million subscribers who keep on top of small business cash flow with Xero and get paid in just a few clicks.”

The pain point they are addressing is that small businesses can find it difficult to stay on top of their cash flow and as a result are having delayed payments but they offer a solution that means you will no longer have these problems.

The user still doesn’t know what the solution is. All they know is that with Xero you can kiss these problems goodbye.

Xero have also started with a trusting statement. “Join 1 Million subscribers.” One Million people can’t be wrong surely? I personally don’t believe so – certainly not within 3 seconds which is that critical time. So immediately the user trusts the company because of the sheer volume of fellow users.

So already we know the company values, the problem they’re trying to solve and we believe they are a trustworthy source. All within our first few seconds. BOOM!

Hero Image

They say an image speaks a thousand word. I’d agree. Imagery is a powerful tool that writing doesn’t allow us to achieve. And as a society we’d much rather upload an image to our Insta-story than post about what we are doing on Facebook nowadays.

So your image can speak a thousand words. Powerful. But make sure your image is speaking 1000 words of influence, positivity and help rather than something that’s vague and leaves your reader confused.

So let go back to your house, there are two kinds of images mainly displayed in houses. Contemporary and family photos. Living 5 minutes walk from the beach, my parents tended to have a lot of photos of beaches and the ocean along the walls but sitting on counter tops we have family photos – things like adventures, graduations, partners. Together these two types of images tell guests so much. Getting the balance is key!

(Note for later: Stock images can be wonderful but also your worst enemy.)

The 5 Hero Image Categories

For Your Hero Image. Make sure Your Image falls into one of these 5 categories

  • The physical product
  • A screen image on an ipad for an app
  • Someone using your product,
  • A photo of your providing your service
  • The end result of someone using your service

“Within your first 3 seconds you’re wanting to display to the reader of what they will be receiving or feeling during or after using your product or service.”

 

A Physical Product

Companies like Apple and Samsung have their latest product as their hero image. This is so you’re instantly seeing the product they are trying to sell you. Major companies will have already built up trust in your mind through TV, Billboards, Posters, social media and constant advertising. Which is why when looking for a new phone you’re already thinking of these two tech giants.

Unfortunately smaller companies have to work a lot harder because no one has heard of you before finding your website. Which requires much more work through your website. But if you have a product to sell and your hero image clearly shows off the use of the product, then using this option as your hero image is a great way to create that first impression

Screen Images

If your product is a piece of software then using a screenshot of your app on a screen to demonstrate to the user what you’re going to be selling them. Just like a physical product you’re showing the user what they are getting. However you are using an image of the screen that’s displayed on your product.

When deciding on which screen to show think back to your pain points and how the image displayed clearly shows why your product makes life better for the user. Don’t over think this. Use images that don’t take long to understand. Keep it simple by using images of charts and graphs. With this Xero example you know instantly what they are displaying. Remember, you only have a few seconds.

 

Someone Using the Product

Gyms are a great example of this. Using images of people using your product or service. What’s really important is that your photo matches with the user.

For example let’s say you’re selling a high intensity cross trainer for high intensity workouts. Using an image of someone smiling isn’t going to resonate with those who are looking for massive results from the work out. But using a photo of someone covered in sweat, gasping for air isn’t going to appeal to the person looking to get into fitness but isn’t there yet. However choosing a photo of someone showing focus, determination, composure and effort will sit much better with your market. By all means have different images in landing pages, A landing page for beginners and one for fitness freaks. But for your homepage a balance in the middle.

You Providing Your Service

If your business is providing a service such as Coaching, Personal Fitness, Consulting etc.. a photo showing you conducting your service is a great option. A photo of you coaching/instructing makes people think “Wow, she knows what she’s doing!”

 

The End Result of Someone Using Your Service

What’s the end result of your product or service? Is it a beautiful burrito delivered straight to your door? A banging six pack? Whiter teeth? It can be anything as long as it is clear.

When it comes to stock footage this is where you need to be very careful. Purely because stock image can display the correct emotion but often because of the you lose trust becuase it’s not authentic and becomes immensely cheesy.

Use these strategies to add a grand hero image to your website. But if it’s not clear then it’s not going to be good.

So there you have it.

The first and possibly the most vital part of your home page so far.

If you’re an intermediate designer or have seen a fair few websites in your day you are possibly thinking. “Hang on, Where’s the Call to action button, the email, the menu?” Well You can find that right here!

In the meantime if you’re looking to start building your website check out the Starter Kits page and learn how to create a website for your needs and your niche right now!

Like, Follow and Share!
0