CHAPTER 4. HTML TAGS AND ATTRIBUTES 37
Presentational Markup(style) is worried only about what meets the
eye. It tells how you want certain things to be shown, how they look.
It includes tags for line break, bold, italic, strike-through, underscore. It
includes explicit coloring and sizing.
When you are first starting out with web design, the obvious first thing to
do is work on presentation. It is what people see.
Do you like the ability to copy and paste words from a PDF file into some
other document you are working on? If the PDF is simply a scan, you
cannot copy and paste the words, just portions of the image. But if the
PDF file came from a program, or if the scanner is smart enough, maybe
the words can be selected and copied. The fact that they are words and not
just smears of ink on a page, that fact goes beyond the presentation and
into the semantics (meaning).
Structural Markupidentifies the structure of your document. It includes
tags for things like headings, paragraph, lists, and tables. It goes a step
beyond presentation to begin revealing the meaning of the document. It
shows the relationships between the parts of your webpage.
Structural markup is focused on the relationships between pieces of a web-
page. Often this is incorrectly called “semantic,” but they are actually
different.
Semantic Markup(meaning) is a richer approach to telling what things
are. Often this is reflected in how they are displayed. It includes tags for
emphasis, title, header, footer, and navigation.
The long-term goal of structural and semantic markup is to help search
engines and other programs understand your contents, so they can help
everyday users like ourselves search for information and find it.
4.2 Tags
All HTML markup looks the same as this:
<tag att=val att=val att=val ...>
This is the HTML markup prototype. There is an opening angle bracket
(less than sign), followed by the tag, followed by zero or more attributes.
Then there is the closing angle bracket (greater than sign). Each attribute