HTML: Links (Part 1)

 

Links

If you think about how the Web is organized, it is not organized as a top-down hierarchy. Instead, it is organized horizontally, democratically -- like a web. Hypertext links, or links, are central to that web-like organization.

The <A HREF= > tag defines a link. "A" stands for Anchor and "HREF" stands for Hypertext Reference.

 

Linking Within a Page

The first kind of link we will look at it is one that jumps you from one place on a page to another place on the same page. To define this kind of link, name the destination to which you want to jump in this way: <A NAME="goHere">. Then set up a link to that destination: <A HREF="#goHere">Jump to the place named "goHere".</a> The # is required for jumps within pages like this. The </A> tag ends the link.

Here is an example:

<p>&nbsp<img src="schoolBus.jpg"><br>
<p>&nbsp<img src="schoolBus.jpg"><br>
<p>&nbsp<img src="schoolBus.jpg"><br>
<a name="goHere">This is the destination named "goHere."<br>
<p>&nbsp<img src="schoolBus.jpg"><br>
<p>&nbsp<img src="schoolBus.jpg"><br>
<p>&nbsp<img src="schoolBus.jpg"><br>
<p>&nbsp<img src="schoolBus.jpg"><br>
<p>&nbsp<img src="schoolBus.jpg"><br>
<p>&nbsp<img src="schoolBus.jpg"><br>
<p>&nbsp<img src="schoolBus.jpg"><br>
<p>&nbsp<img src="schoolBus.jpg"><br>
<p>&nbsp<img src="schoolBus.jpg"><br>
<p>&nbsp<img src="schoolBus.jpg"><br>
<p>&nbsp<img src="schoolBus.jpg"><br>
<p>&nbsp<img src="schoolBus.jpg"><br>
<p>&nbsp<a href="#goHere">Jump to the destination named "goHere".</a>

to see this how this code works in a window. Scroll down to find the link.

The "Top" button at the bottom of the page is an example of this kind of link.

 

Linking to a Place in Another Page

To link to a particular place in another page that you are writing, the syntax is similar. Name the destination in the other page: <A NAME="goHere">. Then set up a link to that destination, including the name of the page to which you are linking. If the name of the page is "htmlEx11.html," you might write: <A HREF="htmlEx11.html#goHere">.

As an example, here is the code for a link of this kind that jumps to the "goHere" destination that we visited in the example above:

<A HREF="htmlEx11.html#goHere">Click here to go to the "goHere" destination in the page "htmlEx11.html."</a>

Try the link that this code sets up:

Click here to go to the "goHere" destination in the page "htmlEx11.html."
(Use the BACK button to return.)

 

Linking to a Page on the Web

The syntax to link to a page on the Web is similar. For example, to define a link to W3C, the World Wide Web Consortium, the code might be:

<A HREF="http://www.w3.org/">World Wide Web Consortium (W3C)</a>

Try the link that this code sets up:

World Wide Web Consortium (W3C)
(Use the BACK button to return.)

 

Other Resources

Try these sites for more information on links:

Page Link
Primer #4 www.htmlgoodies.com/primers/html/article.php/3478171
<A> tag www.htmlhelp.com/reference/html40/special/a.html

or check out one of our reference books, or look for other help on the Web.

 

Exercise

Work on either 1) your web page, or 2) the eEverything.com page. Add a link that jumps to a different place within the same page. Add a second link that takes the user to another page on the Web.

If you're working on eEverything.com, the link to the Web might be to a company that manufactures a product that is sold on eEverything.com.