skip to main content
Select font family
Select colour theme
Profile picture - Ahmad Ainul Rizki Ahmad Ainul Rizki
Profile logo - Ahmad Ainul RizkiCD
  • Home
  • About me
  • Now
  • Portfolio
  • Blog
  • Components

Sidebar navigation

A look at the use of sidebar navigation systems in website design.

  • Follow me on Twitter twitterlink to twitter profile
  • View my Github profile githublink to github profile
  • View my Codepen profile codepenlink to codepen profile

Post link

bridgy link

Published on January 6th 2014 Ahmad Ainul Rizki

Over the last few months I have found myself reading more on more about conversion rate optimisation and thinking much more about how a websites layout can help improve a users journey and encourage them to either make a purchase or an enquiry.

In almost all of my recent design work I have decided to use a sidebar navigation instead of the usual horizontal nav across the header of a site. The main reason for this being the side nav, when given a fixed position will remain constant as the user scrolls down a page ensuring all of the websites links are easily accessible at all times.

Another advantage of the sidebar navigation is the extra space above the fold which can now be used to display the different sides of the business, calls to action and unique selling points.

Below are some examples of recent designs utilising sidebars to create a clearer and easier to use website.

Beautiful Type

Beautiful Type

Astrel Creative

Astrel Creative

Share on Twitter

Webmentions

These are webmentions via the IndieWeb and webmention.io.

No mentions yet.

  • Back to all posts
  • RSS feed
  • Home
  • About me
  • Now
  • Portfolio
  • Blog
  • Components
  • Follow me on Twitter twitterlink to twitter profile
  • View my Github profile githublink to github profile
  • View my Codepen profile codepenlink to codepen profile

Proudly powered by Eleventy. Hosted on Netlify, last updated September 15th 2020, at 10:55:45 - privacy.