Creating a Website: The Missing Manual, 3rd Edition

Fancy Menus

When rollover buttons were first created, they were wildly popular. There’s something irresistible about a button that lights up when you point to it. You can, however, have too much of a good thing, and stuffing too many rollover buttons on a page is a surefire way to create an overdone turkey of a website.

More recently, the Web’s seen a small renaissance in simplicity and a trend away from excessive rollover buttons. Part of the reason is the increasing complexity of websites—quite simply, a handful of rollover buttons no longer offers enough navigational aid for today’s typically complex sites. Instead, these sites use more detailed multilevel menus, replacing dozens of rollover buttons with a clearer, more streamlined set of hierarchical links.

A typical menu starts with a collection of anchor elements that you group together on a page. The key is to organize these links into logical groups. For example, the website for a company might include a group of product pages, a group of pages with contact and location information, and another group of tech support pages. By arranging links into groups, visitors can find what they’re looking for more easily.

So far, this menu design doesn’t require anything special. Using the linking skills you picked up in Chapter 8 and the layout smarts you gained in Chapter 9, you can easily create a side panel with a grouped list of anchors. But really neat menus add another flourish—they’re collapsible. That means you don’t see the whole ...