Images as Hyperlinks

Introduction

This page might look vaguely familiar. It is because I took the hyperlinks page and added the green arrow graphic as the link. Try the arrow below...

Link Types

Page Link
Link in a new window
Link to a particular place within the same page
Link within a different page
Link to a file
Email Link

 

In an earlier lesson you found how to put a graphic in your page. All we do to use an image as a link is put the image link in instead of (or in addition to) the text. Here are the examples.

Page Link

For a link to a page on your server within the same directory here is the format:

was...
<a href="page.htm">Click here</a>
now...
<a href="page.htm"><img src="grnarrowright.gif" width="50" height="50" border="0" align="middle"></a>

For a link to page out on the Internet:

was...
<a href="http://www.page.htm">Click here</a>
now...
<a href="http://www.page.htm"><img src="grnarrowright.gif" width="50" height="50" border="0" align="middle"></a>

 

Assignment

Create a page that has links to four of your favorite sites (as long as they are "decent"). Make two of the links open up in a new window. Using one of your other files create a link to the other file and also make a link to a particular place within another file. An image and text must be used for each link. Put an email link at the bottom of the page and email the URL of your link page to me.

If I counted correctly this will be a total of seven links

 

Back to the outline.