5 Tips For Great Website Header Design

The header refers to the upper portion of a web page, and it has a lot of heavy lifting to do. It’s the first part of the website that users see, so it has to be both clear and compelling. They say that you never get a second chance to make a first impression, and this is never truer than with a website.

If your header is confusing or off-putting, then it only takes a second for a visitor to click away and move on to a competitor. To avoid losing potential customers, it is important to put some thought into the design and layout of the header. Here are some tips to bear in mind.


Readability is vital

Users scan website headers for basic information about what the site is for. The typeface should be clear and reasonably large, so it can be read at a glance. Avoid any stylised fonts, as these are more difficult to read on screen. Keep sentences brief and to the point, and avoid strong background colours. 


Consider hero images carefully

Some websites like to use hero images, which are oversize banners containing a high-resolution graphic. This can make the site seem more inviting and personal, but it needs to be approached with caution. Firstly, a large image can slow down the loading time for the site, which reduces your traffic, so make sure that the image is optimised for display.

The other question to ask is whether an elaborate visual is actually necessary at all, particularly if it’s just a stock photo that says little about your brand identity or purpose. Visitors will have already clicked on the site with a goal in mind, and your focus should be helping them to achieve that goal, rather than distracting from it. 


Add a value proposition

After the company name and logo, the next most important task is to add a value proposition, which should convey in short, well-crafted sentences what benefit your products or services offer customers. Always address their problems and pain points directly, and explain how you solve them.


Always add a navigation menu

The header should contain a navigation menu, which needs to be optimised for a responsive design. It doesn’t need to contain links to every page on the site; in fact it shouldn’t if your site is large. Just add the main pages that your customers use, and help them navigate the site in as few clicks as possible. 

Include a site search function

If a visitor can’t find what they need in the main menu, they may look for a search tool which traditionally located at the top right-hand corner of a website. This can help you to retain customers who would otherwise go to a rival site, and increase your conversion rate.

Other basic information customers look for in a website header includes an email address and telephone number, and links to the company social media profiles.


If you would like some help with white label web development, please get in touch today.