HTML Howto, Amiga Computing 87, June 1995
Writing WWW Pages
WWW pages are made up of HTML, which is just ASCII text with embedded commands called tags.
Tags for HTML are embedded in between less than and greater than signs (<>) and control the appearance of the document on screen. Some require switching off after their usefulness is finished, for example the title of a document is set by <TITLE> and the end of the title is designated by </TITLE>. We’ll take a look at quite a few of these tags in turn.
First of all, all Web pages should be enclosed in an outer tag showing that they’re HTML. For this, the <HTML> tag is used as the first element of your document, with </HTML> at the end. On some browsers this is not necessary but for future compatibility it really should be included.
Web pages currently have two sections within them, these being the header and the body section.
First comes the header of your page which tells your browser about the title of the document as appears in document title (surprisingly) and other data such as the absolute path for this document. This is enclosed in <HEAD> and </HEAD> tags. Inside the head, you’ll want to give your document a title, an example being <TITLE>Home brewing for the hard of thinking</TITLE>. There are more elements that can be put in the head. For a full list, see the URLs provided in the references section.
Next off comes the body of the text, and this is where it all happens. The <BODY> and </BODY> tags should be used to define the start and end.
Inside here, all text is freeform which means that entries such as tabs, multiple spaces and carriage returns are translated into a single space which can be useful most of the time but a right pain for some things.
To get around this, a paragraph break is inserted into the text using <P>. This is an HTML tag that does not have to be turned off as it merely specifies a break, not a paragraph. Similarly, the <BR> tag forces a line break in your text but does not insert a blank line like <P> does.
For text formatting, HTML doesn’t allow you to specify explicitly the name of the font and size of font to use, but has a range of predefined styles. For headings, there are five levels of strength, ranging from <H1> to <H5>, all of which must be turned off with </Hn> when finished.
Bold and Italicised text are also available in more than one way. HTML defines logical styles as well as physical, so for bold text either <STRONG> or <B> can be used. Italics has the same strangeness, with either <CITE> or <I> being used. We’ll look at the whys and wherefores of this later.
Pretty pictures in your text
To insert an in-line image into your text, the tag <IMG n> is used, with n being either one or many subtags. The most important one is SRC=”filename” where filename is the name of the file to use. This brings up the important topic of relative filenames: to go back a directory, you MUST use the *NIX ‘../’ to go back otherwise some systems will interpret ‘/’ as the equivalent of ‘:’ on the Amiga – ie the root directory. For HTML, the directory separator remains ‘/’, though.
The other two important tags that can be defined inside <IMG> are ALIGN=pos to align the text following the image with either the top, middle or bottom of the picture (with pos being TOP, MIDDLE or BOTTOM) and the other being ALT=”text”, where text is the text that will appear on a non-graphical Web browser, such as Lynx.
Note that the inline graphics files have to be in GIF format to be decoded by all viewers.
Lists, lists and lists
Mosaic supports various formats for lists, too. The most common are the ordered list, unordered list and definition list.
Ordered lists are started with the <OL> tag, have the entries preceeded by <LI> (with no </LI> tag) and the list is finished with </OL>. An ordered list is a list that has a number preceding all list entries.
Unordered lists are exactly the same, with <UL> and </UL> replacing the <OL> and </OL> along with bullets replacing the numbers.
Definition lists allow a definition title followed by a description of that title to be listed. <DL> starts the process off, <DT> defines the definition title and <DD> describes the definition linked to that title. </DL> turns off the list and as before there is no need to use </DT> or </DD> at the end of the titles or definitions.
Making the links
The anchor tag allows for points inside a document to be labelled and for links to other URLs (uniform resource locations) to be made. To define a label inside a document, <A NAME=”name”> is used, and I’ll leave you to guess what replaces name.
The interesting bit is making links: this is done by <A HREF=”url”>, where URL is either a full URL (such as http://agora.leeds.ac.uk/csznml/Intro/author.html”> or relative, such as ../beer.html. The elements then to make the link follow, and the link command is closed with </A>.
A URL does not have to be an HTML document – it could be a picture, sound file, postscript file, an FTP link, GOPHER link or many more. See one of the references for more information.
Other Bits
Horizontal rules run a line horizontally across your document and are used with the <HR> tag. Another useful tag is the <ADDRESS> tag, which is a logical text style that should be used to sign your documents. This one needs turning off after use.
There are many, many more tags but these are the ones that see most use. For more, see the references again.
