Class 03: HTML: A Formal Markup Language

Held Thursday, January 25, 2001

Summary

Today we begind to ground our understanding of dealing with the computer with hands-on practice. In particular, we'll look at some of the procedures necessary for building documents for the World Wide Web.

Assignments

• Homework 1 (due Feb. 1).
• Read Beginning Scheme for tomorrow's class
.
• Skim The DrScheme Lab for tomorrow's class.

Notes

• If you don't feel that you can understand the DrScheme lab without a computer in front of you, that's okay, you'll work with it on Friday.
• A few of you have asked for printed copies of course materials. If you let me know that you want them, I'll try to have them available before class.
• Are there questions on the reading on HTML?
• If you had some problems with the MathLAN lab or the Blackboard lab, feel free to work on that lab and ask me questions.
• William's sick again, so I'll be heading home directly after class. Send me email if you have questions.
• I've read more of your introductory surveys and have started to write responses (although they're not yet online). I've also noted some issues.
  • Many of you seem scared of the course, particularly because you have "too little" computer experience. Don't worry! I don't expect you to have done much on the computer. The course was designed (at least at first) for people who'd never used a mouse when they started.
  • A few of you said that your best study time is "During the last-minute panic a few hours before class." Whiel that's my best time to work, too, my experience (that is, my experience looking at student work) suggests that you won't get your work done if you rely on last-minute work.
  • A few of you said that you are "freshman" and "sophomores". What school do you attend?
  • A few of you need to work on your grammar. For example, couple is not an adjective and plurals typically do not have apostrophes.

Overview

• About HTML
• Logical vs. Physical Markup
• Lab: Writing Documents for the World Wide Web

A Brief Introduction to HTML

We may not cover this section explicitly, but it gives you some things to think about.

• HTML is the markup language used for the World Wide Web.
• Unlike a programming language, which describes algorithms, HTML is simply a markup language. Markup languages describe data.

Representing Computerized Documents

• Some of the same questions come up as you consider how the computer might represent any document. For example, a typical word-processed document will have different margins, font, and justification at different parts of the document.
  • Should a human be able to tell what's going on; or can it all be computer gibberish?
• What do you have to represent in a document? Nearly everything:
  • The content of the document
  • Something about each piece of the document
  • General document characteristics (e.g., page margins)
  • ...
• We say that a language for representing documents includes mark up symbols that indicate these characteristics.

Logical vs. Physical Markup

• In considering markup, there are two general philosophies for what you mark: logical markup and physical markup.
• In logical markup, you indicate the role of each piece of text. For example, you might indicate that
  • This is a paragraph
  • This is an important word or phrase
  • This is a quotation
  • This is the title of a book
  • This is a top-level section heading in a paper
• In physical markup, you indicate the appearance of each piece of text. For example, you might indicate that
  • This should appear in Times Bold 12pt
  • This should appear in a box 2 inches each side that is placed 3/4 inch from the top margin and 5 inches from the right margin
• I'm a strong proponent of logical markup. Why?
  • Different people have different expectations about the appearance of certain logical items
  • Physical appearance does not necessarily indicate the logical role, even when the author of a document may intend you to do so.
• Consider book titles. What should a book title look like in a formatted document?
• Consider italicized words. Why do you expect to see a word (or words) in italics?
• I also worry that too much emphasis on physical markup leads non-designers to commit unreadable documents.

HTML Basics

• HTML is a simple markup language created for the World Wide Web.
• HTML is intended to be human readable.
  • Some would dispute that claim.
• HTML is a particular form of SGML, the Standard Generalized Markup Language
  • SGML was designed by a number of scholars for representing electronic manuscripts.
  • Full SGML can even describe layout of pages so that one can precisely represent documents like the Talmud.
• In HTML, parts of the document are surrounded by tags.
  • Tags give information about those parts of the document.
  • Each tag begins with a less-than sign and ends with a greater-than sign.
  • End tags have a slash after the less-than sign.
• For example,
  • You begin a paragraph with <p> and end a paragraph with </p>.
  • You begin an important word or phrase with <em> and end it with </em>.
  • You begin a list of items with <ul> and end it with </ul>.
  • You begin an item in that list with <li> and end it with </li>.
  • You begin a numbered list with <ol> and end it with </ol>.
  • You begin a piece of text in a typewriter font with <tt> and end it with </tt>.
• Some tags do not require end tags. Some even disallow end tags. For example,
  • <br> is a line break. Since there's not text that you're marking, it needs no end tag.
  • <br> is a horizontal rule.
  • The <li> tag does not need an end tag (since the next <li> or the ending <ul> obviously ends it).
• Some tags permit you to enter parameters: more information about how the text should be displayed. For example, you can write
  • <p align="right"> for right-justified text
  • <hr width="75%"> for a less-wide rule
  • <font face="Helvetica" color="Red"> for red, Helvetica text.

Lab

Preparation

Are there questions on the lab?

Lab

Do the HTML lab. Raise your question if you have a hand. If you don't finish it all today, try to work on it tonight (or later).

Complete understanding of this lab is not required to progress to the next lab. However, you'll need to understand all of the lab in order to do homework 1.

Reflection

What have you learned today?