An Overlooked Tab-oo in LibGuides Design

Are you guilty of this?

Rows and rows of tabs. I’ve noticed a lot of LibGuides that go crazy with the tabs.

Tab hoarding is tab-oo when it comes to web site design. Today, I’m going to try to remedy that situation by going over best practices in tab usability.

First of all, when tabs are used properly, they improve the usability of a web site. Content is better organized and navigation is intuitive. Tabs help reduce the visual clutter that too much information creates on one page.

Here are some usability guidelines for tabs:

• Limit to one row of tabs. Stacked rows of tabs are more difficult to navigate and impair a user’s spatial memory. If you find yourself with multiple rows of tabs, you can either consolidate with drop down menus, or break up the LibGuides.
• Make labels short. Limit labels to 1-3 words of plain language. Users should be able to predict the content behind the tab.
• Use highly contrasting colors. Use a highly contrasting color that clearly sets the current tab apart from the inactive tabs. Make sure there is sufficient color contrast between label and tab as well. Want to know what your web page will look like to a color blind person? Check out the Colorblind Web Page Filter.
• Use title-style capitalization. ALL CAPS can be difficult to read for longer words.
• Arrange tabs in logical order.  The order should make sense to users (not just librarians).
• Scope of content should be reflected in tabs. Users should be able to understand exactly what the LibGuide encompasses by looking at the tab labels.
• Tab content should reflect label. If you are having difficulty in creating well-defined groupings for each label, then tabs may not be the answer.

Resources:

Tabs, Used Right by Jakob Nielsen

14 Guidelines for Web Site Tabs Usability from the Usability Geek

Showcase of Well-Designed Tabbed Navigation by Matt Cronin, Smashing Magazine

Usability.gov