WEBJeannieCentral Page 2a

WEBJeannieCentral

- Basic HTML...

If you do not wish to write the HTML code yourself, please skip to the next page...

The basic HTML code for a web page is always the same:

<HTML> <HEAD> <TITLE>Title of your page</TITLE> </HEAD> <BODY TEXT="#00007E" LINK="#00007E" VLINK="#00007E" ALINK="#00007E" BGCOLOR="#ffffff"> This is what people will actually be able to read on your page... </BODY> </HTML>
Just copy and paste the code above into a text editor and save the file as index.html (some systems may require index.htm instead of index.html).
If you load this page into your browser, you will have a very basic page with one line of text: "This is what people will actually be able to read on your page..."

Using the editor, you can now add more text between the <BODY> </BODY> HTML tags of your page. To view the result of this, just save the page and hit the reload button of your browser.

Here are some more HTML tags that you may use on your page:

Use Arial (Windows) or Helvetica (Unix) as your text font Use a smaller font Use an even smaller font Use a big font change the color of the font (in this case, white) set font to Arial, small, white at the same time <a href="home.html">link to homepage</a> <a href="http://www.herrnsdorf.com/jeannie/">link to a page that is on another server (example 1)</a> <a href="http://www.yahoo.com">link to a page that is on another server (example 2)</a> <img src="image1.gif">add a picture to your page <img src="image1.gif" width="100" height="200" alt="My Picture" border="0">add a picture with no border, 100x200 pixels, and labeled "My Picture" to your page If you first copy and paste the page setting code and then the BODY code into an editor, the result should look like this:

<HTML> <HEAD> <TITLE>Title of your page</TITLE> </HEAD> <BODY TEXT="#00007E" LINK="#00007E" VLINK="#00007E" ALINK="#00007E" BGCOLOR="#ffffff"> This is what people will actually be able to read on your page... Use Arial (Windows) or Helvetica (Unix) as your text font Use a smaller font Use an even smaller font Use a big font change the color of the font (in this case, white) set font to Arial, small, white at the same time <a href="home.html">link to homepage</a> <a href="http://www.herrnsdorf.com/jeannie/">link to a page that is on another server (example 1)</a> <a href="http://www.yahoo.com">link to a page that is on another server (example 2)</a> <img src="image1.gif">add a picture to your page <img src="image1.gif" width="100" height="200" alt="My Picture" border="0">add a picture with no border, 100x200 pixels, and labeled "My Picture" to your page </BODY> </HTML>
If you load this page into your browser, you will not see the line "set font to Arial, small, white at the same time", because we've selected a white font on a white background. Let's change the font color to, say, red to make the line readable. The code for red is #FF0000. The new HTML code should look like this:

change the color of the font (in this case, red)
Save the page in the editor and reload it in your browser.

Some other color codes are #3366FF (blue), #000099 (dark blue), #00CC00 (green), and #FFFF00 (yellow). You can use these not only to change the font color, but also the background color and the color of the links. To do this, simply change the color codes in the BODY section of your page:

<HTML> <HEAD> <TITLE>Title of your page</TITLE> </HEAD> <BODY TEXT="#00007E" LINK="#00007E" VLINK="#00007E" ALINK="#00007E" BGCOLOR="#ffffff">
TEXT refers to the page's standard font color, LINK for links, VLINK for visited links, ALINK for active links, and BGCOLOR for the background color.

You will also notice that the image in <img src="image1.gif"> is not displayed correctly. This is because you probably don't have an image called "image1.gif" in the directory where you have saved your page. Change image1.gif to the filename of an image that you actually have - you can ONLY use gif and jpg images!

If the image is not in the same directory as your HTML page, you have to add "../directoryname/imagename.jpg" (or "../directoryname/imagename.gif" if your image is a gif file) to the filename to tell your browser where to look for the image. For example, if your page is in a directory called HTML and your image is in a directory called IMAGES (and both directories are on the same level of the directory tree), the code should look like this:

<img src="../images/image1.gif">

If IMAGES is a subdirectory of HTML, then the code is:

<img src="images/image1.gif">

When writing your HTML code, please keep in mind that most web servers are running under UNIX rather than Windows. Unix is a case sensitive operating system, which means Image.gif, IMAGE.gif, image.gif and image.GIF ARE NOT THE SAME FILE and the system will not find a file called Image.gif if you link to it with <img src="image.gif">!!!

You will find more information about HTML on Freeservers and Netscape and on the following pages.