Homepages are the most valuable real estate in the
world. Each year, companies and individuals funnel millions of dollars
through a space that's not even a square foot in size. For good reason.
A homepage's impact on a company’s bottom line is far greater than
simple measures of e-commerce revenues: The homepage is your company's
face to the world. Increasingly, potential customers will look at your
company's online presence before doing business with you -- regardless
of whether they plan to close the actual sale online.
The homepage is the most important page on most websites, and gets more
page views than any other page. Of course, users don't always enter a
website from the homepage. A website is like a house in which every window
is also a door: People can follow links from search engines and other
websites that reach deep inside your site. However, one of the first things
these users do after arriving at a new site is go to the homepage. Deep
linking is very useful, but it doesn't give users the site overview a
homepage offers -- if the homepage design follows strong usability guidelines,
that is.
Following are ten things you can do to increase the usability of your
homepage and thus enhance your website's business value.
Make the Site's Purpose Clear: Explain
Who You Are and What You Do
1. Include a One-Sentence Tagline
Start the page with a tagline that summarizes what the site or company
does, especially if you're new or less than famous. Even well-known companies
presumably hope to attract new customers and should tell first-time visitors
about the site’s purpose. It is especially important to have a good
tagline if your company's general marketing slogan is bland and fails
to tell users what they’ll gain from visiting the site.
2. Write a Window Title with Good Visibility in Search Engines
and Bookmark Lists
Begin the TITLE tag with the company name, followed by a brief description
of the site. Don't start with words like "The" or "Welcome
to" unless you want to be alphabetized under "T" or "W."
3. Group all Corporate Information in One Distinct Area
Finding out about the company is rarely a user’s first task, but
sometimes people do need details about who you are. Good corporate information
is especially important if the site hopes to support recruiting, investor
relations, or PR, but it can also serve to increase a new or lesser-known
company's credibility. An "About <company-name>" section
is the best way to link users to more in-depth information than can be
presented on the homepage.
Help Users Find What They Need
4. Emphasize the Site's Top High-Priority Tasks
Your homepage should offer users a clear starting point for the main one
to four tasks they'll undertake when visiting your site.
5. Include a Search Input Box
Search is an important part of any big website. When users want to search,
they typically scan the homepage looking for "the little box where
I can type," so your search should be a box. Make your search box
at least 25 characters wide, so it can accommodate multiple words without
obscuring parts of the user's query.
Reveal Site Content
6. Show Examples of Real Site Content
Don't just describe what lies beneath the homepage. Specifics beat abstractions,
and you have good stuff. Show some of your best or most recent content.
7. Begin Link Names with the Most Important Keyword
Users scan down the page, trying to find the area that will serve their
current goal. Links are the action items on a homepage, and when you start
each link with a relevant word, you make it easier for scanning eyes to
differentiate it from other links on the page. A common violation of this
guideline is to start all links with the company name, which adds little
value and impairs users' ability to quickly find what they need.
8. Offer Easy Access to Recent Homepage Features
Users will often remember articles, products, or promotions that were
featured prominently on the homepage, but they won't know how to find
them once you move the features inside the site. To help users locate
key items, keep a short list of recent features on the homepage, and supplement
it with a link to a permanent archive of all other homepage features.
Use Visual Design to Enhance, not Define, Interaction
Design
9. Don't Over-Format Critical Content, Such as Navigation Areas
You might think that important homepage items require elaborate illustrations,
boxes, and colors. However, users often dismiss graphics as ads, and focus
on the parts of the homepage that look more likely to be useful.
10. Use Meaningful Graphics
Don't just decorate the page with stock art. Images are powerful communicators
when they show items of interest to users, but will backfire if they seem
frivolous or irrelevant. For example, it's almost always best to show
photos of real people actually connected to the topic, rather than pictures
of models.
Dimensionality
Print design is 2-dimensional, with much attention paid to layout. It
is obviously possible for the reader to turn the page, but substantial
interplay between different spreads is rare. Typically, each view is a
design unit created for a fixed size canvas - often a big canvas when
designing newspapers or posters.
In contrast, Web design is simultaneously 1-dimensional and N-dimensional.
A web page is fundamentally a scrolling experience for the user as opposed
to a canvas experience. A small amount of 2-dimensional layout is possible,
but not to the extent of creating a pre-planned experience with a fixed
spatial relationship between elements. Users often begin scrolling before
all elements have been rendered, and different users will scroll the page
in different ways throughout their reading experience.
Precise placement of elements on a web page goes against the nature of
HTML and can only be achieved to an approximation for pages that are able
to adjust to different window sizes. Thus, 2-dimensional relationships
between page elements are less important than 1-dimensional relationships
(what's early on the page; what's later on the page).
Navigation
The N-dimensional aspect of web design follows from the hypertext navigation
that is the essence of the Web. Moving around is what the Web is all about.
When analyzing the "look-and-feel" of a website, the feel completely
dominates the user experience. After all, doing is more memorable and
makes a stronger emotional impact than seeing.
In print, navigation mainly consists of page turning: an ultra-simple
user interface which is one of the printed medium's great benefits. Because
page turning is so limited, it is often not even thought of as a design
element. In contrast, hypertext navigation is a major component of web
design, requiring decisions like
appearance
of links
how to explain
where users can go and where each link will lead
visualization
of the user's current location
information
architecture
Response Time, Resolution, and Canvas Size
Print is immensely superior to the Web in terms of speed, type and image
quality, and the size of the visible space. These differences are not
fundamental. We will eventually get:
bandwidth
fast enough to download a Web page as fast as one can turn the page in
a newspaper
screen resolution
sharp enough to render type so crisply that reading speed from screens
reaches that of paper
huge screens
the size of a newspaper spread - in fact, I think that newspaper-sized
screens are about the limit where it may not make sense to make screens
any larger
For the next ten years or so, the differences will remain and will dictate
restrictions on web design: less graphics, smaller graphics, shorter text
(since it is unpleasant to read online), less fancy typography (since
you don't know what fonts the user has installed), and less ambitious
layouts.
Even when we get perfect hardware in ten years, it will continue to be
necessary to limit the word count since users are more impatient online
and are motivated to move on. It will also be necessary to design web
information for small-canvas layouts since portable devices will retain
small screens even as we get huge screens in the office.
I predict that new, non-window-based screen management techniques will
appear that will allow more interesting utilization of the future huge
displays. A bigger display doesn't simply imply larger windows, even though
some systems currently promote the notion of "maximization"
as the ultimate user goal.
Multimedia, Interactivity, and Overlays
Print can stun the reader with high-impact visualization, but the online
medium ultimately wins because of the user engagement that is made possible
by non-static design elements. The Web can show moving images under user
control and it can allow the user to manipulate interactive widgets. In
the future, it will also be possible to use alpha-channel blending and
overlay multiple layers of information.
Basic web technology easily allows an interactive map of Chile where the
user can click on a city or region to go to a specialized page with more
in-depth information. An even greater amount of engagement follows from
a more closely integrated interactive visualization where pointing to
objects results in explanations or expansions in context, possibly using
pop-ups, overlays, or voice-over. Such highly interactive information
graphics require the use of non-standard technology and are therefore
not currently recommended on mainstream web pages, but they can be used
in specialized services and will hopefully become a common part of the
Web's future.
Respect (no, Relish) the Differences
Anything that is a great print design is likely to be a lousy web design.
There are so many differences between the two media that it is necessary
to take different design approaches to utilize the strengths of each medium
and minimize its weaknesses.
Print design
is based on letting the eyes walk over the information, selectively looking
at information objects and using spatial juxtaposition to make page elements
enhance and explain each other.
Web design
functions by letting the hands move the information (by scrolling or clicking);
information relationships are expressed temporally as part of an interaction
and user movement.
With better hardware, differences in terms of appearance and layout may
diminish. At the same time, more powerful software and a better understanding
of interactive information objects will increase the differences in terms
of interaction and user control. Current web designs are insufficiently
interactive and have extremely poor use of multimedia. It is rare to see
a web animation that has any goal besides annoying the user.
Print design is highly refined, as evidenced by glancing through the recent
book of award-winning designs. Web design is impoverished because too
many sites strive for the wrong standards of excellence that made sense
in the print world but do not make sufficient advances in interactivity.
|