| So, you want to make a Web Page! Lesson 6

Let's learn about links.

It's really very simple. We'll make a link to Yahoo.
Start with this...

    <BODY>
    Go to Yahoo!
    </BODY>

Go to Yahoo!

Then add a pair of anchor tags.

    <BODY>
    Go to <A>Yahoo!</A>
    </BODY>

Go to Yahoo!

Add the URL and you're done! URL Stands for Universal Resource Locator. That's a big fancy phrase that the computer people came up with. They tend to do that alot. A URL is just an address.

    <BODY>
    Go to <A HREF="http://www.yahoo.com/">Yahoo!</A>
    </BODY>

Go to Yahoo!

Let's do one more.

    <BODY>
    Go to Netscape!
    </BODY>

Go to Netscape!

    <BODY>
    Go to <A HREF="http://home.netscape.com/">Netscape!</A>
    </BODY>

Go to Netscape!

An email link works the same way. We just use an email address instead of a page address.

    <BODY>
    Send me <A HREF="mailto:forrest@bubbagump.com">Mail!</A>
    </BODY>

Send me Mail!

FAQ: How can I specify a Subject for my email message? A: Very easily, but there's a catch. You can add a subject to the link as follows... `<A HREF="mailto:forrest@bubbagump.com?subject:Hey Bubba!">` ... but, be advised that floating around out there is the occasional email client that doesn't know what to do with that subject. For those people the email may appear to be sent, but in reality it may simply disappear into oblivion. If this occasional glitch is a concern to you, then don't specify a subject.

FAQ: How can I get rid of the underline in my links? A: Well, technically that can't be done with HTML. But, it can using Style Sheets. If you put the following between the HEAD tags of your document, any browser supporting Style Sheets should render the links without an underline... `<style type="text/css"><!-- a:link, a:visited, a:active {text-decoration: none} --></style>`

We can make an image a link if we want. Using the 'Go to Netscape!' example above we simply substitute an `<IMG>` tag for the word `Netscape!`

    <BODY>
    Go to <A HREF="http://home.netscape.com/"><IMG SRC="chef.gif" WIDTH=130 HEIGHT=101></A>
    </BODY>

Go to

FAQ: How do you get rid of that ugly blue border around an image link? A: Simple... add `BORDER=0` to the `IMG` tag. (See below.)

FAQ: How do I link to a _____ file so people can download it? A: Simple, just link to it. Let's suppose you have a few Microsoft Word documents that you would like to offer. Just link to them...
    <A HREF="myresume.doc">Download my resume</A>
    <BR><A HREF="mybio.doc">Download my autobiography</A>
Download my resume Download my autobiography You may wonder how to be sure the file gets saved to disk rather than being displayed or loaded or whatever. In short you have little control over what happens when a user downloads a file. Most people know how to right click and Save To Disk. Others may have a plugin to handle the file. Just let people manage that part by themselves. Your job is simply to offer it for download. If the file is a lengthly file (200+Kb) or a collection of files, you may wish to zip them and offer the zip file for download instead.

FAQ: How do I make a link open in a new browser window? A: Well, first of all, this can be done easily by your visitor if he wishes. All he has to do is right click on the link and choose "Open In New Window". If we figure that you want to force this action for whatever reason, you can add `TARGET="_blank"` to the link...
    Go to <A HREF="http://home.netscape.com/" TARGET="_blank">Netscape!</A>
There's more on targets in Frame Tutor.

    <BODY>
    Go to <A HREF="http://home.netscape.com/"><IMG SRC="chef.gif" WIDTH=130 HEIGHT=101 BORDER=0></A>
    </BODY>

Go to

One more note about links... It is perfectly acceptable to link to someones page(s) without asking. Links are what makes the Web the Web.

Now that you've learned how to make links, I'm going to tell you about one of my pet peeves. I hate searching for information on widgets and all I get are pages with 14 dozen LINKS to widget sites and nothing else. I follow some of those links and I get MORE LINKS to more widget link sites... but never any friggin widgets!

If you're making a page, of course include links if you think it adds value, but try to refrain from having a page that consists of nothing more than links and links that link to even more links!

`<--BACK` `NEXT-->`

General Table of Contents | Lessons Intro - 1 - 2 - 3 - 4 - 5 - 6 - 7 - 8 - 9 - 10 | Index and Quick Reference | Barebones HTML Guide
PROFESSIONAL WEB DESIGN