Learning html

Learning HTML

Today, the students began learning HTML. They had copied pictures from the Internet in the previous classes (see the on-line materials); in the first HTML lesson, they learned how to put those images into a web document.

The first thing we did was to learn how to open those images with Netscape. They were guided through the procedure: Choose Open File from the menu, then access the floppy disk. Change the file type (in Japanese, "file shuri"), and then select the image. I told them to write down the name of the image exactly as it appeared.

In making their homepage, first the students opened up WordPad. (From Start, to Applications, to open WordPad. On Japanese OS, it is all written in katakana.) I wrote the basic minimum on the whiteboard, and told them to copy it, substituting their own name in place of mine, and their own image name:

<html>
<body>
<h1>Bill's Page</h1>
Welcome
<p>
<img src="image.GIF">
</body>
</html>

(We'll do the <head> tags later. For now, all I wanted was for them to type in a bit of code and get a result quickly. We'll also address the width and height parts of the image tag at a later date.)

When finished, they saved the page on their floppy disks as name.html, with their own name inserted for "name", no spaces. Then, they opened it in Nescape to view the results.

Over the course of the next two lessons, they were introduced to the other aspects of the <body> tag. At first, we did colors with names, such as <body bgcolor="black" text="yellow">. In the third lesson, we looked at RGB colors, using a color chart.

In making links, the first one we did was an e-mail link.

<a href="mailto:billp@gol.com">Send me an e-mail message</a>

This was also the time to teach link colors. They learned:

link (colors of links)
alink (active link, the color when someone clicks)

Later, when they learned how to make links to sites, they also learned:

vlink (visited link, the color of a link to a site the viewer has already visited)

So, by the end of the week, their documents had full <body> statements:

They enjoyed it very much. The conceptual gap, I think, is in writing in WordPad and viewing with Netscape. One or two have difficulty sorting it out. The rest seem quite comfortable writing changes in WordPad, then reloading the page in Netscape to view those changes.