I am sure the first thing you will notice is the font type and size are different on this page than on the last few. Secondly, you will note the images on this page as well. Lastly, the music. Which would you like to learn to do first? Fonts? Images? or Music?

FONTS!

Let's start with the font. By default, both MSIE and Netscape will use TimesNewRoman at a size of 3 on an html document. You have already learned that you can choose the color of the text by changing the color codes in the body tag. What I didn't tell you is that you can also change the type and size of the font by adding another "tag set."

This "tag set" looks like this:

Where you see the word Arial in quotations, you can choose whatever font style you like. You can even put in several, each name followed by a comma and a space. It is important to note, though, that a viewer will only see a font you choose, if that font is installed on their computer. Choose carefully, most folks have a limited set of fonts installed. Try basic fonts such as these:

If you want to use a more dramatic font, I suggest making it an image, and using it thus. I have asked this document to use Lucida Casual or Comic Sans MS. If neither are installed on your computer, you will see only TimesNewRoman.

IMAGES!

I think images are the most important thing about a web site. Unfortunately many people go too far. There pages are over crowded with images...even more so with animated gifs! To make your page look neat and load quickly, use a minimum of images. Even more important, use the proper tag for an image.

If you looked at the code of this page, you would only see the image name in the BODY tag for the background image. That is all you need. However, for the blue floral line, the image tag is quite different. Here is what it looks like:

Note the only spaces inside of this tag, are between the name of the image and WIDTH, as well as between the WIDTH and HEIGHT and HEIGHT and ALT. Lets break this tag down into its 4 parts:

Using height and width tags will make your page load faster. For every image on your page that does not have these tags, the browser will "stall" while loading and let the computer determine the size of the image.

There is only one other part of an image tag I haven't mentioned. This attribute is only needed when your image is going to be a link. It is BORDER=0. This eliminates a "link" border-color around your image. Let me show you what I mean:

The image on your left does not have BORDER=0 in the image tag, note the unsightly blue border. The image on the right has a link and image tag that looks like this:

< A HREF="MAILTO:karenskorner@oocities.com" >< IMG SRC="mailboxwbirdhouses.gif" WIDTH="60" HEIGHT="100" ALT="mail" BORDER=0 >< /A >

Onward! It is time to set up some music!

MUSIC!

Now then, this is getting more and more tricky. The thing to remember here is that MSIE and Netscape do not use the same codes. Therefore, you have to program your page with both, so that all your visitors can enjoy the tunes.

The coding for MSIE is like this:

LOOP=1 will cause the song to run once. LOOP=infinite will keep it playing. Now if you want to enable Netscape users to hear the music as well, you need to add the tag for Netscape music which is this:

so that your whole tag looks more like this:

And you get a music box that looks like this:

(this console does not work)

Of course you can make the box smaller by adjusting the HEIGHT and WIDTH tags. Many folks use a simple small box by making the tag's size 15. Like this:

(nor this one)

Then your viewer needs to right click on the box to stop, pause or start the music.

This tag allows a very small console, but still has controls:

It looks like this:

There are many other things you can do with html, (such as frames, tables and forms.) I have started a page for those who want to learn more advanced html.