 |
|
|
|
||
|
|
|
CONTENTS
The URL of Net: A Cyberspace Address PrimerBefore the hypertext festivities commence, there's a bit of background info we need to slog through for you. As mentioned in Chapter 2 a hypertext link is a special word or phrase in a Web page that, when the user clicks on it, takes her to a different Web document (or to an FTP site, or whatever). We also mentioned that each Web page (and, indeed, any Internet resource) has its own address, called a Uniform Resource Locator (or URL, for short). When you combine these two factoids, you realize that for a hypertext link to work properly, you need to know the correct address of the resource to which you're linking. And to do that, you need to understand the anatomy of these URL things. Unfortunately, the whole URL concept seems to have been invented by some insane Geek of Geeks who never believed normal human beings would actually use the darn things. They're long, they're confusing, they're messy, and they're almost impossible to type correctly the first time. Not to worry, though; we've gone mano a mano with this URL foofaraw, and we've come up with a plan that's designed to knock some sense into the whole mess. The idea is that, like journalists and their 5 Ws (who, what, where, when, and why), you can reduce any URL to 3 Ws (who, what, and where) and an H (how). So the basic form of any URL ends up looking like so: How://Who/Where/What How The first part of a URL specifies how the data is going to be transferred across Net lines. This is called the protocol and, luckily, mere mortals like you and I don't need to concern ourselves with the guts of this stuff. All you need to know is which protocol each resource uses, which is easy. For example, the World Wide Web uses something called HTTP (we'll tell you which protocols other resources use later in this chapter). So the "how" part of a URL is the protocol, followed by a colon (:) and two slashes (//). (we told you this stuff was arcane; it makes alchemy look like "The Cat In the Hat.") So a Web page URL always starts like so (lowercase letters are the norm, but they're not necessary): http:// Who Calling the next part the "who" of a URL is, I admit, a bit of a misnomer because there's no person involved. Instead, it's the name of the computer where the resource is located-in geek circles, this is called the host name. (This is the part of an Internet address that has all those dots you're always hearing, such as www.kacmac.com or www.yahoo.com.). You just tack this "who" part onto the end of the "how" part, as shown here: Where The next part of the address specifies where the resource is located on the computer. This generally means the directory the resource is stored in; the directory may be something like /pages or /pub/junk/software. So now you just staple the directory onto the URL and then add another slash on the end, for good measure: What Almost there. The "what" part is just the name of the file you want to use. For a Web page, you use the name of the document that contains the HTML codes and text. The file containing our privacy policy is called privacy.html, so here's the full URL: http://info.kacmac.com/privacy
Getting Hyper: Creating Links in HTMLOkay, with that drivel out of the way, it's time to put your newfound know-how to work. To wit, this section shows you how to use HTML to add hypertext links to your Web page. The HTML tags that do the link thing are <A> and </A>. (Why "A"? Well, as you'll find out later on-see the section "Anchors Aweigh: Internal Links" -you can create special links called anchors that send your readers to other parts of the same document, instead of to a different document.) The <A> tag is a little different from the other tags you've seen (you just knew it would be). Specifically, you don't use it by itself but, instead, you shoehorn into it the URL of your link. Here's how it works: <A HREF="URL"> Here, HREF stands for Hypertext REFerence. Just replace URL with the actual URL of the Web page you want to use for the link (you have to enclose the address in quotation marks). Here's an example: <A HREF="http://www.kacmac.com/html/"> Now you can see why we made you suffer through all that URL poppycock earlier: it's crucial for getting the <A> tag to work properly. You're not done yet, though; not by a long shot (insert groan of disappointment here). What are you missing? Right, you have to give the reader some descriptive link text on which to click. Happily, that's easier done than said because all you do is insert the text between the <A> and </A> tags, like so: <A HREF="URL">Link text goes here</A> Need an example? You got it: Why not head to our Hypertext links are generally divided into two categories: external and internal. An external link is one that sends the person who clicks it to a different document. You have two choices here: you can link to a Web page in a different directory or on a different system, or you can link to a Web page in the same directory as the current page. An internal link (an anchor) sends the reader to a different part of the same document. The next few sections describe each type of link. External Links to Faraway PagesThe most common type of link is one that whisks the reader off to a page at some other Web site. Many Webmeisters use these kinds of external links to provide their readers with a quick method of surfing to related sites. For example, if you're putting together a page extolling the virtues of, say, the World War II, you may want to include some links to pages about Germany or Italy. For these types of links, make sure your <A> tag includes the full address of the new location, as described in the preceding section. Lots of pages also include links that point to the author's fave rave Web sites and to those sites that the author deems "cool." These so-called "hot lists" are a popular item on home pages, and they can be fun for surfers (providing, of course, they share the Web page creator's taste in what's cool). External Links to Nearby PagesWhen putting together Web pages, the operating principle is "Bet you can't create just one!" That is, people usually get so juiced by getting a page on the Web that they're inspired to do it once more from the top. It's not at all unusual for a prolific Websmith to have five, ten, or even 20 different pages! Chances are that if you create more than one Web page at least a few of your pages will be related, so you'll probably want to include links that take your readers to other examples of your Web handiwork. You'll probably store all your Web pages in the same directory, so the how, who, and where parts of the URL will be the same as the current document. For example, compare the URL of our home page with the URL of another HTML file we use called feedback.html: http://www.kacmac.com/ As you can see, the two addresses are identical right up to (but not including) the filenames. This is good because if we want to include a link to guestbook.html in our home page, we only have to include the filename in the <A> tag. That's right: if you're creating a link to a document in the same directory, you can simply lop off the how, who, and where parts of the URL. Here's how such a link looks: Please send us <A HREF="feedback.html">feedback;/A> Anchors Aweigh: Internal LinksUnlike the links you've looked at so far, internal links don't connect to a different document. Instead, they link to a special version of the <A> tag-called an anchor-that you've inserted somewhere in the same document. To understand how anchors work, think of how you might mark a spot in a book you're reading. You might dog-ear the page, attach a Post-It note, or place something between the pages such as a bookmark or your cat's tail. An anchor performs the same function: it "marks" a particular spot in a Web page, and you can then use a regular <A> tag to link to that spot. We think an example is in order. Suppose we want to create a hypertext version of this chapter. To make it easy to navigate, we want to include a table of contents at the top of the page that includes links to all the section headings. Our first chore is to add anchor tags to each heading. Here's the general format for an anchor: <A NAME="Name">Anchor text goes here</A> As you can see, an anchor tag looks a lot like a regular hypertext link tag. The only difference is that the HREF part is replaced by NAME="Name"; Name is the name you want to give the anchor. You can use whatever you like for the name, but most people choose relatively short names to save typing. For example, this chapter's first section is titled "The URL of Net: A Cyberspace Address Primer." If I want to give this section the uninspired name Section1, we use the following anchor: <A NAME="Section1">The URL of Net: A Cyberspace Address Primer</A> Now, when we set up our table of contents, we can create a link to this section by using a regular <A> tag (with the HREF thing) that points to the section's name. And, just so a Web browser doesn't confuse the anchor name with the name of another document, we preface the anchor name with a number sign (#). Here's how it looks: <A HREF="#Section1">The URL of Net: A Cyberspace Address Primer</A> Just so you get the big picture, here's an excerpt from the HTML file for this chapter (the figure shows how it looks in a browser): <H3>Hypertable of Contents:</H3>
Creating an E-Mail LinkAs we mentioned earlier, there's no reason a link has to lead to a Web page. In fact, all you have to do is alter the "how" part of a URL, and you can connect to most other Internet services, including FTP and UseNet. In this section, however, we'll concentrate on the most common type of non-Web link: e-mail. In this case, someone clicking on an e-mail link will be presented with a screen they can use to send a message to your e-mail address. Now that's interactive! This type of link is called a mailto link because you include the word mailto in the <A> tag. Here's the general form: <A HREF="mailto:YourEmailAddress">The link text goes here</A> Here, YourEmailAddress is your Internet e-mail address. For example, suppose we want to include an e-mail link in one of our Web pages. Our e-mail address is [email protected], so we'd set up the link as follows: You can write to us at our
The Least You Need to KnowThis chapter gave you the lowdown on using HTML to include hypertext links in your Web pages. Here's a review of today's top stories:
| |||||||||||||||||||||||||||||||||||||||||
|
Make KacMac your home page Add URL - Information Center - Contact us - Terms of Service - Privacy Policy - Advertising |  |
|
Copyright © 2004 KacMac. All rights reserved. |
