Main

 
Page #23: Creating Links. Part 2: Anchors

index previous page Creating Links. Part 2: Anchors next page

Links can take you to one of three places:
  • Another page on your Web site.
  • A page on another Web site.
  • A specific spot on a page. This "spot" can be on the same page or a different page, either on your Web site or a different Web site.

We looked at links first on Page #14. There you learned how to create the first two kinds of links. On this page we will learn how to create "anchors" — links to specific spots on a page.

The quickest way to give you an example of this is to look at Page #23a. You will see "anchors" at work; and you will see — displayed in green — the code that makes them work.

There are two parts to the code that creates an "anchor."

  1. The link to the anchor: <a href="#anchor name">Text or image at the anchor's startingpoint. </a>.
  2. The anchor itself: <a name="anchor name">Text or image at the anchor's destination.</a>
  3. The starting point "#anchor name" and the destination "anchor name" must be identical.

    The link is a starting point; the anchor is a destination; .

Here's the code:

  1. <a href="#leaks">Fixing Leaks</a> — the starting point
  2. <a name="leaks">Fixing Leaks</a> — the destination

Look again at the examples and code on Page 23a.


Page 23a gives you examples of using anchors to move from one spot to another spot on the same page.

The anchor is also used to link to a specific spot on a different page. This link http://members.aol.com/jbjtutor/links.htm#encyclopedic will take you to the "Encyclopedia/Glosaries" section of my Web site — not to the top of the page. This specific spot for the "Encyclopedia/Glosaries" section of the page is identified in the code with the tag <a name="encyclopedic"> . Adding #encyclopedic to the end of link code above tells the browser to retrieve the page whose address is "members.aol.com/jbjtutor/links.htm" and then jump to that specific spot — identified as "#encyclopedic" — on the page.