Ode to The Sidebar

Ode to The Sidebar

Do you love or hate sidebars in website design? To find out what we think here at AndiSites, here’s our Ode to the Sidebar.

The AndiSites Ode to the Sidebar

Ah, the website sidebar.
Holder of secondary navigation,
Keeper of ad space,
And container for random things
You don’t
Where else to

In our blog post Website Sidebar: Yes or No, we concluded that they’re not absolutely necessary, but if you decide to have one (or two!), then you should use them well.

Content matters. So does location.

Managing a Website Project

How to Use Sidebars

Here’s a few good takeaways from our friends at Webdesigner Depot:

  • Navigation elements (e.g., WordPress Custom Menus) should go in a left sidebar. Some sites put their primary navigation on the left, but it’s better used for secondary navigation:  additional navigation items or categories that help the user but don’t fit into the main navigation area (typically displayed at the top of a site).
  • Right-hand sidebars are more common, but their content is likely to be missed. Eyeballs don’t naturally land on the right-hand side of a web page, so don’t put important information there. Note that ads placed on the right hand side cost less than ads located in other places on a page. That should tell you something.
  • They are good for highlighting additional interesting content. You can include links to related posts or pages, leading users further into your site.
  • Dual sidebars are an option, but use with care. Using left and right sidebars easily results in information overload. Be sure that the most important items are in the left sidebar. Use the right one for less-crucial elements like social media links and RSS feeds.

As mentioned in our ode to the sidebar, they are still popular! We love them for secondary navigation on information-heavy sites and “persistent” information like APPLY NOW buttons, search boxes, and shopping carts. They look lovely on mobile-responsive websites, becoming nice little “chunks” set apart from your main content.

In addition to information hierarchy – placing more important information on the left and less important on the right – you must also consider how your site reformats on mobile devices.

“Restacking” typically happens left to right. This means that on a mobile device, your left sidebar appears above your main content, which appears above your right sidebar.

If you have plentiful page content, and you place important items like navigation on the right hand side, users are unlikely to see it without scrolling down the entire page.

Ode to the Sidebar Epilogue

Properly placed sidebars
Help your users.
Helped users are happy users.
Happy users become
Happy customers.

Check out all the blog posts from AndiSites about Designing Websites!

Share and follow us on social media:
Visit Us
Follow Me

Subscribe now for useful information from AndiSites:

* indicates required

You might also enjoy

How Can We Help You?

We listen. We're different. You'll see.