Dreamweaver CC: 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 spreadsheet-like format. 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 used as a back-door 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 (so 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. Dreamweaver’s advanced CSS tools make building well-designed pages much simpler than table-based layout. You’ll learn all about CSS ...