HTML Basix - HTML tutorials and online webmaster tools


Htaccess code generators Code generators Tutorials

Online and offline code generators


Subscribe to RSS feed
Subscribe to the HTML Basix RSS feed.
Introduction  1  2  3  4  5  6  7  8  9  10  Home


Lesson 9

Linking to another website.

For your page to do much good, it needs to be 'linked' to another page, or another site. Otherwise, anyone who comes to your site will open up your index.html page...and that's it. Zippo. Any information you have on other pages, they can't get to because they have no way of knowing they're there! So, we throw a few links to your other pages in. Then again, you could be super-boring and only have one page on your site. In this case, for the sake of experimentation, you will have to link to another site.



I get that...so how do I do it???

We all know what a page address is. Let's use Yahoo for an example. If you type http://www.yahoo.com in the address line of your browser, and hit enter, it will take you to Yahoo. Simple. To have a clickable link which will take you there, you need to make this link 'active'. To do this, you need to enclose it in tags (duh, why aren't you surprised????).

The tag you need is called an "a" tag (which stands for anchor). The "a" tag can have quite a lot of variables to it, which I won't go into now. The main one you need to know is the "href' command, which is what makes a link active.

So, here we go. Type this in your notepad:

"<a href="http://www.yahoo.com">"

Save and refresh your page. You will see.....nothing!!! That's because all of that is enclosed in <tags>. What you now need to do is make it so you can click on some text and it takes you to Yahoo. Naturally, the text doesn't go within the <tags>

"<a href="http://www.yahoo.com">Click here to go to Yahoo!!</a>"

Notice what I did there? I put the text between the 'link' and the closing </a> tag. Because the text was between the two tags, it was affected by the preceeding tag. As this was a href, or a 'link' command, then that's what happened to the text. If you save your notepad and refresh your html page, you will find you have a clickable link.



How to link to another page on your website.

You do the same thing as linking to another site, but you don't need to put the full address of the page in. This is called relative linking. For example, on your index.html page, you want to put a link to a page called pictures.html. You could either type in

"<a href="http://www.joeblow.com/pictures.html">Click here for pictures!</a>"

or you could make sure both pages are in the same folder in your website account, and type in:

"<a href="pictures.html">Click here for pictures!</a>"

If the page you want to link to is in another folder, say in a folder called 'images', then you would need to state the path to it:

"<a href="images/pictures.html">Click here for pictures!</a>" If the folder the image is in is up a level, you use '..' to move up one directory in the path:

"<a href="../images/pictures.html">Click here for pictures!</a>"

Next comes linking images in lesson 10!


Introduction  1  2  3  4  5  6  7  8  9  10  Home




Site Stats     
VisitorsPageviews
Total: 9,392,542 Total: 27,306,870
Today: 470 Today: 1,571
Yesterday: 656 Yesterday: 3,408
Past Month: 20,336 Past Month: 105,648

629 visitors in the last 24 hours
This page has been visited 38,283 times
There are currently 5 visitors online
click to see where
most people online at once:
286 visitors on 06/27/2012
   You beaut











This site is © HTML Basix 2003 - 2009