Homepage is the entrance to your website. Just like the exterior of the house, it is the first thing that people judge when they visit your website.
The common problem that I encounter as a web designer is that client normally doesn’t know what to include in their website.
This blog explains the anatomy of best practice homepage design, from web designer point of view.
Before we start
- Generally, unless otherwise in the quote, when you hire a web designer, you will be asked to provide your content. Your web designer won’t be responsible in writing your website content and normally it is not included in the quote.
- If you need help with your content, your to go person is a copywriter. The copywriter will help you with the sitemap, number of pages and what should be covered in each page.
- Your web designer will take the content and put them in your website with the best digital practice standard, to ensure they are easy to read and optimised for your conversion.
This ultimate check list below for the homepage is what you need to attract, connect and convert more visitors into buyers. Put your website sales into overdrive.
Anatomy of your website
Header normally consist of Admin Bar, logo, navigational menu and or search.
The admin bar usually runs along the very top of a website in very small font. Usually used for phone number, social media icons (sometimes), shopping cart functionality or search.
This is also a great place to collect email address. In an effort to improve user experience, Google started cracking down on intrusive pop ups. Since that time, the announcement bar / hello bar / top bar has become even more important. It is your opportunity to capture a lead’s email address so you can nurture them.
My recommendation is to not have a popup at all on mobile, and if you really want one on desktop – then set a delay of 45 secs. Please collect the lead’s first name (as well as their email address) so you can personalise your emails to them.
LOGO & MENU
The rest of your header should include professional logo and simple effective menu that help readers find what they are looking for in the effective way.
As you can see on the header example above, it is recommended that you have the logo on the left and the menu on the same row. A few recommendations on the logo and menu:
- Logo should redirect back to the homepage when clicked
- Menu items should be clear, use common words and showcasing your sevices.For example, if you a selling a ‘Mindset’ package, don’t call it a ‘Get Your Thoughts In Check’ package Drop-downs should be avoided if possible. If you have less than 3 services for example, instead of having SERVICE with a drop-down menu, have each service as a menu item. Information that the user wants should be one click away.
- Menu items should follow a similar order to the below the first and the last item should be the most important to your business: Home, About, Services, Testimonial, Blog/FAQs
- The last item of the menu should be your Call to Action, for example: Contact, Book a Session. User look for this intuitively at the end of a menu.
- Keep social icons in the footer. We spend a lot of time, effort and money getting users to your website, don’t give them a reason to leave.
HERO IMAGE WITH CALL TO ACTION
Use professional image that relates to your business. Your Headline should explain your Unique Selling Preposition that is providing what you do and what benefit it gives to your prospective customers.
Use keyword rich heading copy.
Your Call To Action should be the action that you want your visitor to take. Write a compelling line of copy here, rather than just ‘GET IN TOUCH’.
This should also t
COMPELLING H1/H2 HEADLINE
Make sure you have 1 Heading 1 on each page with your keyword in the headline. You keyword rich body copy should include at least 300-500 words of benefit-driven, keyword rich copy to tell Google what your website is all about.
You’ll have a lot better chance of attracting visitors if you have a good amount of copy on your homepage so don’t skip this step!
The about section on the homepage is a first glimpse for your reader to learn a bit about you. Try to make it more personal by telling your story and your big WHY. You can talk about why you started this business, about how you saw a big probelms and set out to solve it.
Set up a secondary CTA to logical next step (it can link to About page or even Booking page).
KEYWORD RICH SERVICE SECTIONS
List down your main services here with benefit driven copy. Instead of talking about yourself and what you do, try spinning the language to talk about your customers. A simple trick is to minimise the time you say “we” and instead use “you” or your”.
Social proofing such as testimonials or reviews add trust and credibility. You can also add Google reviews which will help you attract more ideal customers!
If you have partner logos, big clients you work with or if you have been featured somewhere, add the logos here for added trust and credibility.
Another section that you might want to consider to be added in the homepage can include:
– Latest Blog Posts or News to keep your customers in the loop
– Latest Portfolio items to showcase your creations
– Newsletter sign up section
Essentially, footer normally includes your contact details and/or quick contact form. The contact details normally include your address (if you have physical address or PO BOX), contact number and email number. Some companies like to add a little google map on this section, but I personally like to have it on your contact page as it is less clutter and you have bigger space for the map. Operating hours also normally be added here..
People also add quick links here. I recommend adding pages that people normally search more here – such as your FAQs, T&Cs, Shipping and Delivery. You can also add some seals of approval here such as professional logo endorsement or associate logo. This will help building their trust to your company.