LESSON 4: GETTING STARTED IN HTML

Study the index cards on Getting Started in HTML. I've included a hard copy of these index cards, for your convenience. Be sure you can answer all the questions!
- What is a "tag" in HTML?
- What are "CONTAINER" tags?
- What's the structure of an HTML tag?
- In the tag , what is the tag name? What are the attributes?
- Give an example of a container tag.
- What is a "STANDALONE" tag?
- Give an example of a STANDALONE tag.
- Are tags names case sensitive?
- Write the code that will make   appear on your web page! That is, I should see an opening angle bracket, the letters "br", and then a closing angle bracket.
Do Worksheet #4 on Getting Started in HTML. (Here, you'll begin a good online tutorial.)
Set up your screen (browser, Simpletext, personal file folder) and try out the italics container tag, the   tag, and the <hr> tag. Try typing the <hr> tag as <HR>, <Hr>, and <hR>, and see if it affects the result.
For the computer part of the quiz over this lesson, you must be able to write the code that will produce the following output. Notice the extra spaces around the "break" tag. Notice the italicized word. Notice the horizontal rule that is separating the two lines.

The tag is an example of a standalone tag.

You can type or or or and they'll all give the same result.
Read pages 17–21 (up to "Flexible Design") and answer the following questions. Be sure to mark where you find the answers in your book, for 5 points on the Lesson #4 quiz!
1. What is one of the most vexing aspects of web design?
2. What are some of the devices (other than a standard computer monitor) that your audience may be using to view your web page?
3. What are some typical monitor sizes?
4. What does the phrase "monitor resolution" refer to?
5. What is the advantage of having a higher resolution?
6. What is the highest resolution listed on page 18 of your text? Multiply the numbers together to see how many pixels ("dots") are available on this highest resolution!
7. Does a bigger monitor necessarily mean a higher resolution?
8. Suppose you've designed your web page on a monitor with a 1280×1024 resolution. How is it going to look when displayed on a same-size monitor that has a smaller resolution?
9. Here's a math problem for you. Suppose my monitor is 640 pixels wide and 11 inches across. I design a picture that has width 200 pixels. How wide will it appear on my screen? How wide will it appear on a screen that is 11 inches across, but only 512 pixels? (You must be able to do calculations like this. We'll do some in class! Take notes!)
10. Are web measurements made in pixels, or inches, or some other measurement?
11. What does "live space" refer to? What cuts into the "live space"?
12. Study Figure 2-1 on pages 20 and 21. On IE5, how many pixels high is the Title bar? How about the Address? On IE5 for Macs, how many pixels high is the Title bar? The Location?
13. Study Table 2-2 on page 19. What is a "worst case scenario" for the available space using IE5+ on a 640×480 monitor in a Windows environment? How about using IE5 on a 640×480 monitor on a Mac?

THE QUIZ OVER THIS LESSON WILL CONSIST OF:

(10 pts) Write the HTML code that produces these two sentences:

The tag is an example of a standalone tag.

You can type or or or and they'll all give the same result.
(5 pts) Show me that you've marked the answers to all the questions in your text book!
(20 pts) Questions from the index cards and reading (see below).
There will be 12 randomly-chosen questions; you will cross off 2 questions.
The remaining 10 questions are worth 2 points each.

Prepare for the quiz over this section by practicing below.
Questions are asked in random order.
You can generate a printable quiz with solutions.