Links and Anchors

One of the primary features that makes the World Wide Web so popular is your ability to easily move from one document to the next. The method that makes "Surfing the Net" so easy is the Hyperlink (Hence, where the name Hypertext is derived from). Just by clicking on one of these hyperlinks you can be taken to another page in someone's Web site or to a completely new Web site. Hyperlinks can even be used to cause something to happen, like a movie to start playing or a file to be downloaded into your computer. If you have more than one page in your Web site or want to reference someone else's site, then using hyperlinks is almost mandatory. Fortunately creating and using links is a fairly simple process.

Hyperlinks (or links as we will refer to them from now on) are made up of two parts. The anchor, or the location in your document where you want the link to appear, and the target, or where you want people to go when they click on the link. Targets can be another web page, a specific location in the current page, or a specific location on a different page. <A> </A> are the tags used to define an anchor, and they have a couple of required attributes that define what type anchor it is. When text is placed between the anchor tags, it will be usually be underlined and a different color to let people know it's a hyperlink.

<A HREF="url"> </A>
The HREF (Hyperlink Reference) in an anchor tag defines the target, or where you want to send people. The url between the quotes would be replaced by the Uniform Resource Locator, or more simply the location and name of a file. The url can be fully qualified or relative (see the professor). The text or image that you want to appear in the browser is placed between the two tags. The <A HREF=""> tag also has the optional attribute of target= which tells the browser where to display the new page. This is normally used with frames. The navigation bar at the bottom of these pages are simply this type of anchor with images placed between the tags instead of text.

<A NAME="name"> </A>
The <A NAME=""> tag is used to define a target location in a document. This means a point in your document where you want people to be able to JUMP TO. You can then send people to that target with the <A HREF="#name"> </A> tags. Notice the addition of the # sign, this lets the browser know that what follows is a location IN a file.

Try It !

I have placed the tags <A NAME="top"></A> at the beginning of this document. The following tags will send you to that target:

<A HREF="#top"> Go to the top </A>.
Go to the top