What are the different navigation options for a website?

A male and a female sat at desk, looking at a laptop. The male is wearing a red hate and pointing to the laptop. The female is looking at the male.

Navigation is an incredibly important aspect of web design. Navigation refers to how visitors move around your site, whether this is through links or a menu. If the navigation on your website is too complicated visitors can be put off exploring further around your website. If you need more convincing check out our blog on why navigation is so important.

There are a few different options when choosing the type of navigation you want. Often this is a choice between menu styles, but there are other ways in which good navigation can improve your website. With such a range of templates and layouts that come with many website builders, it can be difficult to choose the right one. With Go Sitebuilder we want this choice to be easy, so read on to find out the best navigation style for you. 

Header Menu

Website builder homepage showing video and navigation bar
Source: GoSiteBuilder

The first, and most popular, style of navigation is using a header menu. As you can see on our website this is the style we opted for. A header menu gives the visitor a clear range of options as soon as they enter the website. This means that there is no additional searching for a menu option, making this style the most simplistic. A recent study found that header menus are 22% quicker to navigate than other menus. 

Some header menus are static (meaning that they stay at the top of your page as you scroll), whereas others move off the page as you scroll. Neither option is better or worse, but having a static menu means visitors can change pages easier. Often these headers have between 5-7 options to click on, more than that and the web design starts to look cluttered.

Pros of a header menu: 

  • Visitors can easily find your menu
  • Easy to organise your website into specific categories 
  • Gives structure to your website 
  • Allows visitors to quickly move between web pages 
  • A very popular web design trend – for more web design tips read our blog on the latest web design trends

Cons of a header menu:

  • Takes up space on your website
  • Can be difficult to translate into a mobile format 
  • Some prefer a more minimalist homepage with a smaller menu

‘Hamburger’ Menu

Event website homepage showing a hamburger menu]
Source: Circles Conference
events website showing drop down menu
Source: Circles Conference

The ‘hamburger’ menu is often represented by 2 or 3 lines. When the lines are clicked on, the menu opens into the website, as you can see above with the Circles Conference website. Although this option is used less, there are still positive aspects to this design. 

The main reason this is chosen over a header menu is that this design is more minimalist and takes up less room on the homepage, which leaves more room for a bold header, as seen in the images above. Also, as this menu opens out there is more space and there can be more sections of the website. If you have lots of navigation options, a header menu can look cluttered, so a hamburger menu could make your web design look more streamlined. 

Pros of a hamburger menu: 

  • A more minimalistic look
  • A larger range of menu links 
  • Easily transferable to mobile websites 

Cons of a hamburger menu:

  • May be harder for a visitor to find the menu if they don’t know what the symbol means
  • Visitors have to spend more time finding your menu

Drop Down Menus

Source: Asos

This option is often used for online shops as visitors may want to find a specific item. This example of the Asos website essentially has three menus. The first is the option between Women and Men, then they categorise the product by general product type such as clothing, then more specific fits or clothing types. This allows for multiple options when organising your website. 

However, unless you need lots of options an overly organised menu may distract from the content of your website. For example an accounting firm would not need as many options as a site such as Asos. 

Pros of a drop down menu:

  • Site content can be organised into more specific categories
  • A good way to organise for e-commerce sites
  • Gives structure to your website 
  • Visitors can easily find the menu and navigate through your website 

Cons of a drop down menu: 

  • You may be tempted to make too make categories and over complicate your website navigation
  • Not every website needs this many categories 

Whichever type of navigation you choose, remember these 5 assets of good navigation:

  • How quickly can visitors change pages? 
  • How easy is your menu to use?
  • Does the style fit with your web design?
  • Is it too complicated?
  • Can your navigation be translated to a mobile site?

If you are ready to start building your website, then look no further than Go Sitebuilder. We offer a wide range of features including a range of design templates, which give you multiple navigation options. Our simple website builder design means you can have a professional looking website up and running in minutes. Try our 14-day free trial today!

Why is navigation so important on a website?

Core Features to Look For in a Site Builder

Well thought through navigation can make the difference between a visitor spending 30 seconds on your website or one hour. If your website navigation is too complex or poorly designed visitors will be put off quickly and may not decide to continue exploring your website. Therefore, by properly planning your website navigation, your visitor’s user experience will be improved significantly. This blog outlines some of the key reasons why you should keep navigation in mind when designing a website.

What is Website Navigation? 

Website navigation refers to the way a visitor will access different sections of your website. This often includes features such as links and menus embedded in your website design. 

What Different Types of Navigation are There? 

There are a few different options websites opt for in terms of navigation. One is having a header at the top of the website, this is either fixed (staying on your screen as you scroll) or stationary (moving with your screen as your scroll – thus disappearing). Below is the Manchester United website’s homepage, as you can see there is a header with various titles. This allows visitors to easily navigate to sections of the website they are interested in. 


https://www.manutd.com/

Alternatively you could opt for a drop down menu. This is often signified by three horizontal lines or simply the word menu. When visitors click on this they are given various options for different areas of the website. This can be very effective if you want a more clean and simple look to your webpage. A menu option can also be better for mobile phone viewing of your website. Clothing retailers will often use these to section their website into women and mens, as in this example of the Pull & Bear website.


https://www.pullandbear.com/gb/woman-c1030007507.html 

Some websites combine both together to create multiple navigation options. See Gourmet Burger Kitchen’s homepage below, where the top bar menu opens up into a translucent extra menu without taking you off the homepage. 


https://www.gbk.co.uk/

So Why is Navigation Important? 

Navigation that has been well thought out can be very effective in gaining more interest in your website. There are a variety of reasons for this: 

Increased Duration of Visit – navigation that is easy to understand and use, will increase the amount of time visitors spend on your website. If a visitor can access the different areas of your website they were looking for easily, there is a higher chance of them staying on your website longer.

Increased Chance of Sales –  more time spent on your website means visitors are exposed to your products/services for a longer period of time. Therefore, if your website is being used to sell products, navigation can be particularly important in increasing sales. 

Improved User Experience – an easy to use navigation system on your website makes using your website a more enjoyable experience. Therefore, visitors will be more likely to spend more time on your website and they are more likely to revisit your website. 

Good Design – navigation and website design go hand in hand. The style of navigation you choose can alter how your website is viewed by visitors. Therefore, ensuring that your choice of navigation fits in well with the rest of your website design is extremely important. 

The best websites will have thought through various factors before they decide on the type of navigation that works best for them. Some questions to ask yourself are: 

  • What kind of products/services are you selling? What is the best way to organise them?
  • Can you group your products/services/content under umbrella themes or titles?
  • How many titles do you need? 
  • If there are many titles would a drop down menu be easier?
  • Which type of navigation would fit in best with your website design?
  • Who is your target audience?
  • Does your navigation style work on a mobile phone or tablet?

If you consider these questions before creating your website you will create the best navigation for your products/services/content. When thinking about them, always try and have the fewest number of titles possible, as too many make your site look cluttered and confusing to navigate. 

Still unsure? Take a look at these examples of the best types of navigation. Many website builders will also have many different options that you can experiment with.

If you are looking for a good website builder for your company, then look no further than Go Sitebuilder! Our simple design means you can have a professional looking website up and running in minutes. With different types of navigation there are so many options for your new website, and with Go Sitebuilder you can rest assured that all our websites are fully optimised for both desktop, tablet and mobile devices, regardless of the navigation style you choose. Try our 14-day free trial today.