Design Trends: Navigation

Understanding trends and balancing them with good UX practises

We have noticed an increasing trend in website design to reposition or even collapse and hide the website navigation. The traditional positioning for navigation within a website has always been the top right or left of the page. It is very important to remember the reasoning behind the traditional placement before considering experimenting with this.

Navigation is something that is very important to consider when designing a user experience. One the of key elements of creating a good user experience is letting the user know where they are and how to get to the page they want to view. It’s also important to remember that a user might not necessarily enter the site at the home page and therefore might miss any navigation information displayed within the body of the page. The user needs to enter the website page from their search results and quickly determine if the company offers the information or services they are looking for. If the information within the page they land on does not offer this answer then a quick look at the navigation will tell them what other pages might yield better results.

Expected design patterns are established by the volume of which they are adopted and the speed at which they become standardised patterns. IE if everyone expects to find the menu at the top of the page but do not find it there, the user will become momentarily confused. How long that confusion lasts depends on how easy it is to find the new position of the menu.

Tips to keep in mind when experimenting:

  1. Always keep the navigation “above the fold” this means the menu needs to be visible in the top part of the web page when the website loads in the browser.

  2. Consistency is key. Make sure the user knows where to find the menu at any given time, from any position in their scroll, and from any page within the website.

Example 1:

This positioning displays the menu on the left hand side. It is anchored to the top and is consistent across all of the pages within the site. The style of this site is a short format page which loads off of the content within the screen and therefore does not require scrolling.

Design Trends

Example 2:

This website collapses the menu by default which is a risky move it forces users to click in order to view the menu. Unfortunately users do not often like being forced to click so this may decrease the length of time users stay on the site. As the user scrolls the menu also moves from left to right which can make for a confusing experience for the user.

Design Trends
Design Trends

Example 3:

In this example the menu structure behaves like that of a software user interface or web application. This view of a left hand column menu with the items arranged vertically down the page is something you would see very often when interacting with any kind of software dashboard. This pattern is less seen in websites however as users are used to interacting with this style when interacting with software menus, users should adapt to it quite easily.

Design Trends

What's your project idea and how can we help to turn it into a reality? Get in touch today to discuss how we can use our knowledge of best practice user experience design and design trends to design an experience and interface which your visitors will love using

 

Get in Touch