PrestaShop Themes

3 Important Considerations for a Sidebar that Works

Advertisement

If you have a website, or design them for clients, you are undoubtedly familiar with sidebars. Usually a mere afterthought, sidebars actually require some planning and a bit of strategy to maximize their benefits. While they are not a necessity for every website, sidebars can be a useful layout tool, helping to keep important information above the fold, and at the users’ fingertips at all times. So if you are thinking of utilizing a sidebar on your website or blog, here are three things you should think about during the process.

website layout design - white chalk sketch on a vintage slate bl

1: Is a sidebar necessary?

As in every important design decision, you must first ask yourself how necessary it is to even include a sidebar. After all, every element of a web page should be born out of necessity. So ask yourself:

  • Do you have content that you want to keep “above the fold?”
  • Do you have content that you would like to keep in users’ view at all times (in the case of a sticky sidebar)
  • Does your site have advertising?
  • Is there content that you want to be seen, but doesn’t make sense to be at the top of your page otherwise?
  • Do you want a place for a secondary navigation? (Either for pages, or categories, articles, etc.)

If you answered “yes” to any of these questions, chances are a sidebar could be put to good use on your site. Sidebars are fantastic when you want to float any information, calls-to-action (CTAs) , or navigation elements to the top of the page. Without a sidebar, this info could seem out of place, and cumbersome to your end users. But by simply placing it off to the side, everything they need is right where they need it, without getting in the way of the unique content of the page.

2. To the left or the right?

While it may seem to be a matter of aesthetic, or personal taste, studies have actually shown that content on the left side of the screen is given more visual priority by the end user. In other words, whatever is on the left side gets more attention than whatever is on the right.

So you should put the sidebar on the left, correct? Unfortunately it is not so simple. Given that whatever information is presented on the left will be given more weight, you must ultimately decide what is more important: the page’s unique content, or the sidebar content.

In some cases, you will want the page content to take the lead, but suppose your major CTA is on the sidebar. In that case, it might be preferable to have that front and center.

Whichever side you choose, you need to keep the sidebar position consistent site-wide, so avoid the temptation to pick and choose on a page-by-page basis. The last thing you want to do is confuse your users from page to page.

3. Should it be site-wide?

While you want to keep the sidebar position consistent, you don’t necessarily need to include the sidebar on every single page of your site. Take this example:

Your portfolio website has a sidebar that you use to include your contact information, and your main CTA: a button that simply says “Hire Me.” That button is linked to a page which has a contact form. Your goal for the site is to funnel your potential clients to this page to fill out the form, and ultimately hire you as their designer.

Once you get people to this page, you would want to eliminate all distractions that would get in the way of your potential client filling out the form. So it would be a good idea to nix the sidebar in this case.

Simply put, any page that has its own conversion goal should not contain a sidebar. It would only get in the way of what you want your user to do. Remember, a confused mind usually says “no.”

Final Thoughts

Sidebars can be an excellent addition to almost any website. There is always important info that you want to keep in a consistent place from a user experience point of view. And if you have a clear CTA, a sidebar is an even better idea. Highlighting your CTA on your sidebar site-wide can lead to more conversions, particularly if you place it on the left side of the page.

Author Bio:

Wes McDowell is the creative director at The Deep End Web Design, located in Chicago. While not overseeing client projects, Wes has authored several books on graphic and web design, and also co-hosts “The Deeply Graphic DesignCast,” a podcast for designers.

skyje

Skyje is a Blog for Web Designers and Web Developers featuring Social Networking news and everything that Web 2.0. You can Subscribe to Skyje feed.