HIGHLIGHTS AND BREADCRUMBS
Drivers use road signs to track their location in space. Web users rely on
navigation. Well-designed sites cue the visitor to her location within the
site’s hierarchy. For instance, if the visitor is within the Breeds section of
the cat site, the Breeds item in the menu bar may be highlighted by a sub-
tle change of color. This “you are here” indicator helps keep the visitor
grounded, thus promoting lengthier visits (see Figure 3.17).
101
Taking Your Talent to the Web
It’s all about comfort. Better hotels offer fluffier pillows; better sites pro-
vide constant spatial and hierarchical reassurance. Breadcrumbs, called
this because they resemble the trails left by Hansel and Gretel, not only
serve as hierarchical location finders, but they also allow visitors to jump
to any section further up in the hierarchy (see Figure 3.18).
Figure 3.17
Subtle highlighting on the
menu bar reminds you that
you’re on the Home Store
page. Click to a different
page, and a different menu
item will be highlighted.
Note, too, how much air
the design team has
managed to work into the
page, in spite of the vast
number of links and menu
items the page must carry
(www.bloomingdales.com).
Compare with Figure 3.16
and contrast with Figure 3.5.
05 0732 CH03 4/24/01 11:16 AM Page 101

while enabling sophisti-
cated users to skip tedious
hierarchical layers and
move quickly to the exact
content they seek
(www.jazzradio.net).
05 0732 CH03 4/24/01 11:16 AM Page 102
BRAND THAT SUCKER!
We’ve discussed navigation and interface in terms of the user’s needs, and
they of course come first. But what of the client’s needs? Meeting them is
the role of branding.
A corporate website is the online expression of that company’s brand iden-
tity. Making sure that the navigation fully supports the company’s brand
identity is crucial to the success of the site (and sometimes to the success
of that company). Build the most navigable, information-filled site in the
world, and if it lacks a coherent brand identity, nobody will remember it,
nobody will tell their friends about it, and nobody will bother to bookmark
it and return.
For over 100 years, advertisers have been working to build our joyful world
of branding. When your stomach hurts, you reach for Alka-Seltzer (not an
antacid). Sneeze, and you reach for Kleenex (not a disposable paper tissue).
103
Taking Your Talent to the Web
Figure 3.19
What’s the “best” place
for navigational menus?
That’s up to the web
designer. Caffe Mocha
runs its menu bar
horizontally across the

“friendly” GUI is necessary for a “friendly” company such as AOL. (You in
the back, keep your sarcastic observations to yourself.) It goes without say-
ing that the company’s color scheme, logo, and typographic style must be
reflected in your web graphics and that existing print and other materials
are often a guideline to what is appropriate for the site.
104
WHY: Where Am I? Navigation & Interface: Brand That Sucker!
05 0732 CH03 4/24/01 11:16 AM Page 104
105
Taking Your Talent to the Web
Smart web designers go far beyond the obvious. In addition to graphic
design elements, savvy web folk craft interfaces whose very functioning
reflects and extends the brand. A “fun” brand needs more than cute graph-
ics. Its sectional titles should be fun to read and its menu fun to interact
with. This may mean taking a cue from the world of gaming. It may mean
building the interface in Macromedia Flash.
A movie studio’s interface should not resemble that of a bank. A company
that sells active wear should encourage active participation, through
games, message boards, or contests. A literary site’s interface should qui-
etly promote reading, instead of busily distracting from it with funky danc-
ing icons. (A literary site that avoids long copy belies its own brand
identity.) The interface of a religious organization’s site dare not resemble
that of an e-commerce site, lest visitors along with moneylenders be driven
from the temple.
IBM’s brand image is that of a big-time solutions provider (www.ibm.com).
If you’re asked to design their site, it had better be technologically solid,
visually impeccable, and easy to use. Anything less will send the wrong
brand message.
■ Technologically solid, in this brand context, doesn’t mean a deluge
of plug-ins or a reliance on safe, old 1990s web technologies; it

After all, by agitating for compliance with web standards, we were taking on
giant companies such as Netscape and Microsoft in spite of being a small
grassroots effort. Which tiny creature has the power to disturb a giant? The
wasp. It’s a purposeful, productive beast with a powerful stinger, and while
you may be able to swat away one wasp, you don’t want to mess with an angry
nest. The site’s verbal tone and visual approach came straight out of this sim-
ple little brand image—from the color palette (wasp-yellow, gold, and black)
to the tone of voice (www.webstandards.org).
When Kioken Inc. (www.kioken.com), a leading New York web shop, was
charged with designing a site for the high-end retailer, Barney’s, they
carefully considered the client’s brand identity as a provider of well-made,
tasteful, and luxurious clothing. To put it bluntly, Barney’s goods are well
above the means of most of us working stiffs, and Barney’s customers like
it that way.
Kioken crafted a sophisticated, Flash-based interface like nothing else on
the Web (www.barneys.com). If you were a savvy web user, owned a fairly
powerful PC, had a fast connection, and were equipped with the latest
Flash plug-in, you were treated to a unique showcase of Barney’s clothing.
Just navigating it made you feel smarter than the average web user.
If you were not an experienced web user, owned an old PC, had not down-
loaded the latest Flash plug-in, and were stuck with a slow dialup modem
connection, Kioken (and their client) figured that you were not really a Bar-
106
WHY: Where Am I? Navigation & Interface: Brand That Sucker!
05 0732 CH03 4/24/01 11:16 AM Page 106
107
Taking Your Talent to the Web
ney’s customer anyway. A certain elitism was as much as part of the inter-
face as it is of the store. The Barney’s site may not exemplify democratic
humanism, but it is a perfect web translation of the client’s brand.

system. Working with paper (brought to Europe from China in the twelfth
century), oil-based ink, block print (brought to Europe by Marco Polo in the
thirteenth century) and a wine press, he sets the stage for the mass pro-
duction of books and the wide dissemination of learning.
1836
Cooke and Wheatstone patent the telegraph, thus bringing telecommuni-
cations to the world. For the first time in history, two people can carry on
an argument even when they are miles apart.
1858
The first Atlantic cable is laid across the ocean floor, facilitating telecom-
munications between Europe and the United States. Unfortunately, the
cable goes on the fritz after just a few days. (And you thought your cable
service was bad.) A second attempt in 1866 succeeds. That cable will
remain in service for close to a century.
07 0732 CH04 4/24/01 1:02 PM Page 111
1876
Alexander Graham Bell demonstrates the telephone. The first busy signal
follows soon after.
WHY WE MENTIONED THESE THINGS
The events we just mentioned set the stage for the Internet and thus even-
tually for the Web. Gutenberg’s invention sets in motion the concept that
information belongs to the people (at least, to those people with a few
coins in the pockets of their funny fifteenth-century pants). The subse-
quent technological breakthroughs make possible the eventual sharing of
data via telephone lines.
1945
Vannevar Bush, Science Advisor to U.S. President Roosevelt, proposes
a “conceptual machine” that can store vast amounts of information
linked by user-created associations. He calls these user-generated con-
nections “trails and associations.” Eventually they’ll be called “hyper-

brought human knowledge out of the monastery and into the hands of
ordinary citizens, Jobs and Woz’s invention takes the arcane business of
data crunching out of the realm of Big Science and makes it available to
folks like us. The subsequent Macintosh computer (1984) offers a Graphi-
cal User Interface (GUI), making it easier still for ordinary people to use a
computer. The Graphical User Interface, based on work done in Xerox Parc
in the 1970s, enables people to perform tasks by clicking onscreen icons
and buttons. Most civilians find this easier than memorizing and typing
cryptic commands. A Windows GUI follows in the PC realm. The point-and-
click interface will be key to the eventual acceptance of the Web.
1981
The domain name server (DNS) is developed, thus making the future
safe for web addresses (www.ietf.org/rfc/rfc0799.txt). At first these will
have cryptic numerical “names” such as 191.37.4211, but eventually
consumer-friendly domain names such as brandname.com will take their
place. This is key because advertisers would see little value in adding
“Visit us at 191.37.4211” to the end of their radio commercials but are
113
Taking Your Talent to the Web
07 0732 CH04 4/24/01 1:02 PM Page 113
perfectly happy asking us to visit brandname.com. When advertisers are
happy, they spend money. When money is available, professionals
arise to claim it. The rise of web design and development is thus
partially made possible by the invention of consumer-friendly domain
names.
1984
The Apple Macintosh ushers in an era of “desktop publishing,” empowering
designers to set their own type and place and color-correct their own
images, rather than relying on the skills of third-party service profession-
als. Desktop publishing also empowers ordinary citizens to express them-

will eventually enable citizens to find half-price airline tickets or seek out
information to help their children write school reports. The human and
commercial potential built into that premise will empower the coming
“revolution” of faster and faster networks, and larger and larger web agen-
cies such as Scient, iXL, and Razorfish.
CERN is the biggest Internet site (location) in Europe. Working there is a
young scientist, Tim Berners-Lee.
1990
On the twelfth of November at CERN, Tim Berners-Lee (with R.
Cailliau) invents the World Wide Web, rooting the idea in hypertext:
“HyperText is a way to link and access information of various kinds as a
web of nodes in which the user can browse at will… A program which pro-
vides access to the hypertext world we call a browser… World Wide Web
(or W3) intends to cater for these services across the HEP [High Energy
Physics] community.” (See />Not content with the profundity of this invention, Berners-Lee also devel-
ops a “web browser” on his NeXT machine. With Berners-Lee’s browser, not
only can you view web pages, you can also edit and design them. Fortu-
nately, the “designing” part of the browser does not make it far out of
Berners-Lee’s lab, and thus the way is paved for professional designers and
art directors, rather than scientists, to create the visual language of the
Web. (The original CERN W3 package included a server, a browser, and a
true WYSIWYG editor.)
1991
America Online (AOL) begins offering Internet access in addition to its pro-
prietary content and newsgroup features. Millions of people begin “going
online” thanks to AOL’s easy-to-use point-and-click functionality and con-
sumer-friendly brand imagery. This is important because if the Internet had
115
Taking Your Talent to the Web
07 0732 CH04 4/24/01 1:02 PM Page 115