Learning Web Design, 3rd Edition

CHAPTER 5 MARKING UP TEXT

IN THIS CHAPTER

Choosing the best element for your content

Using block elements to identify the major components of the document.

Adding line breaks

Comparing inline elements

Creating custom elements with the versatile generic elements, div and span

Adding special characters to your document

In the previous chapter, you learned the hows and whys of (X)HTML markup. This chapter introduces the elements you have to choose from for marking up text content. There probably aren’t as many of them as you might think, and really just a handful that you’ll use with regularity.

Before we get to the element roll-call, this is a good opportunity for a reminder about the importance of meaningful (semantic) and well-structured markup.

In the early years of web design, it was common to choose elements based on how they looked in the browser. Don’t like the size of the h1? Hey, use an h4 instead. Don’t like bullets on your list? Make something list-like using line break elements. But no more! Those days are over thanks to reliable browser support for style sheets that do a much better job at handling visual presentation than (X)HTML ever could.

You should always choose elements that describe your content as accurately as possible. If you don’t like how it looks, change it with a style sheet. A semantically marked up document ensures your content is available and accessible in the widest range of browsing environments, from desktop computers to cell phones to screen readers. ...