3.  How do I learn all the HTML "tags"?

  

Section Summary

• What are Markup Tags?

• How is the Web different from hardcopy?

• What resources can I use to learn tags?

• What can I learn from books?

• What can I learn from on-line tutorials?

• What can I learn by theft?

---

What are Markup Tags?

HTML files are standard ASCII text files, containing both the characters that will be displayed on the reader's screen and also "markup tags" that instruct the browser software how to display that text. HTML tags are text enclosed in "angle brackets" (constructed using greater-than and less-than symbols), like this: <TAG>. You don't have to use capital letters within tags, but it does help to make them stand out within the text of your document when you come back later on to revise it.

The tags can perform several functions:

• Identify the structure of the document (e.g., section headers, blocks of text such as extended quotes, bulleted lists).

• Provide explicit instructions to the browser as to how to display specific portions (e.g., boldface, italics, fixed-pitch font).

• Tell the browser where to display embedded .

• Create links within and between documents.

Whenever your web browser asks a web server for a document, the server sends the browser a copy of the HTML source for the requested web page. The browser, in turn, parses the source and displays the formatted page on your screen. It is the browser that interprets and knows the meanings of the tags in an HTML source file.

HTML markup tags come in two flavors, free-standing and paired:

• Free-standing tags typically either cause an immediate effect, or apply until a contrary tag is found.

  Here is an example of a free-standing tag in HTML:

  <HR>

  This tag causes the browser to move to a new line, draw a horizontal rule (a straight line between the margins, such as immediately follows this paragraph), and move to the following line.

  ---

  We will discuss horizontal rules in more detail later.

• Paired tags enclose a block of text to which they apply. The two tags of a pair have the same keyword, but the closing tag starts with a slash character. This will become clearer as we work our way through an example of a paired markup tag in HTML.

After getting the HTML file, the browser processes the characters one at a time, displaying them until it finds a "<". At that point, the browser knows that the text following the "<" symbol is a markup tag. It then reads more characters until it finds a ">" symbol. Then, the browser attempts to decipher the material between those angle brackets, interpreting it as a tag. If it can find that tag on its programmed-in list of rules, it formats the text that follows it accordingly. If it cannot find that tag on its list, it ignores it. So, any text that follows a markup tag is formatted on your screen according to the rules for that tag, as they are programmed into your browser.

Let's see an example in action. First the HTML:

This is some text <BLINK>and some other text that I want to blink</BLINK> followed by some more text that I don't want to blink.

Second, the above will look like the following when parsed and displayed by the web browser:

This is some text and some other text that I want to blink  followed by some more text that I don't want to blink.

Your web browser reads in the <BLINK> tag, formats the text that follows it accordingly (in this case, we asked it to make the text BLINK), and then reads in the </BLINK> tag and stops that formatting, in this case turning BLINK off.

So now you have learned two things:

1. How a web browser formats web pages based on markup, and

2. How annoying the BLINK tag is.

How is the Web different from hardcopy?

When you publish a book or pamphlet in hardcopy, you have complete control over what the reader will see: paper texture, typeface, size, color, placement on the page, etc.

When you publish on the Web, you have only the most limited control over what the reader will see. You don't know whether they have a 21-inch high resolution color monitor or are using a monochrome terminal with 24 rows of 80 characters each. You don't know whether they are using Netscape with the standard settings, or whether they have configured it to ignore your suggestions about background color, and so on.

What you do have with HTML is the ability to markup your text, indicating the structure of the document. For example, use the paired header tags (<H1> . . . </H1>) to enclose the highest level section-header, instead of enclosing it with tags that some browsers would interpret as calling for a larger and boldface font. All browsers understand header tags, and will do the best job that they can with the resources available to them to display your document in way that is consistent with their display of other properly marked documents.

What resources can I use to learn tags?

There are a number of resources that you will be able to call upon as you learn HTML, including books, on-line tutorials and references, and other web authors. Perhaps the most valuable will be the web itself: any web page you are looking at has all of its HTML source already copied onto your hard disk, and your browser will permit you to examine that HTML source (e.g., the "Document Source" choice from Netscape's View menu) or preserve it (e.g., the "Save As ..." choice from Netscape's File menu).

What can I learn from books?

You could, of course, learn it all from books, but learning HTML is rather like learning to swim: it is very hard to do it just by reading a book; some practice is necessary.

Books do make good references. For example, there are a multitude of special characters that you can display with the right embedded codes. Remembering most of them is silly when you have a reference convenient.

What can I learn from on-line tutorials?

Various people have published on-line references and tutorials for web authors. Consult with your own computer support organization. You are, of course, welcome to take a look at the information that Ohio University Computer Services publishes:

http://www.cats.ohiou.edu/~acatec/webauthors/

What can I learn by theft?

As you wander through the web, take note of pages that you think work particularly well, and of pages that you think work particularly poorly. If you are in any doubt about the tags that produce those effects, choose "Document Source" from the View menu, or "Save As..." from the File menu, and examine those tags.

The content of Web pages can be, and usually is (implicitly if not explicitly) copyright. The HTML tags that control the display of that content are not copyright. The tags and their effects are part of the international HTML standard.

It is obvious why you should take note of pages that work well, and the tags that were used. Why should you pay attention to the pages that work poorly? It is much easier to recognize shortcomings in other people's work. Once you have figured out why you don't like a particular Web page, you may well have a flash of insight and realize that some of your own work suffers from the same problem.

  

Dick Piccard revised this file (http://ouvaxa.cats.ohiou.edu/~piccard/oacrao/tags.htm) on November 11, 1997.

Please send comments or suggestions to piccard@ohiou.edu.