7 7 What You’ll Do Understand Link Types Understand Paths Set the Relative Path Add a Link Add an E-mail Link Link within a Web Page Create Image Map Hotspots Modify Image Map Hotspots C
Trang 1Linking Web Pages
Introduction
Static Web pages are composed of three basic elements: text,
images, and links Dynamic Web pages incorporate additional
elements such as: video, animation, and/or audio Of all of
these elements, links are the primary building blocks of any
Web page If there were no links there would be no way for a
visitor to control their journey through the maze of pages and
sites that make up the World Wide Web However, links are
not just for moving a visitor from page to page, or site to
site; in addition, links are used for transmitting emails,
trans-ferring data via FTP (file transfer protocol), and providing the
ability to download data
This chapter is devoted to creating links, modifying links,
and attaching links to various outputs and URLs Links are all
about how you begin the process of making a Web page
come alive
Links come in all sizes and shapes; for example, a link can
be as simple as an underlined section of text; for example,
click here to go there, or it can be incorporated into a simple
graphic, or even into a sophisticated JavaScript rollover If
your links are created using Flash, they can even include
ani-mation and sound
The creation of a link is fairly straightforward… making
that link intuitive to your visitor is the key to Web success
You don't want your visitors looking at a link and wondering
if it is a link, or wondering what will happen if they click it 7
7
What You’ll Do Understand Link Types Understand Paths Set the Relative Path Add a Link
Add an E-mail Link Link within a Web Page Create Image Map Hotspots Modify Image Map Hotspots Create a Null or Script Link Modify a Link
Remove a Link Update Links Test a Link Change Links Sitewide
Trang 2164 Chapter 7
Links come in all sizes and shapes; however,
what they link to is more important than what
they look like Link types refer to the function
of the link; for example, the most popular
(and common) link is the standard http or
HyperText Transfer Protocol With this link you
can access Web pages, images, animations,
just about anything that a wandering Web
vis-itor would like to see and experience
However, there is more to the World Wide
Web then a simple jump from page to page
The following list illustrates the more
com-mon types of Web links and their usage
telnet:// The telnet link allows a user to log
onto a remote computer (called the host), and
take over control For example, computer
troubleshooters, could take over control of
your computer from a remote location, and
fix the problem using the telnet link
mailto: The mailto link allows a user to click and send email from a Web page Basically, the mailto link opens a specified email appli-cation and automatically adds in the proper recipient’s address
news:// The news link connects the user to a specific newsgroup Newsgroups are basically electronic bulletin boards; on various sub-jects… a newsgroup can be found for virtually any subject under the sun, and then some
http:// The http, or HyperText Transfer Protocol, is the most common link type and allows the user to connect to any page on the Internet
ftp:// The ftp, or File Transfer Protocol is used primarily for uploading or downloading large amounts of data This is performed typically using an FTP server, and requires the user to have the correct username and password
Understanding Link Types
Use the Hyperlink dialog box
to create a link.
From the Library of Wow! eBook
Trang 3When you create a link from one document to
another, you need to specify the file path, or
link path, to the linked document to make sure
it works properly There are three different
ways to specify a link path: absolute,
docu-ment-relative, and site root-relative
An absolute path provides a complete URL
(Uniform Resource Locator) to the linked
doc-ument, including the protocol For example,
http://www.perspection.com/books/
od_books.htm
An absolute path is best used for linking to
a document on another server Think of an
absolute path as a fixed location that doesn’t
change
A document-relative path provides a partial
path (the part not the same in URLs) to the
linked document within the Web site If you
want to link to a document in the same folder,
you only need to provide the file name of the
linked document You omit the part of the
absolute path for both documents that are the
same For example, if you want to create a
link from http://www.perspection.com/books/
od_books.htm to http://www.perspection.com/
books/dwcs5.htm, you can use the
document-relative path dwcs5.htm
If you want to create a link from the file
od_books.htm to http://www.perspection.com/
books/download/download_dwcs5.htm, you can use the document-relative path down-load/download_dwcs5.htm Each slash (/ ) indicates that you move down one folder level
If you want to create a link from the file od_books.htm to http://www.perspection.com/
index.htm, you can use the document-relative path /index.htm Each slash ( /) indicates that you move up one folder level
A document-relative path is best used for linking to a document in the same folder or one relatively close and you don’t plan on moving the documents
A site root-relative path provides a path from the site’s root folder to a document A site root-relative folder starts with a forward slash (/), which indicates the root folder For example, if you want to link to od_books.htm, you can use the site root-relative path
/books/od_books.htm
A site root-relative path is best used for linking to a document on a large Web site that uses several servers or one server that hosts several sites, where the local root folder is equivalent to another remote root folder
Understanding Paths
Trang 4166 Chapter 7
Setting the Relative
Path
Set the Relative Path for New
Links
Click the Site menu, and then click
Manage Sites.
Click the site you want to change,
and then click Edit.
Click the Advanced Settings
category
Click the Local Info category.
Click the Document or Site Root
option
For site root-relative paths, enter
the Web site URL in the HTTP
Address box with the equivalent
root address on a remote server
◆ To change the Web URL, click
the Change the Remote server’s
Web URL link.
Dreamweaver uses this address to
make sure links work on a remote
server
Click Save.
Click Done.
8
7
6
5
4
3
2
1
When you create a new link, you can specify the default relative path setting you want to use, either document or site root If you already have links, setting this option doesn’t convert existing links, it only applies to new links By default, Dreamweaver sets links to use docu-ment-relative paths, which sets the path of a link relative to the current document A site root-relative path sets links to use the complete HTTP address If you select the Site Root option, you need to also specify the complete URL in the HTTP Address box to the site root folder on the remote site For example, if the local root location is C:\Web Site\ and the site root location is http://www.website.com/Pub_Docs/, then the local root folder Web site is set to be equivalent to the remote root folder Pub_Docs Content linked with a site root-relative path doesn’t display when you preview pages in a browser unless you specify a testing server, or use the Preview Using Temporary File option in Preferences
8
2
4
5 3
7
6
From the Library of Wow! eBook
Trang 5Set Preview in Browser to Use
a Temporary File
Click the Dreamweaver (Mac) or
Edit (Win) menu, and then click
Preferences.
Click the Preview In Browser
category
Select the Preview Using
Temporary File check box.
Click OK.
4
3
2
1
3
4 2