Return to my Computer Pages
Go to my home page
© Copyright 1997, Jim Loy
Part I - Formatting showed you how to format text in HTML. You can get deeper into formatting of text (color backgrounds, color print, different sizes of print, columns, lists, special characters...). But, you can do a lot with what that article showed you. But, in order to have an interesting WWW page, you need two more things, links and graphics. This article shows you how to link.
The basic link is a link to one of your other pages or to someone else's page. Here is the one that I used above:
<A HREF="http://www.mcn.net/~jimloy/html.html">Part I</A>
This looks fairly complicated. But it is actually simple. It begins with an <A> (anchor) tag, and ends with a </A> tag. In between is the text that you want the user to click on (Part I). The <A> tag is the long part, and is mostly the URL of the page that you are linking to. In the above example, we are linking to the document html.html, in my public directory, on my Internet provider's computer. The HREF="..." just tells the user's Netscape (or Internet Explorer) that a URL is inside the quotes.
That's all there is to it. Just copy the above example, and use the URL of your choice.
You can link to another place in the same document. But for that, you need two sets of <A>...</A> tags. One is the link, the other is the "target". Here is how you denote the target:
Here, I named the target "basic". And this is how you link to that target:
<A HREF="#basic">Go back to Basic Links</A>
This is similar to the example link that I showed you above. But, there's a #basic inside the <A> tag. The # is there to tell Netscape (or Internet Explorer) that this is not a URL, but is a "name" within the same document. This is how that link looks to the user:
Go back to Basic Links
You can link to an internal target, within another HTML document. Here is how you can link to basic, in this document, from some other document:
<A HREF="http://www.mcn.net/~jimloy/links.html#basic">Basic Links</A>
You can also make a picture be part of a link, so that the user can click on the picture. That is a little more advanced. And, I will write about that later.
Now that my pages have moved, I have learned a few things that I should have learned before. All of the above links are external links, or internal links. There are also relative links.
<A HREF="html.html">Part I</A>
The above link goes to another page in the same directory. This is shorter than the full external link. And, which would have saved me an awful lot of work, it is portable. I could have moved my pages directly to OneMain.com without having to change all of the links.
<A HREF="../astro/astro.htm">Go to my Astronomy pages</A>
This one goes to my Astronomy pages, using a relative link. Those pages are now in a separate directory. "astro/astro.htm" would link into the astro subdirectory of the current directory. "../astro.htm" would link into the parent directory of the current directory. "/astro.htm" would link to astro.htm in the root directory of my pages. And the link shown above ("../astro/astro.htm") goes to the astro subdirectory of the parent directory.
I forgot to mention how to let the reader send you email. Normally, the link is:
<A href="mailto: email@example.com">Send me email</A>
Use a real email address instead of firstname.lastname@example.org. But this useage is an invitation for Spam (junk email). Automatic email address harvesters search your files for email addresses and give them to spammers. So I recommend obfuscating (hiding) your email address (and the email addresses of other people) in some way. Here is a fairly simple way:
<P><A href="mailto: bogus@DELETE_THISbogus.bogus">Send me email</A>. Note: Please remove the letters "DELETE_THIS" from the message header.</P>
Return to my Computer pages
Go to my home page