Remember that HTML stands for HyperText Markup Language? Well, applying all those tags is the markup part. Now hang on to your hat: Here’s everything you need to know about the hypertext part. In this section, we demonstrate how to use hypertext to create links between information in your document and information in other documents. This stuff is a bit confusing at first, but after you understand it, you’ll think of many exciting ways to use hypertext in your Web pages.
Figure 4-3:
Using lists in your Web page.
In HTML, every hypertext link has two ends, which are called anchors.(Some people think that putting anchors into a Web page makes them anchorper-sons — but sorry, no seven-figure salary.)
When you define an anchor, you use tags to specify two things:
The text or image that is highlighted as the place you click to follow the link
The other anchor that you want to go to when you click the link Anchors are among the most complicated tags in basic HTML. But you don’t want to say “Anchors away,” as the old movie had it, because anchors expand the possibilities of your Web page tremendously. The following is an example of an anchor:
<a href=”http://www.listentoyourdog.com”>How to train dogs</a>
Here are the parts of an anchor:
<a>, </a>:These tags go around text that you want highlighted as a hypertext link (How to train dogsin the preceding example). Try to use text that represents the thing that you want to link to, such as
“Adobe Corporation” or “my résumé.” The better this text describes the thing that you link to, the more helpful the text is to the user.
href:This information falls within the <a>tag. When the user clicks the hypertext link, the browser brings up the Web location indicated by the pathname that appears after href.
Hypertext reference:These characters follow the equal sign in the href part of the anchor and are enclosed in quote symbols. They are the path-name of the document that you link to. In the example, the hypertext ref-erence is the name of a Web site: “http://www.listentoyourdog.com”. When you post an HTML file on a server, some anchors in the file can point to Web documents on the same Web server as the HTML file, while other anchors point to Web documents on other Web servers. When the docu-ment is on another server, the anchor contains the docudocu-ment’s full URL, in the same form as you type it in your browser. For example, an anchor point-ing to the For Dummies Web site looks like this:
<a href=”http://www.dummies.com”>”For Dummies”</a>
When the document that’s pointed to by the initial anchor is on the same machine, the anchor contains the pathname of the document. The pathname specifies the file’s location on the machine.
For simple Web sites that you create, put all the documents in the same direc-tory or folder so that you have simpler anchors. Then you don’t have to worry about pathnames!
The pathname looks different depending on where the second document is in relation to the HTML document that contains the link. If the two documents are in the same directory or folder, the pathname is simply the filename. But if the second document is in a different directory, you can use two methods to specify how to reach it: absolute addressing and relative addressing. In absolute addressing,you use the path from the lowest-level, or root,directory of the server to the second document. In relative addressing,you start with the location of the HTML file that’s currently being viewed. You then use the path from the HTML file to the second document.
To specify an absolute address, start with a forward slash (/) to indicate the root directory of the Web server. Then specify the full pathname from the root directory to the file. The following example shows an absolute address:
/photoshp/samples/sunrise.gif
To specify a relative address, start with the directory of the HTML document that the anchor is in and then enter the path that leads to the desired file from there. A pair of dots (..) specifies the directory one level above the cur-rent one.
For example, if you have an HTML file called sunset.htmin the directory /mysite/html, and you need a GIF graphics file that is in /mysite/html/
pix, a subdirectory of the current directory, the relative address is the following:
pix/sunset.gif
If you also need a file that is in /mysite/trial/pix, you use the .. charac-ters to specify the subdirectory above this one and then go back down the directory tree to the needed file. Put a slash after the dots. In this case, the relative address is as follows:
../trial/pix/moonrise.gif
Starting at the beginning of the path, “..” means “the directory above the cur-rent one.” The words separated by slashes, “/trial/pix/,” are the names of the directory and subdirectory in which the file is stored. And “moonrise.gif” is the filename.
Usually, you create your Web site on one machine, and then publish it by copying the files to another machine, the Web server. Forgetting to copy all the files needed to the Web server is very easy. If you keep all the files in one overall folder — that doesn’t have any files in it that aren’t part of the Web site — you have a fighting chance of making the transfer successfully.
Table 4-2 shows examples of anchors.