blink design library

Highlighting Timely Information

Epicurious.com reserves a portion of its global navigation bar to highlight seasonal information. Currently, this area displays a "Super Bowl" link (click image to see full size):

Visually, I think this works effectively because of visual weight given to the navigation bar (a deep, rich green) and the "white space" surrounding the seasonal link under Articles & Guides. I personally never fail to notice this link when I visit the site.

Using the link, however, is a bit tricky.  It's easy to accidentally roll your mouse over the hot spot for the fly-out navigation instead, which covers up the link. It takes a relatively precise mouse movement to actually click the seasonal link.

Ribbons

The ribbon in Office 2007 is clearly influenced by tab-based global navigation used in web sites -- complete with the concept of "Home."

From: Barnes & Noble

From: Excel 2007

Not surprisingly, the idea of a ribbon (essentially, a horizontally-oriented menu) is now showing up in web applications. Smartsheet, a web-based  collaborative spreadsheet, uses a ribbon-like approach for its menu of commands.

From: Smartsheet

I think we will see more merging of conventions between desktop and the web as the distinction between these two environments becomes less and less relevant.

'Top Items' Global Navigation

This site has a very narrow and deep structure. It handles this issue in the global navigation by providing "top items" in the dynamic sub-menu [1] with a clear "View All" link that takes the user the page listing all the occasion categories [2].

From: Gifts.com

Usable 'Fly Out' Menus

I like this example of "flyout" menus because the global navigation bar is visually tied to the submenu by using the same color (which also helps visually separate it from the page in the background). There is good visual feedback as well as to which item is selected and a large target area for each menu item.

From: Circuit City