HTML and CSS Reference
In-Depth Information
Linking Within a Web Page
Links within a Web page allow visitors to move quickly from one section of the
Web page to another. This is especially important in Web pages that are long and require a
visitor to scroll down to see all of the content. Many Web pages contain a list of links like a
menu or table of contents at the top of the page, with links to sections within the Web page
(Figure 3-7). In this project, the Sample Photographs Web page includes links from the
top section of the Web page to other sections within the page, as well as links back to the
top of the Web page. There are two steps to link within a Web page. First, you have to set
a target using a name that makes sense to the purpose of the link. Then, you create a link
to that target using the name given. The following HTML code shows an example of a
target named fish and then the use of that target as a link. The first statement is inserted at
the top of the section of the Web page to which you want to link. The second statement is
inserted into the bulleted list at the top of the Web page where you want the link to appear.
<a id=”fish”></a>
<a href=”#fish”>Frog Fish</a>
Again, notice that you also use the anchor <a> tag for this type of link. However, with this
inner-page link, you insert the # before the target id to indicate that you want to link to a
specific section of the Web page, not necessarily the top of the page. Sometimes when you
are browsing the Web, you might see a # used in a link address. That generally links you
to a specific section of the Web page.
links to targets
within Web page
targets
Figure 3-7 Web page with internal links.
Linking to an E-mail Address
A well-designed Web page always provides a way for visitors to contact the person
at the company responsible for maintaining the Web site or addressing customer questions
and comments. An easy way to provide contact information is to include an e-mail link on
the Web site's home page, as well as on other pages in the Web site. As shown in Figure 3-8,
when a visitor clicks the
e-mail link
, it automatically opens a new message in the default
e-mail program and inserts the appropriate contact e-mail address in the To field. Visitors
then can type and send an e-mail to request additional information, comment on the
E-mail Links
You can assign more than
one e-mail address to a
mailto: tag. Use the form
"mailto:irst@isp.com,
second@isp.com" in the
<a href=> tag. Some older
browsers may not support
this tag.
