HTML - The Basics

Linking Pages and Link Appearances

What makes HTML web pages useful is the ability to link one page to another. These pages may be at different locations, or locally in the web author's machine. The workhorse of most links is the <A></A> tag pair.

The links rely on filenames of files in the working directory. There are two main types of links, relative URL's and absolute URL's. An URL is a shorthand name for "Uniform Resource Locators". They can be thought of as being types of webpage addresses which guide the browser to the page you want your link to point to.

The Relative URL

This type of URL is most often used when refering to a document on one machine. On this machine are many files which you want to link to, however, they could be in many different directories. We first look at a link which is located in the same directory as the refering page. The refering page has the link to the file you want to see.

<A HREF="index.html">Index</A> This is the index page.
<A HREF="001.htm">Page 001</A> This is page 001.
Index This is the index page.
Page 001 This is page 001.

When creating links to another page, the HREF=" " is crucial to tell the browser that it is supposed to go in search of the file within the double quotes. After the angled bracket, the name of the link chosen by the author is given, then the tag is closed. Further comments can be added after the link to clarify things.

File in a subdirectory

When the file is in a subdirectory, we need to direct the browser into it to search for the filename you have given in the link.

<A HREF="new/mypage.htm">My Page</A> This is my page in the new directory.
<A HREF="001.htm">Page 001</A> This is page 001.
My Page This is my page the new directory.
Page 001 This is page 001.

This shows that 'new' is a directory name in the local working directory, with the file 'mypage.htm' residing in the 'new' directory. Take note of the forward slash "/". Click on the My Page link, and it will tell you about linking from a nested directory to its parent directory.


Files not locally held - Absolute URLs

When files are not locally held, you can to access them by using an absolute URL. This type of link contains the site name and/or subdirectories in which the page you wish to see is located. The beginning of the URL contains http:// string of characters. This is shorthand for 'HyperText Transfer Protocol' - a set of instructions which the browser makes to gain access to the page you're interested in.

<A HREF="http://ra.centrum.is/icerev/daily1.html">

Iceland Review</A> Daily News From Iceland
Iceland Review Daily News From Iceland


Link Appearance

The colour of the links can be predefined within the BODY tag as follows


<HTML>
<BODY BGCOLOR="#FFFFFF" TEXT="#000000"
LINK="#FF0000" ALINK="#00FF00" VLINK="#0000FF">
<A HREF="000.htm">
Unvisited Page Link</A> :
<A HREF="index.html">Visited Page Link</A> :
Text colour.
</BODY>
</HTML>
Unvisited Page Link : Visited Page Link : Text colour.

The background colour BGCOLOR is white (#FFFFFF).
The text colour TEXT is black (#000000).
The unvisited link color LINK is red (#FF0000).
The active link color ALINK is green (#00FF00).
The visited link color VLINK is blue (#0000FF).

Once the link colours are defined in the BODY tag, it cannot be changed elsewhere in the body of the current document. So, its a waste of effort trying to change the link color using the FONT tag. To see the active link, you can place the cursor over one of the links in this page, and then hold down the left button on your mouse on the link itself.


Previous : Index : Next