ThemeKit Navigation [1]

Responsive Website Navigation

Website navigation has changed over the years due to the fact that most websites are responsive.
The traditional horizontal row of links - with or without dropdowns - is no longer considered to be efficient at encouraging visitors to click through to other pages of the website.
Navigation should be vertical and appear front and center when opened - especially on mobile devices.

  • The navigation links should be vertical and appear front and center in an overlay for the best performance and ease of use
  • Links should have a spacing control to allow the required clear radius around an active item per Google's requirements
  • Use a background hover animation rather than a change of font color
  • Directories should be avoided as they cause confusion
  • Websites with up to about 50 pages should show the links to all of them
  • Larger websites should use a directory menu for navigating to sections of the site.
  • A directory menu should ideally have images relevant to the content

Navigation Design

The navigation is an integral part of the website so its design style is as important as its function.
Make sure it has smooth transitions for hover and click.

Footer

The footer if properly designed can also be an essential part of the website navigation. Most websites use a ridiculously large footer which is just a waste of space and an inconvenience for small mobile device users.
A footer needs to have easy to find links for the info page, phone function if appropriate, copyright notice and spam protected email function.

  • Link to info page
  • Optional phone number/phone call function
  • Copyright notice with auto update
  • Spam protected email function
  • Smooth scroll to the top function.
  • Show/hide function to make it easy to bring into view

Footer Info

All the other stuff that usually gets packed into those redundant footers can be inserted into an info page that is link to from the compact footer bar.