Dreamweaver CS5: The Missing Manual

Chapter 3. Text Formatting

Getting text onto a web page (Chapter 2) is a good start, but effective communication requires effective design. Large, bold headlines help readers scan a page’s important topics. Colorful text focuses attention. Bulleted sentences crystallize and summarize ideas. Just as a monotonous, low-key voice puts a crowd to sleep, a vast desert of plain HTML text is sure to turn visitors away from the important message of your site. In fact, text formatting could be the key to making your Widgets Online 2009 Sale-a-Thon a resounding success instead of an unnoticed disaster. Figure 3-1 shows two model examples of good—and bad—text formatting.

Text formatting is actually a two-step process. First you apply the appropriate HTML tag to each chunk of text, and then you use Cascading Style Sheets (CSSes) to make that text look great. You add the HTML tags not so much to format the text (though they can do that, with the undesired side effect that different browsers can interpret the tags differently), but to structure the text into logical blocks. Once you identify those blocks, you can use Cascading Style Sheets to format them to your liking—and not just in the current page, but across your site. That’s one of the big benefits of Cascading Style Sheets.

For example, you’d use the <h1> (Heading 1) tag to indicate the most important heading on a page, while you’d use the <ol> (ordered list) tag to list a series of numbered steps. This process of structuring your text with ...