.

Lesson 6 - Links
Putting links on your page and managing files.

Hyperlinks are what makes it possible to move from one location in a file to another, or from one file to another. An HTML file can link to another HTML file, or to a sound, picture, or video file. This is what makes hypertext so exciting!

In order to use links effectively, it is important to also have a systematic folder and file system for your work. Each folder (even folders within folders) should have a default.htm, or index.htm file. (These files can also have the extension .html.) This will be the file that will automatically be opened when your URL address is given.

Links within a single folder can be accomplished with a simple ANCHOR <A> tag. More complicated links use this same format. To reference a link, type <A Href="name of file.htm">Then the actual text you want to highlight here.</A>. (Don't forget to close the ANCHOR tag.) The browser will underline and highlight the text between the two anchor tags, so now it would look like this: Then the actual text you want to highlight here. (Unless you specify something else in the BODY tag, the default colors will probably be blue for unvisited links, red for active links, and purple for visited links.) Clicking on any portion of the text between the two anchor tags will cause the browser to leap to the new file.

6th Assignment:
Put links on your page.

Go to the Lesson Index page and use "View" to look at the source code. Notice all the times you see <A HREF="somefilename.htm"> followed by text and then </A>. Notice how these same links appear on the web page. For now we will just do these kinds of links within one folder, but below are directions for other kinds of links you can do if you're interested.

OTHER KINDS OF LINKS:
The main page of the Webmaster Club has four types of links. Mostly, it links to other files within the Webmaster folder. However, it also has a link to the folder which contains the Webmaster folder, the Petersen School folder. This link looks like this: <A Href="../index.htm">Back to Otto H. H. Petersen School index page</A>. The very important part of this link is the "../" part. This tells the browser to move outside of the current folder. In this case, it moves up one folder to the Petersen School folder. It is not necessary to name this folder in the <A> tag.

The third type of link shown on this page is to an email prompt. Notice this line: <A Href="mailto:mhuff@shs.scappoose.k12.or.us?subject=Webmaster Club">mhuff@shs.scappoose.k12.or.us</A>. Now everything within the two anchor tags will be highlighted, but clicking on this text will create an email window with the topic "Webmaster Club" already filled in.

The fourth type of link is an image tag used as a link. Just inclose the IMG tag with A tags. For example: <A Href="aboutus.htm"><img src="miscimages/aboutus.gif" width="147" height="121" alt="About Us" border=0></A>. This link will jump to the "About Us" page by clicking on the graphic. (Be sure to include border=0 in your graphic tag or the graphic will be outlined with a blue line.)

There are other kinds of links not shown on this page. You can link to files on other servers by simply including the entire URL address inside the quote marks (including http://).

If you want to jump to another portion of the same file, create an Name anchor where you want to jump. For example: <A Name="This is the place">This is the place</A> that I plan to jump to. In your A HREF tag, put the Named segment inside the quotes with this sign: #. For example: <A Href="#This is the place">Go to the end of this report.</A>. You will be at "This is the place" (the end of the report) instantly!

Lesson Index | Webmaster Club Main Page

Copyright ©2000, Marilyn Huffman. All rights reserved.