Dreamweaver CS6: The Missing Manual

Chapter 6. Tables

The HTML <table> tag has had a somewhat infamous existence in the world of web design. It was originally intended to present scientific data in a spreadsheet-like manner. But as the web grew, graphic designers got into the web design game. They wanted to recreate the types of layouts they saw in magazines, books, and newspapers (in other words, they wanted to make good-looking websites). The most reliable tool at the time was the <table> tag, which designers morphed into a way to create columns, sidebars, and, in general, to precisely position elements on a page.

Today, with nearly everyone on the planet using advanced browsers like Internet Explorer, Firefox, Safari, and Opera, web designers use a more facile page-styling technique—CSS-based layout. Table-based layout is an aging dinosaur that produces pages heavy with code (which means they download slower), harder to update, and hostile to alternative browsers, like screen readers, mobile phones, and text-only browsers.

This chapter shows you how to use tables for their intended purpose: displaying data and other information best presented in rows and columns (Figure 6-1). If you’re a long-time web designer who still uses tables for page layout, you can use Dreamweaver and the instructions in this chapter to continue that technique. However, you’re better off making the switch to CSS-based layout. Dreamweaver’s advanced CSS tools make building well-designed pages much simpler. You’ll learn all about CSS layout ...