Basic Links
<a href="filename.html">Link Text</a>
<a> This tag makes the actual link.
href="..."> href="..." is an attribute. It tells the tag where the link should go.
filename.html This is the URL of where you want the link to go. When the link is between two pages in the same directory folder, then you only need to type the file name followed by the .html extension. But, if the file was located in one of your folders then you would type the address as being href="foldername/file.html".
Link Text This can say whatever you want it to.
</a> This will close the link. Don't forget this tag!
When linking between pages on your website, it's not necessary to type the entire address of the file, just the relative address.
For example, lets say you have a web site your working on. Your entire website is located on your hard drive, in a folder called "website".
In the website folder, you have a file called "index.html", and another folder called "links".
In the "links" folder you have a file called "bookmarks.html"
You want to link to the bookmarks.html file, on the index.html page. You would have to make a link that looked like this: <a href="links/bookmarks.html">Link Text</a>
But, let's say you want to link back to that index.html page from your bookmarks.html page. You would now have to type the entire address; because index.html is in a folder that bookmarks.html is not in, or in front of.
Since index.html is located in a folder called websites, on your hard drive, to link back to it from bookmarks.html you would have to type the address as being href="C:\\websites/index.html". (Assuming that your hard drive is called "C", and that you did not put the websites folder in any other folders.)
Now, if your website was located on the Internet, then the complete address of index.html might be something like http://www.domain.com/index.html.
It can get a bit involved, but I promise you'll get it, if you don't get it all ready.
Linking to Outside Locations
<a href="http://www.domain.com">Click Here!</a>
href="http://www.domain.com" Instead of linking to a document on your own web space, you are linking someone else's website, so now you have to type the full URL.
Browsers permit several other forms of the HREF attribute:
<a href="http://..."> Link to another document located on the world wide web.
<a href="ftp://..."> Link to an ftp site.
<a href="gopher://..."> Link to a gopher server.
<a href="news:..."> Link to a newsgroup.
<a href="newsrc:..."> Link to a specific newsrc file.
<a href="nntp://..."> Used to specify a different news server.
<a href="telnet://..."> Link will initiate a telnet session.
<a href="wais://..."> Link that connects to a specified wais index server.
<a href="view-source://...> Netscape specific href attribute value that forces the standard netscape 'view source' window to appear, containing the document specified in the value of the attribute.
<a href="nethelp:vendor/product:topic_id"> Netscape specific href attribute value. Used when delivering on-line help via the nethelp method.
E-Mail Links
<a href="mailto:username@email.com">E-Mail Me</a>
mailto: You need to have this in front of the e-mail address for it to even work.
You can use this link to receive email from others. You can also go one step further, and specify the subject, cc, and body.
<a href="mailto:[EMAILHERE]?subject=[SUBJECTHERE]&cc=[CCHERE]&body=[BODYHERE]">link text</a>
I'm fairly certain that this is a Netscape specific feature. I would advise against using this also, as it is unrealiable and if someone sends you an email and you do not recieve it, nither you or the sender will know.
One more thing, to protect your email address from Spam-bots, I would recommend that every time you make a link to your email address (and when you sign guest books) you alter the email address in such a way that only a real human would be able to email you. Example, make your email address you@---ANTISPAM---REMOVE---email.com instead of you@email.com.
Linking With Images
<a href="index.html"><img src="parts/049t.jpg" /></a>
You can actually put just about anything in between the <a>...</a> tags, and it will make a link. In this case we use an image. That code will make this:
<a href="index.html"><img src="parts/049t.jpg" border="0" /></a>
You'll notice that it has a border around it, let's say you don't want this border. You would then use the border attribute and set it to "0". That code will make this:
<a href="index.html"><img src="parts/049t.jpg" border="5" alt="hello!!!" /></a>
Don't forget that you can set the alt attribute to give the viewer a message when they hover over the image for a moment. That code makes this (notice I set the border to 5):
Linking To External Content
<a href="parts/final.mid">Click here for some music</a>
I have my midi file located in a folder called parts, that's why the link says "parts/...". With that above code, you can make a link to a midi file.
You can link to all types of files using this method, like .jpg files, .gif, .wav, .au, .mpeg, .vrml, .zip, etc.
Links Within A Page: Anchor Links
<html>
<head>
<title>...</title>
</head>
<body>
<a name="top"></a>
Here is the top of the page<br>
<a href="#bottom">Click here to go to the bottom</a>
<br><br>.....
<a name="bottom"></a>
Here it the bottom<br>
<a href="#top">Click here to go to the top.</a>
</body>
</html>
<a name="top"></a> You use this tag to give a certain location on your web page a "name". The name can be anything, but you might want to avoid spaces.
<a href="#top">Click here to go to the top.</a> This link is what you would click to go to the top of the page. It works just like a normal link, but since you are linking to a spot on the web page, you would put a # followed by the "name" of the place that you want the link to go to.
You can see what the above HTML document would look like here.
<a href="samp/005.html#bottom">Click here to go to the bottom of 005.html</a>
You can also link to anchors located on other pages, that code makes a link like this: Click here to go to the bottom of 005.html.
Opening Links In A Different Window
<a href="http://www.domain.com" target="_blank">Click Here (opens in new window)</a>
That link will open in a new window.
Accesskeys
<a href="index.html" accesskey="L">Index.html</a>
You can use accesskeys like shortcut keys. In the above code, you could press alt+L to activate the link, and then press enter to actually "click" it.
Try it out, press and hold the alt key, then press L. This will activate the link. After you let go of alt+L, press enter, and you will go back to the index:
Index.html
The accesskey feature only works on Internet Explorer 4.0+. Also note that with it you will override any Internet Explorer shortcut keys.
AIM Link For AOL Instant Message Users
<a href="aim:goim?screenname=AIM_NAME_GOES_HERE">Click Here To AIM Me!</a>
That will make a link that people can press to send you an AIM.
<a href="aim:goim?screenname=AIM_NAME_GOES_HERE&message=your+message+goes+here">Click Here To AIM Me!</a>
You can use that link to send an Instant message that comes with the message of your choice. Don't forget the plus signs!
Main?