Prev | Current Page 278 | Next

Craig Grannell

"The Essential Guide to CSS and HTML Web Design"


In this section, we??™ll cover using lists for navigation, styling list-based navigation bars, working
with inline lists, and creating graphical navigation bars with rollover graphics.
Using lists for navigation bars
Think back to what we??™ve covered to this point about semantic markup. Of the HTML elements
that exist, which is the most appropriate for a navigation bar? If you said, ???a table,???
go to the back of the class. Using tables for navigation bars might be a rapid way of getting
them up and running, but it??™s not structurally sound. When looked at objectively, navigation
bars are essentially a list of links to various pages on the website. It therefore
follows that HTML lists are a logical choice to mark up navigation bars.
USING LINKS AND CREATING NAVIGATION
195
5
When creating the initial pass of the website, just create the list as it is, along with all the
associated pages, and let people play around with the bare-bones site. This enables users
to get a feel for its structure, without getting distracted by content, colors, and design.
However, sooner or later, you??™re going to want to make that list look a little fancier.
Much of the remainder of this chapter is concerned with CSS and how it can be used to
style lists. From a plain HTML list, you can rapidly create exciting visual designs??”and ones
that are easy to update, both in terms of content and design. After all, adding another navigation
link is usually just a matter of adding another list item.


Pages:
266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290