The first thing most people look at when they arrive at a new web page is the header. The header contains vital information about your company's name and function, as well as the purpose of the specific page. Most people don't tend to find home pages through organic search traffic, so they'll likely end up on a blog post or tutorial page and want answers about your website.
Let's dive into how headers impact your customers' first impressions of your website and how to tailor them to fit your needs.
The Importance of Headers
As we mentioned above, the header is the first thing people see so it needs to be eye-catching and explanatory. Simply showing your company's name isn't enough unless you're a huge corporate entity like Amazon or Google. For most companies, your name won't give people nearly enough information about what your brand is about or what your website offers to keep their interest.
A good header functions like a salesperson. You need to quickly show users who you are, what you do, and why you do it so well. In conjunction with a header, your call-to-action will help your users feel some urgency about their decision and motivate them to subscribe now rather than later, but your header needs to have gotten their attention before everything else.
However, the header is usually also where your navigational bar is. That means that your header needs to do the double duty of showing your audience an overarching outline of your website and give your name.
Given the importance of your header, there are a few necessities that you'll need to have there to ensure people can access your website in a few seconds while they're debating hitting the back button.
A Search Bar
Far on the right side of your navigational menu of a header, consider adding a search box accompanied by a small icon, usually of a magnifying glass. Depending on the length of your company name and logo, it might actually be easier and more streamlined just to have your name and a search box up top. Drop-down navigational menus and a "Contact Us" button can also be helpful.
With a comprehensive search feature, customers can find what they're looking for in a snap. While the navigational menu often displays categories or themes, a search box will help them find specific pages on your website, even if you have thousands with all of the fresh content rolling in on a daily or weekly basis.
Ensure that your search function has an autocomplete feature so that people can find their pages even if they've only typed the first few letters or don't know how to spell something.
Another aspect of a search bar is that it should be a natural language processor to allow for regional spelling, word variations, or phraseology.
Your Name
This is less common, but can be a costly mistake. Some companies are so focused on giving the user options to navigate through their website that they don't put the business name in the header. This could also be for stylistic reasons, but most people don't have the patience to scroll all the way down to the bottom to see your website's name.
Don't make people guess where they've ended up. Just let them know in the center or upper left-hand corner of your pages. Make sure that all of your pages have the same or similar header, so even if a new user finds one of your older pages through a search engine, they'll still know who you are.
Show and Tell
As noted above, a company's name isn't often enough for the customer to know what types of products or services you offer. This isn't to say that cute, catchy titles aren't great, but they don't provide enough information. If possible, use your header as a place to show what your website and company do.
This is often accomplished through the navigation bar. By listing categories like "Shop" with a drop-down menu for product categories, people will easily be able to see what kinds of things you are selling.
Obviously, you can't spend the entire header explaining your company's mission and what you do, but the clues should be there and plain for everyone to see, or you might find potential customers bouncing from your website more often than not.
Unlike other situations, your website doesn't need to be coy about the fact that you are selling them something. Don't beat around the bush; people already know that you're selling products or services. They don't want you to pretend to be something you're not. Even if they land on a blog or tutorial page, most consumers are savvy enough to know that nothing is free, and you're making the content to advertise what your company does.
It's much more important for customers to be able to quickly make decisions about whether or not to investigate your website further, so it's better to err on the side of caution and add more to your header.
Don't overcrowd it, but remember that most people won't spend more than a few seconds evaluating it before deciding one way or the other.
What's Special About You
This one is a little trickier to describe but equally important. Once the user knows your name and what you're selling, they'll need a reason why they should stick with your company. For many people, when they find a website through a search engine, they're looking for a particular product or service. If you sell it, the chances are high that you have some competitors in your industry.
You'll need a way to differentiate yourself from those competitors. Some customers will stick with whichever one they find first, which is why it's so essential to rank high in search engine results pages, but the majority of people will do their research, especially if you're selling something expensive.
People will want to see reviews of your brand and products and make some price and feature comparisons between you and your competitors. You don't have enough room in your header to explain all of the reasons why they should choose you. But having a navigational button to reach testimonials, reviews, or something similar is a good way to make it simple to do their research.
Another way to show your users why they should stay with your website is to advertise a discount happening in a banner right beneath your header. Instead of only featuring the information on your home page, make a pop-up banner that goes wherever your header goes. Your users will immediately see that you have reduced your prices. This will give them some motivation to choose you over competitors.
Header Examples
If you're wondering how to create a streamlined header for your company, start by looking at other companies. Try checking out competitors or other businesses in your industry. You can also look at some of the following examples to better understand what customers are looking for online and what they respond to best.
Likely one of the best and most widely known header examples is Google. When you get to their home page, you see their company name, followed by a search box. Underneath it says Google Search, which demonstrates that this is a search engine. There is an About section in the upper left-hand corner for more information on the company. It's simple and effective.
Amazon
Amazon has a comprehensive header that gives their name, a search bar, a greeting for the user (which shows if they are logged in), a link to their shopping cart, a list of categories for navigation, and a discount in the right corner. All of these components form to make an easy-to-understand interface that allows customers to immediately know what type of website it is, what they have to offer, and a reason why the user shouldn't leave for greener pastures.
In Conclusion
Your header is one of the most important aspects of your company's website and needs to be in tip-top shape to attract new customers online. As long as you provide plenty of information and ways for people to find out more about contacting your business or searching through your website, consumers will be able to figure out who you are and what you do in the few seconds they spend scanning your page.
Contact us to learn more about attracting more views and leading potential customers through the conversion funnel.
Sources:
Web Design 101: The Importance Of The Header | Boostability.com
Website Header Design in 2020: Best Practices and Examples | UXPlanet.org
