::links::
A quick intro
Links are amongst the most important things to a website. There is no point in haveing two or more pages but not being able to go from Page 1 to Page 2. In pretty much all websites you will see links of sorts - text links, image links and more. There are many different ways links can be used and manipulated. Links
Ok - links are VERY important to a webpage - no matter what it is (unless it is a one page 'webpage'). Links as you may most likely already know, is what links one page between another. By default links are underlined by default and are usually blue when they haven't been visited and purple/maroon when they have been visited. <a href="URL">link</a>
This is the most basic link syntax you can use (Obviously, the Uniform Resource Locator (URL) is the URL you want to link to...don't just type URL in, you'll get an error.) <a href="URL" target="_blank">link</a>
The extra target tag allows you to have a bit more control over where the page opens. (I'll explain later on - oh, and the URL thing also applies :D) <a name="place"> and <a href="#place">link</a>
These two links are slightly different to the ones above. Rather than linking to another page, they link to the same page, but just a different place. The first question that may come to mind is: "Why a href? and not link?!? HTML really doesn't make sense."
Well, there is a bit of sense in the madness if you know that "a href = anchor hyperlink reference". Links are nice and simple - just follow the syntax above and put in the URL you want to link to and your basically done. For example, you want to link to Google. Just do this: <a href="http://www.google.com">Go to Google</a> - this will give you Go to Google. Note:
1. Obviously you can change the 'Go to Google' part to whatever you like - but remember make it meaningful so people know where they are going to be linked to
2. The reason my link turned out Orange and no underline is because I have added some code that will change it. Go to Google and you can see what default links look like. The 'hardest' part of links is probably - how much of a link do I include? Why can't I just put <a href="www.google.com">Google</a>? The method I use to decide how much of a link I put in is this.
- If you are linking to a page outside of your webpage - that is, a page that you did not make type in the full address. The reason is because if you don't do this, the browswer will think you are accessing a page on your website. So it will try to go somewhere like: http://www.yourhost.com/yourname/www.google.com which needless to say will not work. So you will need to type in the FULL address, eg. http://www.google.com
-
If you are linking to your own page - don't type in the whole link. But becareful where your pages are located. To make the below explnation understandable, you may want to open this image and follow my running commentary. Ok, now imagine we are viewing the page 'animal_main.html' that is in the 'animals' folder.
- <a href="animal_sub.html">Animal List</a> - use this syntax for pages that are in the same folder as the current page you are looking at.
- <a href="domestic/dogs.html">Dogs</a> - for pages in a folder that is in the folder you are in. (eg. domestic and wild are in animals)
- <a href="../photo_main.html">Photos</a> - for pages that are in a folder one above the folder you are in.
- <a href="/programs/vb/vb_main.html">Dogs</a> - use this if you want to start from the 'top' of your folder list.
- Hopefully that makes sense. It should if you follow the diagram (and if I haven't typed anything wrong)
The page: <a href="somewhere.html">
A particular position on the page: <a href="somewhere.html#position>
Not that hard is it? Ok, there is one more thing with links (well, that I can remember and that I know of). And this other thing is the target of the link. "What in the *beep* do you mean?" you may ask - well, have you ever wonderd why some links open a new page, while others don't? Well, that is because the majority of the time, a 'target' has been defined. Below are a few examples of targets (with the syntax): <a href="URL" target="_blank">
As you can see the syntax is rather self explanatory and isn't hard. This particular target will open the page in a new window. <a href="URL" target="_top">
This is a very useful target as even though it opens in the same window it will get out of frames (which are really bad and annoying, but sometimes unavoidable). <a href="URL" target="_anything">
Ok, now here I sort of mean anything. But no spaces, use underscores instead. With this, if you have two of the same name, it will open in the same new window, but if they are different names they will open in different windows. So, if you have Links A,B,C - and you have the targets _window_one & _window_two. And you assign Link A and C to target _window_one and Link B to target _window_two - then no matter how many times you click on those three links, and in what order, all the links will open a new window and Link A and C will open in the same new window and Link B will open in a different window to Link A and C
Note: I havne't included ones such as _parent and _self because they pretty much say 'Open in the same window as that link is in', which is the default thing so I don't see it as necessary.