Chapter 2 - Developing A Web Sites

XP
Chapter 2
Developing a
Basic Web Site
Objectives
XP
Learn how to storyboard various Web site

structures
Create links among documents in a Web
site
Understand relative and absolute folder
paths
Mark a location with the id attribute
Create a link to an id
New Perspectives on HTML and XHTML, Comprehensive
Objectives
XP
Understand URLs
Link to a site on the Web
Link to an FTP site
Link to an e-mail address
Work with hypertext attributes
Work with metadata
Introduction to Web Usability Design
Create effective link
2.1 Web Page Structures
XP
A storyboard is a diagram of a Web sites

structure, showing all the pages in the site
and indicating how they are linked together
It is important to storyboard your Web site
before you start creating your pages in order
to determine which structure works best for
the type of information the site contains
A well-designed structure can ensure that
users will be able to navigate the site without
getting lost or missing important information
2.1.1
Linear Structures
XP
In a linear structure, each page is linked

with the pages that follow and precede it in
an ordered chain
Linear structure works best for Web
pages with a clearly defined order
In an augmented linear structure, each
page contains an additional link back to an
opening page
2.1.1
Linear Structures
XP
A linear structure
An augmented linear
structure
2.1.2
Hierarchical Structures
XP
In the hierarchical structure, the pages

are linked going from the home page down
to more specific pages
Users can easily move from general to
specific and back again
Within this structure, a user can move
quickly to a specific scene within the page,
bypassing the need to move through each
scene in the play
2.1.2
Hierarchical Structures
XP
2.1.3
Mixed Structures
XP
As Web sites become larger and more

complex, you often need to use a
combination of several different structures
The overall form can be hierarchical,
allowing the user to move from general to
specific; however, the links also allow users
to move through the site in a linear
fashion
A site index is a page containing an
outline of the entire site and its contents
2.1.3
Mixed Structures
XP
10
Web Site with No Coherent

Structure
Unstructured web site can be
difficult and frustrating to use
XP
11
2.1.4
Protected Structures
XP
Sections of most commercial Web sites are

off-limits except to subscribers and
registered customers
12
2.2 Working with Links

A web page contains hypertext links
or items that you could select to
view another topic and document.
This often called the links
destination.
Link can point to:
Another section in the same document
Different document
A different Web page
A variety of other Web objects
XP
2.3 Creating a Hypertext Link
XP
14
2.3.1 Linking to a Document
XP
To link to a page, you specify the name of the

file using the href attribute of the <a> tag
Filenames are case sensitive on some
operating systems, including the UNIX and
Macintosh, but not on others
The current standard is to use lowercase
filenames for all files on a Website and to
avoid special characters such as blanks and
slashes
You should also keep filenames short to avoid
typing errors
15
2.3.1 Linking to a Document
XP
Hands-on Trying 1:
hometxt.htm ,glossary.htm,
tipstxt.htm (open them with
Expression Web)
16
2.4 Specifying a Folder Path (Linking

XP
to Documents in Others Folders)
To create a link to a file located
in a different folder than the
current document, you must
specify the files location, or
path
17
2.4.1 Absolute Pathnames
XP
An absolute path specifies a files

precise location within a computers
entire folder structure
18
A sample folder tree / absolute path:

Figure 2.7
An absolute path specifies

a files precise location
within a computers entire
folder structure
XP
2.4.2 Relative Pathnames
XP
A relative path specifies a files

location in relation to the location of
the current document
20
A sample folder tree / relative path:

Current document is in
tips folder
XP
If the file is in the same location as the

current document, you do not have to
specify the folder name
If the file is in a subfolder of the
current document, you have to include
the name of the subfolder.
If you want to go one level up the
folder tree, you start the relative path
with a double period (..) and then
provide the name of the file.
To specify a different folder on the
same level, known as a sibling folder,
you move up the folder tree using the
double period (..) and then down the
tree using the name of the sibling
folder.
2.4.3 Changing the Base
XP
The base element is useful when a

document is moved to a new folder.
Rather than rewriting all of the relative
paths to reflect the documents new
location, the base element can redirect
browsers to the documents old location,
allowing any relative paths to be resolved
The base element is useful when you
want to create a copy of a single page from
a large Web site on another Web server
22
2.5 Link to Locations Within
XP
Documents
Link to locations within same document

Link to locations within different
documents
23
2.5.1 Link to Locations Within

Same Document
XP
A) Mark that location

To jump to a specific location within a
document, you first need to mark that location
One way to identify elements in an HTML
document is to use the id attribute
Id names must be unique
Id names are not case sensitive
<h2 id ="A">A</h2>
Or
<h2><a name="A">A</a></h2> (old code)
24
<h2><a name=A>A</a></h2>
code)
(old XP
Hands-on Trying 2a: open glossary.htm ,

mark the location (links destination)
XP
B) create a link
To create a link within a document, you
enclose the content that you want to
format as a link in an <a> tag, and use the
href attribute to identify the link target
A links content is not limited to text
Generally, a link should not contain any
block-level elements
<a href="#A">A</a>
Hands-on Trying 2b:
Open glossary.htm , create links within a document
26
2.5.2 Link to Locations Within

Different
Documents
To create a link
to a specific location in another
XP
file, enter the code

<a href="reference#id">content</a>
where reference is a reference to an HTML or
XHTML file and id is the id of an element marked
Hands-on
within
that Trying
file 3a: Open glossary.htm , mark the location
<dt id="aperture"><b>Aperture</b></dt>
:
<dt id="exposure"><b>Exposure</b></dt>
:
<dt id="f-stop"><b>F-stop</b></dt>
:
<dt id="flash_mode"><b>Flash Mode</b></dt>
:
<dt id="focal_length"><b>Focal Length</b></dt>
:
27
XP
Hands-on Trying 3b:
Open glossary.htm , mark the location
open home.htm , create links to specific
locations in another file,
28
2.6 Working with Linked ImagesXP

A standard
practice
and
Image
Mapson the Web is to turn
the Web sites logo into a hypertext link
pointing to the home page
To mark an inline images as a hypertext
link
<a href="reference"><img src="file alt="text"

/></a>
Demo 1
29
2.6.1 Introducing Image Maps
XP
HTML also allows you to divide an image

into different zones, or hotspots, each
linked to a different destination
A hotspot is a defined area of the image
that acts as a hypertext link. When a user
clicks within a hotspot, the hyperlink is
activated.
There are two types of image maps:
server-side image maps and clientside image maps.
30
XP
31
2.6.2 Client-Side Image Maps
XP
A client-side image map is inserted in an

image map into the HTML file
The browser locally processes the image map
Because all of the processing is done locally,
you can easily test Web pages
More responsive than server-side maps
The browsers status bar displays the target
of each hotspot.
Older browsers do not support client-side
images
32
XP
To define these hotspots, you create an

image map that matches a specified region
of the inline image to a specific destination.
Use the syntax of the map element to create
a client side image map
<map name=map id=map>
hotspots
</map>
map is the name of the map and hotspots
are the locations of the hotspots within map.
33
2.6.3 Defining Hotspots
XP
Define a hotspot using two properties:
Its location in the image

Its shape
Syntax of the hotspot element:
<area shape=shape coords=coordinates
href=url alt=text />
34
XP
Creating a Rectangular Hotspot
Two points define a rectangular hotspot:
the upper-left corner
the lower-right corner
A sample code for a rectangular hotspot is:
<area shape="rect" coords="168, 110, 225, 145"
href="tips.htm" alt="Tips" />
Coordinates are entered as a series of four numbers
separated by commas
HTML expects that the first two numbers represent the
coordinates for the upper-left corner of the rectangle, and
the second two numbers indicate the location of the lowerright corner
The hotspot is a hypertext link to tips.htm
35
XP
Creating a Circular Hotspot

A circular hotspot is defined by the
location of its center and its radius
A sample code for a circular hotspot is:
<area shape="circle" coords="82, 78, 80"
href="home.htm" alt="Home" />
Coordinates are (82, 78), and it has a radius

of 80 pixels
The hotspot is a hypertext link to karts.htm
36
XP
Creating a Polygonal Hotspot

To create a polygonal hotspot, you enter
the coordinates for each vertex in the
shape
A sample code for a polygonal hotspot
is:
<area shape=polygon
coords=13,60,13,270,370,270,370,225,230,225
, 230,60 href=rides.htm>
Coordinates are for each vertex in the shape

The hotspot is a hypertext link to rides.htm
37
XP
Creating a Default Hotspot

<area shape="default" coords="0, 0, x, y"
/>
where x is the width of the inline image in
pixels and y is the images height
Any spot that is not covered by another
hotspot will activate the default hotspot
link
<area href="pearlake.jpg" shape="default" coords="2, 5, 777,
163">
38
2.6.4 Applying an Image Map
XP
Hands-on Trying 4:
open home.htm , create image map and
hotspots , applying an image map
39
2.6.5 Server-Side Image Maps
XP
In a server-side image map, the image

map is stored on the Web server
Server-side image maps are supported by
most graphical browsers
Server-side image maps can be slow to
operate
The browsers status bar does not display
the target of each hotspot
40
2.7 Linking to Resources on theXP

Internet
To create a link to a resource on the
Internet, you need to know its URL
A Uniform Resource Locator (URL)
specifies the precise location of a resource
on the Internet
A protocol is a set of rules defining how
information is exchanged between two
resources
41
XP
Your Web browser communicates with Web

servers using the Hypertext Transfer
Protocol (HTTP)
The URLs for all Web pages must start
with the scheme http
Other Internet resources use different
protocols and have different scheme
names
42
XP
43
2.7.1 Linking to a Web Site
XP
A sample URL for a Web page
44
XP
If a URL includes no path, then it indicates

the topmost folder in the servers directory
tree
If a URL does not specify a filename, the
server searches for the default home page
The server name portion of the URL is also
called the domain name
The top level, called an extension, indicates
the general audience supported by the Web
server
<a href="http://www.apogeephoto.com">Apogee Photo</a>
45
Hands-on Trying 5:
open tips.htm , create links to Web
sites
XP
46
2.7.2
Linking to FTP Servers
XP
FTP servers are another method of

storing and sharing files on the Internet
FTP servers transfer information using a
communications protocol called File
Transfer Protocol, or FTP for short
An FTP server requires each user to enter a
password and a username to access its
files
47
2.7.3
Linking to FTP Servers
XP
48
2.7.4 Linking to an E-Mail

Address
XP
Many Web sites use e-mail to allow users

to communicate with a sites owner, sales
representative, or technical support staff
You can turn an e-mail address into a
hypertext link, so that when a user clicks
on an address, the browser starts an e-mail
program and automatically inserts the
address into the To field of the new
outgoing message
49
XP
The mailto protocol also allows you to add
information to the e-mail, including the subject
line and the text of the message
mailto:address?
header1=value1&header2=value2& ...
mailto:ghayward@camshotscom?
Subject=Test&Body=
This%20is%20a%20test%20message
To preserve information about blank spaces, URLs
Hands-on Trying 6:
use escape
characters
open home.htm , create links to email address
Demo2 <a href="mailto:ghayward@camshots.com?subject=CAMshots
%20Message"> contact me</a>
%20Message"> contact me</a>
50
XP
51
XP
If you need to include an e-mail address in

your Web page, you can take a few steps
to reduce problems with spam:
Replace all e-mail addresses in your page with
inline images of those addresses
Write a program in a language JavaScript to
scramble any e-mail address in the HTML code
Replace the characters of the e-mail address
with character codes
Replace characters with words in your Web
pages text
52
2.7.5 Working with

Hypertext Attribute
XP
HTML provides several attributes to control

the behavior and appearance of your links
You can force a document to appear in a
secondary window or tab by adding the
target attribute to the tag <a> tag
53
XP
Hands-on Trying 7:
open tips.htm , specify a link target.
<dt>☞ <a href="http://www.apogeephoto.com" target="new">Apogee
Photo</a></dt>
54
XP
If you want to provide additional

information to your users, you can provide
a tooltip to your links
A tooltip is a descriptive text that appears
whenever a user positions the mouse
pointer over a link
55
XP
Hands-on Trying 8:
open home.htm , create tooltip
<a href="gloss.htm" title="Study photo terminology in the CAMshots
glossary"> [ Glossary ]</a>
56
2.8 Using the Link Element
XP
Another way to add a link to your document is to add a

link element to the documents head
Link elements are intended only for the browsers use
Link elements have primarily been used to link style
sheets
Because no single list of relationship names is widely
accepted, you must check with each browsers
documentation to find out what relationship names it
supports
<link rel=top" href="home.htm">

<link rel="help" href="tips.htm">
<link rel="glossary" href="gloss.htm">
57
XP
2.9 Working with Metadata
XP
Web authors often turn to companies that

specialize in making sites appear more
prominently in search engines
Information about the site is called
metadata
Add metadata to your Web pages by
adding a meta element to the head section
ofname="text"
the document
<meta
content="text" scheme="text" http-equiv="text" />
59
XP
In recent years, search engines have

become more sophisticated in evaluating
Web sites
The meta element has decreased in
importance, but it is still used by search
engines when adding a site to their indexes
60
XP
61
XP
You can add commands to this communication stream

between the Web server and Web browser with the meta
elements http-equiv attribute
Force the Web browser to refresh the Web page at timed
intervals
<meta http-equiv="refresh" content="60" />
Redirect the browser from the current document to a new
document
<meta http-equiv="refresh"
content="5;url=www.camshots.com" />
Specify the character set
<meta http-equiv="Content-Type"
content="text/html;charset=ISO-8859-1" />
62
XP
Hands-on Trying 8:
open home.htm , create metadata
<meta name="author" content="your name" httpequiv="refresh" content="60" />
<meta name="description" content="A site for sharing
information on digital photography and cameras" />
<meta name="keywords" content="photography, cameras,
digital imaging" />
2.10 Creating Effective Links

Storyboarding
Easy navigation with link to home page and a page
containing site index
Avoid using Click here in links
Never place 2 links adjacent to one another. Separate
them with text, spaces or symbol.
Use lowercase filenames for all document
XP
XP
Avoid long pages unless necessary.

Break up a long page to different
sections. Include links throughout
the page that users can click to
jump to the top of the page.
Use anchor if internal document
must link with older browsers
2.11 Phases of Planning and

Designing Web
XP
Phase1:Preparation
(A)Research and idea generation
Main Goal:
1.
2.
3.
4.
Define the user.

Define information the users need and want.
Define presenters objective.
Define the potential information to be used:
ideas, facts, images, prices and so on.
66
XP
End product of idea generation are:

The definition of expected information content for
each group of users.
A statement of what the Web Presentation will do.
A list of information sources.
Key Roles in idea generation:

They know the possible users.
Know the information that most likely wanted by
users.
Know the availability of information to be put on
site.
67
XP
(B)Information decomposition and structuring
Question: What contribute to a well-organized site? AND How to
achieve it?
Answer: Task of the designer to perform information
decomposition (Step 1) and structuring (Step 2).
Decomposition:
It is the process of separating something into smaller parts
or pieces.
Decomposition in Web Presentation Concepts: separate the
information identified during the research and idea
generation into chunks information objects.
Structuring:
Create an information object map to satisfy the presenters
and the users.
Designers Task.
68
XP
Phase2: Design
Text analysis and composition
Text Analysis:
The development of text statement that most clearly
convey the intended message of each information
object.
Text Composition:
All objects with complete text are rearranged, and
regrouped to achieve effectiveness, affectiveness and
navigational efficiency.
69
XP
Linkage analysis and composition

Linkage Analysis:
Define hyperlinks for information objects and are
threaded to each other.
Reevaluated to avoid affecting its original information
content and misinterpretation.
Linkage Composition:
Phrasing links and incorporates them.
Apply suitable color to links.
70
XP
Multimedia analysis and composition

Multimedia:
Text, graphics, sound, animation, video, or other media
combined into a single production or presentation.
Multimedia Analysis:
Decide appropriate multimedia.
End product: a list of potential multimedia selections.
Multimedia Composition:
Select, create, install, and integrate multimedia in the
Web presentation.
End product of multimedia analysis and

composition is a complete, up-to-date, multimedia
web presentation.
71
XP
Phase3: Maintenance and Continuous

Improvement
Reasons for maintenance and continuous
improvement
Reasons:
Information could be out-dated.

Visions changes when experience grows.
Competitions between competing organizations.
New technologies inventions.
If no improvement over Web sites look,

technology, content and navigational
techniques resulted losing a lot of users.
72
2.11.1Key roles involved in

supporting
a
site
XP
Involves presenters, information stewards and designers.

Presenters:
Direct & Funding.
Determine a Web strategy.
Decide the extent of electronic commerce on the Web.
Information Stewards & Designers:
Same area of responsibility
Steward Web content, monitor pages relating to the
business function for which they are responsible.
Designer implementing changes recommended by
presenters and information stewards.
73
XP
New Key Role Webmaster/operations manager:

Primary user contact and his email posted on the site.
Responsibility includes:
Forwarding mail from users to appropriate parties. Example:
customer service or sales.
Evaluating technologies beneficial to the Web site.
Recommending upgrades to phone service, operating
systems, hardware and software as necessary.
74
2.11.2 Strategies used for

technology
surveillance
Performed for the purpose
of identifying news technologies
XP
to improve Web presentation.

To determine whether or not using the new technology will
improve the existing systems performance or better
achieve the sites overall objectives.
It is the ongoing observation and evaluation of new
technologies from the time they are announced until they
are mature enough to be incorporated into a Web
presentation.
Surveillance includes:
Reading magazines.
Visiting E-zines (electronic magazines).
Attending trade show.
Talking with vendors.
Discussing developments with other people in other organizations.
75
2.12 Introduction to Web

Usability Design
Areas
Page Design
Content Design
Site Design
XP
2.12.1 Page Design
XP
A careful, systematic approach to page design can

simplify navigation, reduce user errors, and make it
easier for readers to take advantage of the information
and features of the site.
The spatial organization of graphics and text on the Web
page can engage readers.
With graphic impact, direct their attention and prioritize
the information they see
XP
Dense text documents are hard to read, particularly on

the low-resolution screens.
Without the visual impact of shape, color, and
contrast, pages are uninteresting and will not motivate
the viewer.
Highly graphical pages risk disappointing the user by
offering a poor balance of visual sensation, text
information, and interactive hypermedia links.
2.12.2 Content Design
XP
Be VERY concise write 50% less text than you would on paper.
Write for SCANNABILITY no long paragraphs, use subheads and bullet lists
Use HYPERTEXT LINKS to break up lengthy information across separate
pages.
Readability research shows that:
Reading from a computer screen is 25% slower than from paper.
Prolonged reading from a screen is unpleasant.
Tips:
Write 50% less text than for a print publication.
XP
Scannability shows that:
80% of web users don't read they scan for keywords, headings, bullets and links.
Tips:
Structure texts with 2/3 levels of headings.
Use indentation to show structure & heading
Use highlighting italic, bold and colored text, but NOT underlining because of
the confusion with links.
Use bullet lists or numbered lists.
2.12.3 Site Design
XP
The design of the site will determine its organizational framework.

The overall organization of the site will have the impact on the
users experience.
At this stage you will make the tactical design decisions about what
your audience wants from you, what you wish to say, and how to
arrange the content to best meet your audience's needs.
XP
The fundamental organizing principle in Web site

design is meeting users' needs.
Many organizations and businesses make the
mistake of using their Web sites primarily to
describe their administrative organization, and only
secondarily do they offer the services, products, and
information the average user is seeking.
Most readers won't care how your company or
department is organized and will be put off if such
inside information is all your site appears to offer.
XP
Talk to the people who make up your target audience, put yourself in their shoes, and
make the items and services they want the most prominent items on the home page.
Web site's should have:
A user-centered design.
Straightforward architecture (logical relationships between pages).
Easy to understand, consistently c navigational controls.
Offer consistency of layout and textual and graphical style.
XP
2.13 Issues in Web Page Design

Latency & Responsiveness
There is a factor of different users having different connection speeds. It
can range from a low-speed 56K modem connection to a high-speed
broadband connection.
The single most important page design issue is download time. Page
download and rendering speed is a big factor in usability.
Rules of thumb:
a 0.1 sec response time limit is needed for the user to feel in real time control.
a 1 sec response limit is needed if user's flow of thought is to remain
uninterrupted.
There is a 10 sec limit for keeping user's attention focused on the dialogue.
Real world times will be 2 to 3 fold the optimal time.
Tips:
Minimize the number of graphics.

Keep graphics small. Crop them if possible.
Reduce the color depth or increase compression.
Use tables with colored backgrounds to structure pages.
Warn users if a link goes to a page bigger than 50K.
84
XP
Media file size
Perhaps the most powerful aspect of computing technology is the
ability to combine text, graphics, sounds, and moving images in
meaningful ways.
The promise of multimedia has been slow to reach the Web because
of bandwidth limitations, but each day brings new solutions.
Although there are numerous methods for creating Web multimedia,
we recommend using stable technology that works for the great
majority of client machines.
Multimedia places high demands on the network, the computer, and
the user. The challenge thus lies in preparing files that are small
enough to be accessible to the broadest possible audience yet are of
sufficient quality to be worth the effort.
To balance quality against accessibility you'll need to understand
both the characteristics of different media formats and the
limitations of delivering media in a networked environment, and you
must be ready to compromise.
85
XP
Resolution
Although Web pages and conventional print documents
share many graphic, functional, and editorial similarities, the
computer screen, not the printed page, is the primary
delivery site for Web-based information, and the computer
screen is very different from the printed page.
Computer screens are typically smaller than most opened
books or magazines.
A common mistake in Web design is spreading the width of
page graphics beyond the area most viewers can see on
their seventeen- or nineteen-inch display screens:
86
XP
Graphic safe areas
The "safe area" for Web page graphics is determined by two factors: the
minimum screen size in common use and the width of paper used to print
Web pages.
Most display screens used in academia and business are seventeen to
nineteen inches (forty-three to forty-eight centimeters) in size, and most
are set to display an 800 x 600-pixel screen.
Web page graphics that exceed the width dimension of the most common
display screens look amateurish and will inconvenience many readers by
forcing them to scroll both horizontally and vertically to see the full page
layout. It's bad enough to have to scroll in one (vertical) direction; having to
scroll in two directions is intolerable.
The graphic safe area dimensions for printing layouts and for page layouts
designed to use the maximum width of 800 x 600 screens are shown below:
Graphic "safe area" dimensions for layouts designed to print well:
Maximum width = 560 pixels

Maximum height = 410 pixels (visible without scrolling)
Graphic "safe area" dimensions for layouts designed for 800 x 600 screens:
Maximum width = 760 pixels

New Perspectives
HTML
Comprehensive
Maximum on
height
= and
410 XHTML,
pixels (visible
without scrolling)
87
Chapter Summary
XP
Create a Web site with several linked pages

Storyboarding and complex Web structures
Creating Web pages linked together
Links to locations within documents and from
another document
Create links to sites and to non-Web locations
Different hypertext attributes
Meta element
Introduction to Web Usability Design
Create effective link
88
XP
End of Chapter 2
Developing a
Basic Web Site

Chapter 2 - Developing A Web Sites

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Chapter 2 - Developing A Web Sites

Uploaded by

Copyright:

Available Formats

XP

Learn how to storyboard various Web site

New Perspectives on HTML and XHTML, Comprehensive

New Perspectives on HTML and XHTML, Comprehensive

2.1 Web Page Structures

A storyboard is a diagram of a Web sites

New Perspectives on HTML and XHTML, Comprehensive

In a linear structure, each page is linked

New Perspectives on HTML and XHTML, Comprehensive

New Perspectives on HTML and XHTML, Comprehensive

In the hierarchical structure, the pages

New Perspectives on HTML and XHTML, Comprehensive

New Perspectives on HTML and XHTML, Comprehensive

As Web sites become larger and more

New Perspectives on HTML and XHTML, Comprehensive

Web Site with No Coherent

New Perspectives on HTML and XHTML, Comprehensive

Sections of most commercial Web sites are

New Perspectives on HTML and XHTML, Comprehensive

2.2 Working with Links

2.3 Creating a Hypertext Link

New Perspectives on HTML and XHTML, Comprehensive

2.3.1 Linking to a Document

To link to a page, you specify the name of the

2.3.1 Linking to a Document

New Perspectives on HTML and XHTML, Comprehensive

2.4 Specifying a Folder Path (Linking

New Perspectives on HTML and XHTML, Comprehensive

2.4.1 Absolute Pathnames

An absolute path specifies a files

New Perspectives on HTML and XHTML, Comprehensive

A sample folder tree / absolute path:

An absolute path specifies

2.4.2 Relative Pathnames

A relative path specifies a files

New Perspectives on HTML and XHTML, Comprehensive

A sample folder tree / relative path:

If the file is in the same location as the

2.4.3 Changing the Base

The base element is useful when a

New Perspectives on HTML and XHTML, Comprehensive

2.5 Link to Locations Within

Link to locations within same document

New Perspectives on HTML and XHTML, Comprehensive

2.5.1 Link to Locations Within

A) Mark that location

New Perspectives on HTML and XHTML, Comprehensive

Hands-on Trying 2a: open glossary.htm ,

2.5.2 Link to Locations Within

file, enter the code

New Perspectives on HTML and XHTML, Comprehensive

2.6 Working with Linked ImagesXP

<a href="reference"><img src="file alt="text"

New Perspectives on HTML and XHTML, Comprehensive

2.6.1 Introducing Image Maps

HTML also allows you to divide an image

New Perspectives on HTML and XHTML, Comprehensive

2.6.2 Client-Side Image Maps

A client-side image map is inserted in an

To define these hotspots, you create an

2.6.3 Defining Hotspots

Define a hotspot using two properties:

Its location in the image