Homewood Bows Tabs to Enhance Web Site Usability
Not far from the offices of One to One’s Reno office is the West Shore of Lake Tahoe. A beautiful place where dramatic snow-covered mountains cascade downward in to the sparkling blue waters of one of the clearest, most breathtaking bodies of water in the world. Juxtaposed to this raw beauty are businesses that depend on the Web to communicate their brand to the wayward traveler looking for information to help them make informed decisions.
Last year, Homewood Mountain Resort came to One to One Interactive for a website redesign, which you may have read about here. Like many of our website design projects, we were tasked with organizing large amounts of information into a user-friendly format that satisfies both the client and their end user. A common practice we employ to accomplish this delicate balancing act are module tabs or user interface (UI) design patterns. Whenever possible, we strive to accompany these tabs with both text and graphics to improve the experience.
Smashing Magazine just recently published an article titled, Module Tabs in Web Design: Best Practices and Solutions. The article features Homewood Mountain Resort along with some other exceptional examples of module tabs being used to optimize web pages. Here is an excerpt from the article:
A module tab is a User Interface (UI) design pattern where content is separated into different panes, and each pane is viewable one at a time. The user requests content to be displayed by clicking (or in some instances hovering over) the content’s corresponding tab control.
Module tabs are seeing an increase of use as websites and web applications push for optimizing web page screen areas without sacrificing the amount of information presented at once. For example, in weblogs, they are used in secondary content sections (such as the sidebar) to present relevant and interesting information such as a listing of blog posts which users can interact with to get to web pages quicker. This inevitably allows for an unobtrusive and compact manner of presenting content.
This article discusses the use of the module tabs design pattern for use in websites and web-based applications. We share with you some best practices to consider when using module tabs, a listing of real-world examples of websites the take advantage of module tabs, as well as tutorials and free downloadable scripts for building and deploying module tabs in your sites.