HTML Linking

So you have your first page made, you may have even created a few other pages worth of content. Rather than having each page stand on its own, wouldn't it be nice if you could offer visitors the chance to see your other pages? Of coarse! This is what the web is all about. Below we will show you various ways to link to pages either from images or from text.

Your basic Text link tag looks something like this:

<A HREF="http://www.TechnologyTutorials.org">The Ultimate Free Tutorial Resource</A>

Now there are a few things going on here, lets break it down.

- A stands for Anchor. It begins the link to another page
- HREF stands for Hypertext REFerence. This is just your webpage's way of telling the browser you want to send it to a certain webpage
-Where it reads "The Ultimate Free Tutorial Resource" is where you write the text you want to appear on the page. What is in that space will appear on the page for the visitor to click. So, write something that corresponds to the link.

This is what will appear if you copy and paste the above code into your webpages HTML:

The Ultimate Free Tutorial Resource

Another form of text links lets you open the email client of your visitor when it is clicked, this is what is known as a mail to link. The basics are the same, you just change one minor detail

<A HREF="mailto:Contact@TechnologyTutorials.org">
Contact US</A>

You may have noticed the little change, instead of linking to a URL, we have instead inserted an email address. Also, we have added a new tag mailto: this simply tells your browser that you would like the visitor to beable to send an e-mail rather than go to a website when the link is clicked. This is what will appear if you copy and paste the above code:

What about Image Links? Nothing to it, lets go...

<A HREF="http://www.TechnologyTutorials.org">
<IMG SRC="randomimage.jpg"></A>

Your notice the stucture of the image link is almost Identical to the structure of the text link, we have just added in a new tag, lets break this down:

<A HREF="http://www.TechnologyTutorials.org">
This is just like before, only instead of putting text in the next spot, we have put an image, using this tag:

<IMG SRC="randomimage.jpg">
This tell the browser that you what to place an image<IMG SRC stands for Image Source, ="randomimage.jpg"> tells the browser the file location on your server of the image you want displayed, also it closes the IMG SRC tag with >.

</A> this tells the browser that your link is over, closing the <A> tag which told the browser you wished to start a link. Useng this code will show something like this(ofcoarse with your image):

| Back to HTML Tutorials |

Well, thats it for now, Soon you will learn more link functions such as how to link to different places on one page, How to title your links so when the visitor halts there mouse over the link it tells them a neat messege, and even how to add a description to your Link images for help with those who have slow conections. See you next time....