HTML Tutorial - Linking
OK then, this tutorial will teach you how to link from one web page to another on the world wide web.
Absolute Linking
The HTML tag used to link one page to another is the < a > tag, which for some reason stands for anchor and here is how you use them:
Now as you can see, the most simple usage of < a > uses only one attribute, href - this points to where you want the link to go, in our example above, we made a link to www.google.com - try it, if you paste the above code in your html document you will see this: Google
Now the link above is an absolute link, meaning it links to the entire URL of the page, however this is often an unnecessary way of linking, as if your files are in the same directory (folder) you can use…
Relative Linking
This is where you link to a page without using the full http://www.yourdomain.com/page.html - instead you simply link to page.html, as shown below:
<a href= ‘index.php’ >Home page </a>
This link will link to a file called index.php, which is in the same directory as the file you’re editing, and will produce this:
Home Page
Now lets explore some other attributes…
Some more attributes
One very useful attribute is the target attribute, which decides which window the link will open in, here are some examples:
<a href= ‘index.php’ target= ‘ _self ‘ >Home page </a>
This would open index.php in the current window or frame.
<a href= ‘index.php’ target= ‘ _top ‘ >Home page </a>
This would open index.php in the entire browser window. (breaking any frames)
<a href= ‘index.php’ target= ‘ _blank ‘ >Home page </a>
This would open index.php in a new window. (popup window)
<a href= ‘index.php’ target= ‘ _parent ‘ >Home page </a>
This would open index.php in the current frame’s framesetting document.
<a href= ‘index.php’ target= ‘ windoworframename ‘ >Home page </a>
This would open index.php in the frame or window called ‘windoworframename’ - obviously you would name it something more suitable.
Just one more
The only other attribute of <a> that you should know is the name tag, as shown:
<a name= ‘mylinkname’ >home page </a>
Although this link doesn’t link anywhere (unless you add a href=”) - it does give it a name, which allows you to manipulate it with JavaScript.
Conclusion
I hope you enjoyed this tutorial, you should now be able to link to other pages on the internet, and make them open in the current or a new window, and give the links names so that you can manipulate them with JavaScript at a later date!
