Website Navigation — R&D

Ollie Dare
Action for Oceans
Published in
2 min readOct 17, 2018

Ease of navigation is one of the most important aspects of a website’s design. Consideration must be taken in terms of where the user’s attention is drawn to; if a user is unsure where to look on a homepage, chances are they won’t stick around for long. This sense of direction can be achieved through various elements of design — colour, type, white space, weight, line etc. A sense of hierarchy is crucial for a user to navigate site elements such as menus & sub-menus, articles and footers.

https://www.microsoft.com/en-gb/

Microsoft

Microsoft’s website is a great example of easy to understand navigation. It features a clear navigation bar, large slideshow headers and tile-based links to ensure not only is the website easy to understand, but also transferable to mobile devices.

Information deemed more relevant to the user is placed front and centre, such as the latest products and news, whereas scrolling to the bottom reveals social media links as well as more support and business-related links, which would be not as important to the typical user.

https://twitter.com/

Twitter

Twitter’s dashboard is an example of a successful long-scrolling site — the navigation bar at the top is clean and simple, with limited options available. The page is split into three easy to read columns, with plenty of white space surrounding, making for a clean and modern look.

The site is an endless scrolling site, so information traditionally found at the footer of other sites is found in the right-hand column here.

There’s a clear hierarchy made by the use of different font sizes and boldness, as well as colour.

Twitter’s navigation system is so simplified, it works seamlessly across all devices — a must for any social media platform.

http://www.ipcc.ch/

IPCC

The IPCC’s website here is an example of a clickable, non-scrolling website. Despite having easy navigation tools at the top and in the sidebar, at first glance the site is cluttered and unprofessional. It’s not an awful design as thought has been put into readability and hierarchy — the use of colour as a guide for users is a common theme throughout the site. The site also includes drop-down menus and social media links in the navigation bars.

--

--