|
Petdata.com
is an excellent example of creative menus used to present many options
in a small space. Rather than tucking drop-down menus into a corner,
the designer here has used them as part of the design. This is a pure
information site, which demands instant access to site features from
the entry page. Not all their data in place yet, but the entry page
is an excellent example of integrating design and navigation.
Burpee.com
provides access to a wealth of information on every page. We will
take a closer look at this site.
Diamonds.com is
one of my design projects. I worked closely with the company to establish
information flow and priority before designing the graphics and navigation.
We will look at the process and methods later in this article.
|
|
Remember when the Web was new and designing sites was relatively
easy? For those of you who have entered the field recently, you may
not remember the sites with just a few pages, with three or four menu
items for the entire site. Designers around the world started educating
clients about the benefits of interactive sites that provided real
value to the visitor.
Well, guess what? That crusade was successful. Clients now want everything
a visitor could ever want to know at their fingertips. Have we created
our own monster? Exactly how do you fit 54 menu items into a space
that is ideally less than 800 pixels wide, and even better if you
can hit less than 600 pixels in width? Monster from a design standpoint
is probably accurate, but the rewards are worth it, and one of the
reasons professionals are hired when amateurs charge so little.
Perhaps 54 menu items is a slight exaggeration for most sites, but
there is certainly a high demand to make navigation very simple for
visitors. Some designers turn to frames, but many also refuse to use
them except in very special circumstances. Most designers are vigilant
in seeking new ways to fit navigation into their pages, without sacrificing
visual appeal, or content area. I am going to take a few pages to
look at some menu creation ideas, and tell you how to create that
look in a variety of programs.
This is not a coding exercise. I will not be doing DHTML menus (our
own DHTML expert, Peter Belesis, has the most phenomenal selection
of menu tutorials on the Web at the Dynamic HTML
Lab). I will not be discussing the JavaScript behind any type
of menus. Again, our resident Guru, Doc JavaScript
is far better qualified to take you through those codes. Wondering
about the HTML code associated with menu construction? Stephanos Piperoglou
can guide you through the intricacies of your HTML code and CSS positioning
in HTML with Style.
Before you judge the previous paragraph as a WebReference commercial
break, make a trip to the referenced sites. They are the first stop
I make when I have a question ... because I hate wasting time. If
you are looking for in-depth knowledge, they cannot be beat.
So, if I am not doing the code, what the heck can I put in a menu
article. Lots! In fact, I am planning to feature menus on a regular
basis. The topic is unlimited, and a menu that services visitor needs,
while blending seamlessly into a unified graphic look is one of the
main things that defines a professional Web designer.
To start this topic off right, we must look at planning. You cannot
move to the graphic design part of a site without a plan. How can
you choose the look, and then execute it, if you have not identified
what features your visitor will want, and how best to provide the
route they need? I will be using the Burpee Seed Catalogue site as
an example for this section. This site packs an amazing amount of
information into a small space.
We will also take a peek at a site that I did for a client. This
site was my biggest navigational challenge to date, and involved close
work with the company to place the right information in visitor's
hands at the right time. We'll look at why and how we did what we
did.
So, we have some theory to go through before we get to the stuff
you love – firing up the graphics programs. But one cannot exist
without the other. Without adequate planning, designing a menu is
no more than a gamble. It may be pretty, but that counts for little
if the visitor cannot find the information they desire. Sometimes
you get lucky and stumble on the right way to present information.
But like any gambling, sometimes you lose. Gambling is fine for playtime
and personal sites. Client work takes careful and skilled planning.
|
