Chapter 9. Page Layout Tools:Tables and Styles | Creating Web Sites: The Missing Manual

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 Webthey 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-tablebased 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 planning, you can even create flexible pages that can be completely rearranged without touching a line of HTMLall you need to do is modify the linked style sheet. (See Chapter 6 for all the details on how to get started working with style sheets.) But style-based layout isn't perfect, and there are a few browser quirks and compatibility problems that everyone still has to contend with.

In this chapter, you'll learn how to use both table-based and style-based layout.

Note: Overall, style-based layout is the most elegant, and neatly structured, approachit's the wave of the future. Table-based layout has remained around, thanks to the compatibility it offers with old browsers, and for a few special scenarios where style-based design is unnaturally difficult. But that doesn't mean you should think about ignoring tables altogether. You'll still use them for laying out dense grids of information.