Line25

Modern Examples of the Classic Sidebar Menu Layout

Read the full post

The sidebar menu seems to be coming back into fashion once again after it was left behind for horizontal navigation bars. The sidebar menu was most common back in the early days of web design, but these days we’re starting to see designers ditch the horizontal nav bar in favour of the vertical list once again. Nowadays though these menus are built with large icons or clever animation effects that allow them to slide in and out of view. Today’s web design showcase features 20 sites that all feature modern examples of the classic sidebar menu layout.

Mammoth Media

Mammoth Media

Wallmob

Wallmob

Electrik Company

Electrik Company

Hyperakt

Hyperakt

FLIPP

FLIPP

Niche

Niche

Q Ideas

Q Ideas

The Conference by Media Evolution 2014

The Conference by Media Evolution 2014

PUSH Collective

PUSH Collective

ZINDHAI

ZINDHAI

Georgina Bousia

Georgina Bousia

Sculpt Communications

Sculpt Communications

Gareth Emery

Gareth Emery

Drawtoclick

Drawtoclick

Broken Twill

Broken Twill

Kick Point

Kick Point

TriplAgent

TriplAgent

PFD

PFD

2Creative

2Creative

Design Council

Design Council

Free web shadows pack for every subscriber

Join the mailing list to have new content delivered straight to your email inbox. Every subscriber gets a free pack of realistic web shadows.

Written by Chris Spooner

Chris Spooner is a designer who loves experimenting with new web design techniques collating creative website designs. Check out Chris' design tutorials and articles at Blog.SpoonGraphics or follow his daily findings on Twitter.

9 Comments

  1. Teelah says:

    Love the side navigation on full width sites and so much better usability on mobile devices. Thanks for sharing! Are there any tutorials that you suggest for creating this menu?

  2. very very nice :)

    thanck you so much

  3. Noah says:

    Nice, though I’d like to see an article on how to handle / or examples on how to handle clients who insist on lots of sidebar advertising. How to prevent that kind of advertising from distracting the user.

    Thanks

  4. Kevin Mamaqi says:

    Thanks for sharing, now I’m working on a project with sidebar menu and this is helpful.

  5. Tom says:

    The screenshots you have on this page provide a nice impression of the designs used on each site. To fully appreciate their beauty, you really have to take the time to click through to each one and spend a little while there.

    Great list, thanks for sharing.

  6. Those are really minimal yet very effective sites. Thanks.

  7. very nic , good luck and tnx a lot

  8. My site have this kind of sidebar but every entry of this collection it’s better than mine! I should improve it!

Sorry, comments are now closed