Computerbank Victoria document repository

printer envelope
Home / Tutorials / HTML Workshop: HTML Basics

HTML Workshop: HTML Basics

Author: Kylie Davies
Date Created: November 2001, Last Revised April 2002
Editor: Con Validas 31/5/2002

What is HTML

HTML = hypertext markup language; a language that "formats" plain text to give it a "pretty" look.


HTML uses tags to format documents and to format text within documents.


All (just about) HTML documents have the file extension .html


The index.html file is the first file a web server will look for and display if no absolute file name and path is given.


By typing in the URL http://www.computerbank.org.au/ the file that will be displayed will be the index.html file. If we typed something like http://www.computerbank.org.au/latest-news.html the latest-news.html file will be displayed.


Tags can be turned <on> and </off>, except for special case tags (see below for special case tags)

TAGS that are *required* in a HTML document

<html> Indicates the start of the HTML document </html> Indicates the end of the HTML document.


<head> Indicates the HEADER section of the HTML document, within the header section we can put document identifying information, for example:


<title>The title of the HTML document will appear in the browser window title bar</title>


<Meta tag> Meta tags can be of different sorts, and can include things like descriptions for web pages </Meta tag>* This is not required.


</head> Indicates the end of the header section of the HTML document.


After the head section we start the body section of the HTML document. The body section contains the web page contents.


<body> Begin body of HTML document. </body> end body of HTML document.

Other HTML tags

<strong> bolds text </strong>
<i> puts text in italics </i>
<u> underlines text </u>


Special tags

<p> Indicates the start of a new paragraph. This tag does not need to be turned on or off, it is used as is. Some people prefer to turn it off. It does no harm if you include </p>


<br> Indicates a line break, again this tag does not need to be turned on or off, it is just used as is. It is optional to turn this tag off.


Links


<a href="link.html">linked text </a> where "link.html" is the URL or file location for the link and the "linked text" is the text that a person clicks on to go to the link.


Links can be to other web-sites or to other pages of your web-site. If the link is to another web-site, the link will assume a web address, eg: http://www.web-pagelink.org.au, if it is to a file the link will be to a file location on the web-server.


If all your web-page files are in the same directory - a link to a file will look like <a href="newfile.html">New file</a>


Links to email addresses are a little different and take the form:


<a href="mailto:persons.emailaddress@wherever.com">Persons name</a>


Images


Images can be put into HTML documents, these are treated as separate files and need to be uploaded with your web-page documents.


<img src="picture.name" height="n" width="n" alt="text that will be displayed as a mouse rolls over the image or if a person is surfing the web with images turned off"> where n = number of pixels.


Backgrounds


<body bgcolor="#hexdec" text="#hexdec" link="#hexdec" vlink="#hexdec"> where hexdec equals a color number/sequence.


There are hex-decimal converters on the web, you can also use some graphics programs (eg: gimp) color pickers to determine a hex-decimal number.


You can use the body background tag to set colors for the background of your web-page.

Make your own notes

Computerbank Victoria Inc., 483 Victoria St, West Melbourne, Victoria, Australia. 3003

© Computerbank Victoria Inc. GNU Free Documentation License - copying and distribution of Computerbank documentation is permitted in any medium, ONLY if this notice is preserved.