Creating Web Sites: The Missing Manual

Chapter 9. Page Layout Tools:Tables and Styles

When HTML was first created, the focus was on delivering basic information: the score in yesterday’s ball game, the price of coffee beans in Colombia, reasons why the Macarena rules. As strange as it seems, no one thought formatting and layout tools were really that important. Fortunately, a few pioneering Web designers recognized the problem and set out to rescue the Web from the engineers who invented it. These Web-heads invented a number of clever workarounds that gave the HTML universe a much-needed blast of pizzazz.

The best known of these tactics is the invisible table. Using an invisible table, you can align content, pictures, and headings along the lines of an invisible grid. It’s impossible to overstate how important invisible tables were in the early days of the Web—they saved us almost single-handedly from a world of drab, plain text pages. But now that styles are on the scene, invisible tables are starting to outgrow their usefulness. Although invisible tables are still widely used, many Web developers find that they’re just too awkward to manage.

Today, invisible-table–based layout is slowly but surely giving way to style-based layout. Style-based layout uses the positioning rules of CSS to place panels, columns, and pictures in specific spots on a Web page. When you use style-based layout, your HTML markup is easier to understand, and you’ll have less trouble replicating your design across multiple pages. With a little ...