A Two-Page HTML Microguide

Most home pages on the World Wide Web are made using HTML, which is short for hypertext markup language. By today's language standards it looks ancient. It uses paired codes for its formatting of text and pages, i.e. one code to open and one code to close. This is similar to word processing programs, but you cannot see them except in WordPerfect. An example is <B>This is bold</B> which produces boldfaced words in a browser. It is consistent in its format with <COMMAND> to start the formatting and </COMMAND> to end the formatting. As usual, there are some exceptions as shown below. It is usual to place the command in upper case, although it is not essential, <command> is fine.

A HTML file must be simple ASCII (DOS text) or Windows ANSI file. It cannot contain any of the codes that are at the top of most programs. Any simple text editor will do. Any word processing program will do, except the file must be saved as DOS Text or ANSI Text using the File, Save As command or equivalent. Give the file a .HTM or .HTML filename extension, such as filename.htm.

The basic format of a HTML page, such as a home page, is:

<HTML>

<HEAD>

<TITLE>The title would go here. This is the name the web browsers see. </TITLE>

</HEAD>

<BODY> Usually the text colour and background colour are given right after the BODY command, such as <body text="#000000" bgcolor="#ffffff" >. A space is used as a separator. Without going off the deep end, after the "#" sign, there are three sets of numbers (yes, "f" is a number in hexadecimal (base 16) as in 0,1,2 ... 9, a, b, c, d, e and f). The first two give the red content, the second the green, and the third the blue. Zero zero is the lowest number and FF is the highest. "#ff0000" produces red letters.

The body text starts right after the > of body command. Because HTML browsers disregard all enters (hard returns) and more than two spaces, the actual look of the text does not matter. There are no margins. To the computer and browser, it is one continuous stream of data.

The paragraph handling is done with a <P> to start and ends with </P>. HTML always leaves a line between paragraphs. If you do not wish a blank line, then the line break command <BR> can be used.

<HR> puts in a "horizontal rule" or line across the screen. <HR SIZE=6> puts in a wide rule, with the sizes usually going from one to six. Note it is not paired.

Text sizes go from <H1>Very Large</H1> to <H6>Very Small</H6>. <B>Bold</B>, <I>Italics</I>, and <U>Underline</U> can be used to accent words.

<CENTER>The centre command centres text on a line. </CENTER>. There is also <RIGHT> Right </RIGHT>, <LEFT>Left</LEFT> <TOP>Top</TOP> and <BOTTOM>Bottom</BOTTOM>.

Bullet lists can be done by <UL> followed by a single <LI> (el eye) for each bullet item, such as <LI> Bullet 1 text;<LI> Bullet 2 text, etc. It is concluded with </UL>.

Most digital cameras produce photos that can be used on the web, and usually they are .JPG format. Graphics must be in a special format. The most used one is the CompuServe format of .GIF. Monitor screens work at 96 dot per inch so a continual problem will be to reduce the picture elements (pixels) of a photo or graphic file to fit the screen. There are a number of photo and graphic programs that can reduced the size of the file to fit the space available. If all else fails, use the width command given below to fit the photo or graphic into the space. The graphic format line is: <IMG SRC="filename.gif">. It takes time to make sure all the graphics show when the home page is created. After the "<img" and a space, it is possible to put in some controls such as width="100%", width="75" (in pixels), height="75" (in pixels), border="1", align="centre",etc. There is a lot of control available from these commands. They look like the following: <img align="center" border="4" width="25" height="50" src="filename.gif> or it could be a photograph such as "filename.jpg"

Links to other sites can be done. This is very useful and typical. It is done with <A HREF="path.filename">title of link which is displayed</A>. More descriptive words can follow after the closing "</A>".

</BODY>

</HTML>

Save the file as DOS Text or if it has accented characters as a Windows ANSI file. Give it a .htm or .html extension. Then view it using the browser. Note there is no need to go on line to a server. It can be viewed on your standalone computer in your browser using File, Open Page or Open File. Leave the browser open, go back and make any required changes in your text editor, then go back to the browser and choose the Reload button. It takes a while.

When viewing other home pages, they can be saved with File, Save As, usually with the extension of .HTM for PC machines. Whole sections of links or references are usually picked up and inserted in another home page (copyright laws not withstanding). Be careful because some browsers are case sensitive, i.e. INDEX.HTM is not Index.HTM, or Index.htm, etc.

Graphics can be "acquired" (copyright laws not withstanding) by viewing the source and finding the filename. Then the filename can be typed in the current address line.

A home page can be printed complete with graphics using File Print in s browser.

A home page should be checked out completely before loading to a server. You should use the File Print above to see it in hard copy as it is difficult to pick up the mistakes on the screen.

Your Internet provider will provide information on how to load the file or files onto the server. It is not hard. Remember the opening page of your website must be index.html or index.htm.

Good reference manuals are available, such as Using HTML by Neil Randall for Que Corporation. Look at the work of others to get good ideas.

Copyright 1996 by Lorne Bowerman, Nepean, Ontario