Chapter 9: Navigation Within A Document

Navigation Within A Document...

Wouldn't it be nice to be able to click a link and move to another area within the same page? Well you can. You will use the normal anchor tag (<A HREF>) except instead of placing another page in the quotes, we will use a named portion of the document, which begins with a #. To name the part of the document, go to the area you want to name, and place <a name="name_of_area">text</a>, then to call a link to that place from somewhere else in the document, use <a href="#name_of_area">text</a> Example:

<a href="#section2">Go To Section 2</a><br>
blah<br>
blah<br>
blah<br>
blah<br>
blah<br>
blah<br>
<a name="section2">Welcome To Section 2!</a>

Go To Section 2
blah
blah
blah
blah
blah
blah
Welcome To Section 2!

Once you have the section named, you can even call it from other documents... for example, if you named a section in index.html called section2, you could call it from bookmarks.html using <a href="index.html#section2">.



Your own HTML page...

Add the following to your HTML page ("Home.htm") (the blue text is what to add).

<html>
<head><title>My Home Page</title></head>
<!-- The body starts here - and a background image is loaded -->
<body background="bgnd.gif">

<!-- This is a heading, in blue -->
<center><font color="Blue"><h1>YOURNAME's Home Page</h1></font></center>
<!-- This is a horizontal line -->
<hr>
<!-- My name and the two images are all part of a link - which is a "mailto" link -->
This is the home page of <a href="mailto:YOUR EMAIL ADDRESS"><img src="bullet.gif" border=0><b>YOURNAME</b>.<img src="bullet.gif" border=0></a>
<p>Type something about yourself here. Describe briefly who you are and what you do for a living. Remember to use bold and italic text, for emphasis.</p>

<!-- This is an ordered list of sections in the document -->
<ol>
<!-- The first item is a link to a section labelled FavLinks -->
<li><a href="#FavLinks">My Favourite Web Sites</a></li>
<!-- The second item is a link to a section labelled Hobbies -->
<li><a href="#Hobbies">My Hobbies</a></li>
</ol>

 <hr>

<!-- This command labels this point as section FavLinks -->
<a name="FavLinks">
 <h2>My favourite Web Sites</h2>
</a>

 <br>

<!-- This list is an unordered list -->
<ul>
<li> <a href="http://www.xencon.com">Xenon Web Design</a> </li>
<li> <a href="http://www.microsoft.com">Microsoft</a> </li>
<li> <a href="http://www.sybase.com">Sybase</a> </li>
<li> <a href="http://www.sybase.co.za">Sybase South Africa</a> </li>
</ul>

<hr>

<!-- This command labels this point as section Hobbies -->
<a name="Hobbies">
<h2>My Hobbies</h2>
</a>
Talk about your hobbies here.

 </body>
</html>
Save the text file as "Home.htm".
Go To Chapter 10

Free Credit Reports
Free DMV Links
Free Real Estate Forms
Free Secret Info Page
Free Crime Protection
Free Legal Forms
Free Classified Links
Free Auction Site Links
Free Business Forms
Free Government Programs
Free Web Business Ideas
Free Real Estate Reports
Free HTML Tutorial
Free Software Sources
Free Business Reports
Free Real Estate Glossary
Free Web Art
Car Tips