How to design a winning website homepage

It’s hard to describe how a site should look and feel, but people make snap judgements when they arrive on a website.

How a site should look (or rather, what visitors expect) will depend on the type of site and sector, but if it looks professional, then people will be more inclined to trust it. If the design is messy, or perhaps looks out of date, then this can be a warning sign.

The purpose of a homepage will vary according to the type of website. For example, for retailers with multiple products, it might be about helping people to start their product search and for lifestyle blogs, it might be about signposting the latest guest feature.

It’s also important that content is given room to breathe within the website layout. Space between elements on the homepage avoids clutter and visual confusion for site visitors, enabling you to get key messages across. It’s important for homepages to adapt to different devices, so testing the design across mobile devices, tablets and desktops is a must.

The difficulty of this task will, of course, depend on the type of venture or business. If you’re a retailer, the style of your website and imagery will communicate this to visitors. If you’re running a lifestyle blog, you may want to describe your purpose and passion through snappy headlines.

Gousto, for example, which sells recipe boxes, uses a lot of its homepage to emphasise key selling points, such as introductory offers, the quality of their recipes and appealing imagery of cooked meals. For businesses like this, explaining the value proposition is key. Visitors need to know how a service will help them and what product to expect.

Imagery can be used to help convey the purpose of a website, or simply to highlight products if offered.

This can be done in a number of ways. For example, large ‘hero’ images can be used to showcase products or featured content pieces. Other sites, often those with more varied product ranges or multiple offerings, may choose to use multiple images. In either case, good quality imagery helps to convey the purpose and make a good first impression. 

Since the homepage works as a hub for many visitors, the point where they begin to look for products or find information, then clear navigation is essential.

Clear navigation options should help them to find what they want without hassle so there’s no need to be too bold here. A simple navigation bar at the top of the page is what most visitors will expect.

The purpose of a homepage will vary according to the type of website. For example, for retailers with multiple products, it might be about helping people to start their product search and for lifestyle blogs, it might be about signposting to the latest guest feature.

Over time, categories can be adjusted, or given greater or lesser prominence depending on how popular they are, and how often people use them. It also helps to think about how many categories you need, as this can affect design choices.

For example, if you sell a large and varied product range, then drop-down menus are an elegant design solution which saves space on the page while allowing customers to be more specific as they navigate from the homepage, which you can see retailers like Graham and Green utilising.

These are available on several ecommerce themes from Shopify for example, and can be tailored according to the number of options.

Site search is another navigation option, and almost essential if you sell a large product range or host a lot of content. Essentially, by searching for a specific product or content on a specific topic, people are indicating an interest in buying or consuming it. Make it easy to find and you can drive conversions from these users.

A homepage may contain several calls to action, depending on the range of products and content, or the key goals of the page. Some may be higher priority than others, but the common theme is that they should be clear and easy to find for users.

A link to a contact page is often shown in the footer of a site, but if you wish to make this more prominent, or perhaps encourage more customer contacts, it can be displayed in the site header.

After all, if customers are looking to get in touch with you, it’s best to make it easy to find you. This can also be a trust issue for new customers. Prominently displayed help and contact options show potential customers that you’re easy to get in touch with if they have any questions.

Links to FAQs pages in the footer also offer visitors a way to find answers to questions without needing to get in touch.

If you have physical stores, it can pay to make these links clear so that shoppers can easily find the details they need. This is information which can drive store visits so make it easy to find. A link in the top header is common practice as it’s where most visitors will expect to find this.

Having added items to their baskets, some shoppers will browse other products and sometimes head back to the homepage. Or else, they’ll leave the site before returning via the homepage. For ecommerce sites, permanent links to the basket/checkout provide a quick route back to checkout for shoppers while highlighting the fact that items have been added can act as a useful prompt.

The homepage is a key space to highlight new content, promotions, selling points, and important information for customers. This may be a sale promoted through a large hero image, a new guest blog or using the area above the fold to highlight key offers and selling points. The space above and underneath the header can also be used for key information which visitors need to know.

For example, lifestyle blog ‘Cup of Jo’ showcases featured blogs, a list of the most popular content and ‘editors picks’ of products on the website homepage.

For ecommerce sites, shipping offers, discounts and flexible payment options can be key sales drivers, so it pays to promote them. The idea here is to ensure that visitors are made aware of these details when they arrive on site, so that it becomes a compelling factor when they’re making a purchase decision.

How heavily brands promote content from their homepage depends very much on the type of website and level of effort they’ve put into creating content.

For websites that focus on blogs or personal ventures, content is likely to have a big presence on the homepage. Whereas for retail businesses, often links to blogs are placed somewhere in the footer where they won’t interfere with product links and promotions.

In any case, a strong content offering can keep visitors on site longer, and in many cases can drive conversions. It all depends on your products, industry and your business strategy. Sites selling DIY products can offer help to fix common issues for example, or food sites can provide recipe ideas.

Social proof can help to establish a website’s credibility to new users unfamiliar with the brand, so it can pay to use this on the homepage.

Reviews are a prime example of social proof and show prospects that other people have shopped on a site and have been happy enough to leave positive ratings. Services such as Feefo can collate reviews from buyers, and this information can be used on the homepage to boost trust in the brand. For other types of websites, showcasing social shares of popular content is another form of social proof.