How to Link

Now you need to know how to do the most important HTML trick of all: putting hyperlinks in your pages so that people can jump from place to place both within your web page and from your page to the rest of cyberspace. Though it sounds scary, linking is very easy once you get the hang of it.

Three Basic Links

External Links
Internal Links
Email Links

External Links

To create an external link the first thing you need to know is the URL of the place you want to link up to, like http://www.umich.edu if you want a link to the UM home page for example. The next thing you need to know is the external link tag.

The external link tag looks like this: <a href="URL"> Link Text Here </a>
And yes, you do need those quotation marks or it won't work at all!

Internal Links

If you have a long web page you should certainly consider inserting internal links so that people do not have to scroll up and down all day to get where they want to go. You have already noticed, of course, that this page uses internal links to move you from section to section, like this one: Back up to Table of Contents

Now, the internal link tag is essentially the same as the external link tag, but you need to take a few additional steps to insert internal links.

First, decide where in your web page you want someone to be able to jump to. This is called either an "anchor" or a "target". When you have decided where you want an anchor, you must specify that anchor with an anchor tag.

The anchor tag looks like this: <a name="anchor name"> Anchor text here</a>

It looks a lot like the link tag except that instead of href it says name to indicate that what follows is an anchor name, not a hypertext reference. You can give your anchor any name you want--look at the source code of this page to see what I called the anchors in this page. It's good to keep them short and easy to remember.

Next, you need to decide where you want to put links to that anchor and then insert the internal link tags. An internal link tag has the same form as an external link tag except that instead of a URL you use the anchor name and you must preced the anchor name with the pound sign.

Thus, the internal link tag to this section of this web page looks like this:
<a href="#in"> Internal Links</a>

Notice that the anchor name for the Internal Links section is "in" and the text that appears as a link is "Internal Links"

Email Links

One more handy dandy link to show you and that's the email link. This link allows people to click and bring up an email composition screen right in the browser and send you instant feedback on your site, fanmail, whatever. Even if you don't really want the feedback, it looks cool to have the link.

The email link has the same form as any link tag except that instead of a URL you insert the email address instead.

The email link looks like: <a href="mailto:YourEmailAddress"> Link Text</a>

So I would put "mailto:mmyoung@umich.edu" in my link for example. As for the link text, you can go a number of ways:

Email me at mmyoung@umich.edu
Email me at mmyoung@umich.edu
Email Margaret Young
and so on...