Articles > Guidelines for Designers

Navigational Elements

The main site navigation should always be positioned either to the top or to the side of the site. This is where people expect to find it which is a good enough reason, but it is also more controllable. You can guarantee that the navigation will be “above the fold” if you position it to the top, left or right. Positioning at the bottom of the screen should always be avoided.

If it is decided to place the navigation to the side it is much more common to position to the left rather than the right. This is actually counter-intuitive as in the West people read from left to right and so naturally rest their eyes to the right of the screen when they get to the end of a line. It’s generally best not to confuse users though so positioning to the left is recommended.

The site navigation should be one of the most prominent elements on the page and should be persistent across the whole site. This ensures that the user can see it and always knows whereabouts on the screen it will be. Avoid re-positioning the navigation from page to page.

When designing the look of the navigation bear in mind that each link needs to have three states: normal, active and current. The normal state is how it looks most of the time. The active state is what it looks like when the user rolls their mouse pointer over it. It gives them some feedback that it’s something they can click. The current state is applied to a link when a user is on that page currently eg. if they are on the “about us” page the current state will be applied to that link. You can use the same effect for the active and current states but it is less confusing to have a different one.

If help elements are required these should be positioned at the bottom of the screen in an area distinguished from other copy and should be presented as plain text. Pages that might be linked here include the terms & conditions, accessibility statement and site map.

« Return to articles index

Back to top