EBlog

Some Best Practices for Tabbed Interfaces

September 18, 2007 | Posted by: Marty

There are times when a tabbed interface makes sense in the context of a information-heavy page, and times when using tabs can cause more confusion than clarity.

Our favorite AlertBoxer, Jakob Neilsen, has posted two examples of well-used tabbed interfaces from the redesigned Yahoo Finance and follows with his guidelines on using tabbed interfaces. These three stood out to me.

1. Use tabs to alternate between views within the same context - not to navigate to different areas

3. … If people do need to compare the info behind different tabs, then having to switch back and forth puts an added burden on their short-term memory and lowers usability compared to a design that puts everything on one big page.

8. Tab labels should be short and use plain language, rather than made-up terms. Tab labels should usually be 1-2 words. Short labels are more scannable; if you generally need longer labels, it’s a sign that the choices are too complicated for a tab control.

I think the most important thing to take away from this article is that if you want the reader to have a lasting impression of any content hidden behind a tabbed interface - then a tabbed interface probably is not be the best tool suited for the job. Especially if the content is being used for comparing one product with another or if the content is important to your main message.