2. Scalable Navigation

Provide site navigation that scales to any text size or content amount

The navigation of a Web site can often be the anchor for its design. It’s a page component that is as central and important as any. Traditionally, a Web designer might crack open a favorite image editor and lovingly craft some buttons, tabs, or text to be stuffed inside a few nested <table> elements. Additionally, JavaScript might be used to trigger rollover effects that swap a second set of images. In the end, the result might look great—but what lurks beneath the surface may not be so desirable, as we’ll see by investigating a common approach to building Web site navigation.

Let’s take a close look at an example based on the traditional approach to ...

Get Bulletproof Web Design: Improving flexibility and protecting against worst-case scenarios with XHTML and CSS, Second Edition now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.