HTML and CSS Reference
In-Depth Information
To Add a Text Link to a Web Page in Another Web Site
The <a> and </a> tags used to create a text link to a Web page within the same Web site are also used to create
a link to a Web page in another Web site. The following step illustrates how to add a text link on the Underwater
Tours by Eloise Web page to an external Web page that describes Hawaii's national parks.
1
URL of
external link
•
Click immediately
to the left
of the o in
the word, one, on
line 19 and type
<a
href="http://
www.nps.gov/
state/hi/index
.htm">
to add the
URL for the exter-
nal Web site when
clicked.
line 19
text that displays
on Web page
for link
Figure 3-16
•
Click immediately to the right of the last letter s in destinations on line 19 and type
</a>
to end the tag, as shown in
Figure 3-16.
When I type in the URL in the Address box of my browser, I never type in the http:// part of the URL. Why do I have to
add the http:// in the link? I did not need the http:// for the sample photographs link.
Although you do not need to type the http:// into the URL on the browser, you always must include this as part of the
href when creating external links. The Sample Photographs Web page is stored in the same folder as the home page
from which you are linking. You therefore do not need to include any information other than the name of the Web
page file. See the discussion on absolute and relative paths below for more information.
When I link to the external Web page (www.nps.gov), I have to use the Back button on the browser to return to my
home page. Is that the only way to get back?
Yes. You have to use the Back button to return to the home page because this is an external Web site. There is no way
to provide a link back to your home page from an external Web site. In later chapters, you will learn how to open a new
window for external.
Using Absolute and Relative Paths
At this point, it is appropriate to revisit the overall concept of how the files are
organized and saved. As noted in the last chapter, the projects in this topic use a very
simple folder structure. In this topic, the graphical images are stored in the same folder as
the HTML files, for example, in the Chapter03\ChapterFiles folder. For most real-world
applications, however, it would be more appropriate to separate the HTML code and the
graphical images into different folders. Figure 3-17 on the next page shows an example of
a more complex ile structure that could be used for this topic.
To understand how to use this sort of folder structure, you need to identify the
folder location, or path, to the files. A
path
describes the location (folder or external
Web site) where the files can be found, beginning with the UDISK G:\ drive (or another
drive on your computer). This beginning location is also known as the
root
location.
You can use either an absolute or relative path when identifying the location of the
files. An
absolute path
specifies the exact address for the file to which you are linking
or displaying a graphic. You can think of an absolute path as the complete address of
