When thinking about navigation, Web designers consider
• Information design: In
a far broader topic, information design, Edward Tufte has shown how
different kinds of information can be presented so that it’s best
understood. Of special interest to Web navigation design is the notion
that information is the interface. In other words, navigation is
information arranged so that users can find what they want.
Neither Tidwell’s nor Tufte’s concepts can be
summarized in a tidy definition. The idea of interaction is one of
responding to another action, such as two people having a discussion.
That’s social interaction and it’s something we do all the time —
including interaction mediated by the computer, such as text chats. The
same concept applies to treating a Web page as a stand-in for another
person. The user does something, and the Web page responds from a
finite set of choices created by the designer. The better the job that
the designer does, the more natural it feels to the user. Trying to
create an environment of comfortable interaction is the goal of good
interaction design.
Designer navigation and user navigation
Navigation design contains an almost limitless
number of possibilities, and you want to set up your navigation so that
users easily can get around. The first thing to ask yourself is, “Who
is the typical user?” Then, say to yourself, “It ain’t me, babe.” If
you remember the title to that old Bob Dylan song, you’ll be on the
right track. Jennifer Tidwell points out that a maxim in interface
design is, “Know thy users, for they are not you!” Two corollaries can
be added to that maxim:
• The better the designer, the more likely the interface will be bad.
• Excellent developers almost always make bad interfaces.
So, if you aspire to be either a great designer or
a developer, you’re likely to make a bad interface unless you pay
attention. Here’s why: Great designers focus on how the page looks, not
on the users’ ability to navigate a site. Designers want to display
their creativity, and that’s a good thing. However, when that
creativity is such that users can’t navigate from one page to another,
there’s a problem.
One of the worst user interfaces ever devised was
on New York’s Museum of Modern Art (MoMA) site. The navigation was
based around a stack of cubes with no labels. Users were supposed to
place their mouse over each cube and a label would appear with the name
of the linked item. In order for the MoMA site to work, some fancy
coding was required under the hood. The code would warm the cockles of
any developer’s heart, but it led to a disaster because, like the
designer, the developer was thinking about what a talented coder he was
and not about the user experience. Getting the link name to pop up when
the mouse moves over it takes some coding talent that the designer did
not posses. So, if you want to make a really terrible navigation system
combine the best designer and the best developer!
Can you be a good designer and/or developer and
still create good interfaces? Sure, but you have to think about it. You
must take the view of your typical user into consideration. Who are
your users? Are they children or adults? Is your audience men, women,
or both? What age group? What is the user’s style? Are they
businesspeople? If so, what kind of business and where are they in the
organization? Are they managers or are they the people who do the
actual work? Find out who your users are. (You already know who you
are.)
If you’re a designer and you’re making a Web site
for other Web designers, do you want to show them what a good designer
you are or how they can become better designers? Likewise, if you’re a
developer and you’re making a site for other developers, you definitely
want to show them code that will allow them to do some seriously sick
programming. Developers want to see some code. However, designers do
not want to see code — they’re more interested in design tools and
techniques, not code. (Of course designers, love CSS3 code!) Work what
your user base wants into your navigation plan.
The very best way to find out if your interface is
good is to test it with typical users. If you’re making an educational
site for third-graders, you want third-graders to test it. Likewise, if
you’re selling haute couture to wealthy women, you don’t want teenage
girls to test your navigation. It may take a little extra time, but
you’ll have a far better site if you test your site with the type of
audience who will use it.
Knowing your users does not mean that you have to
have dowdy design or use low-end technology in your site. What it means
is that you need to get to know your users and find out what they think
your site will do for them. You’re not going to change your users. Make
your site for them, not for you. If the site is not for your users,
they won’t return.
Global navigation
Global navigation in Web pages refers to broad
navigation categories that can be placed on every page in a Web site.
Global navigation helps users keep track of where they are in a site,
so no matter where they go, they’ll see a familiar road map.
In mapping out a trip from Santa Barbara,
California, to Ocean City, New Jersey, you’ll find major interstate
highways. The links go from I-210 > I-15 > I-40 > I-44 >
I-70 and finally to I-76. These might be considered the global elements
in the 3,000-mile trip from coast to coast. However, between the major
interstate highways, you’ll find smaller connector roads such as
CA-134E that connects US-101 with I-210.
Similarly in global navigation, you must consider
navigation between the major links. For example, suppose you have a big
site with the global navigation broken down into three categories:
• Animal
• Vegetable
• Mineral
That’s certainly global and links would fit nicely on every page like the following:
Animal | Vegetable | Mineral
However, within each of those general categories,
you’re going to need something more specific. For example, suppose a
user wants to find a breed of dog — a Greater Swiss Mountain Dog. The
following path would be a possible one depending on the designer:
Animal
Mammal
Dog
Breeds
Greater Swiss Mountain Dog
Each submenu will have lots of choices, so let’s
consider what elements are available in HTML5 to handle these
navigation paths from global navigation.
