11/5/09

A Tags - The Rest of the Story

There is a lot to this tag with many options available for your use.

We pick up here with the knowledge of how to create a link on a web page. If you need a refresher, this is a complete web page when saved with a .html ending.

< html >
< head) < /head >
< title > < /title >
< body > < /body >
< /html >

and if you need a refresher, there are three parts to the A tag-

the opening tag- < a href="anotherpage.html" >
the part visitors will click- click here
and the end tag- < /a >

The file 'anotherpage.html' is where your visitor will go when they click on 'click here'. The < /a > just tells the browser that this is the end of this tag.

Websites

Now, 'anotherpage.html' is a page in your website, but what if you want to let your visitors go to another website? All you need to do is put a web address where the web page was. For instance, instead of 'anotherpage.html' you could put the web address for google.com where the page name was and then when the visitor clicks on 'click here' they will go to google. It would look like this-
< a href="http://www.google.com"> click here < /a >

Cool, huh?

New Tab

Then, what if you wanted the google page to open in a different window (or tab) so the visitor would still have your website open? You just add this 'target="_blank"' after the page. It would look like this-

< a href="http://www.google.com" target="_blank" > click here < /a >

Images

If you remember, we said you could open a new page from text or an image. Here is some code to make an image a link to a new page (or website). It would look similar to this-
< a href="http://www.google.com" > < img src="someimage.jpg > < /a >

For this to work, 'someimage.jpg' must be in the same folder. If you want to link from an image in a different folder, use the web address like this-
< a href="http://www.google.com" > < img src="http://mywebsite/images/someimage.jpg > < /a >

This would allow you to use an image in the 'images' folder to link from.

That is not all you can do with images. There is a concept called an 'image map'. You may use certain areas of an image to link to one page and another area to link to a different page. Perhaps you've seen websites with a map and you click on different states or countries and are sent to different pages. That is a subject for another whole article, but I can say here that you just create co-ordinates for each area of the image and link to the area in those co-ordinates.

No comments:

Post a Comment