The Right Priorities

Ideas and energy must dictate.

Entering a new Web page is like finding $10 when you're walking in the park. There's a zap of excitement -- a flash to an unexpected treat. Web pages have that same kind of "found money" energy. It's free, and there's the suspense of the unknown.

Not everyone shares this excitement, however. Many have burned out along the way -- they endured too many torturous downloads to find a 150K staff picture staring back with not hint of usable information. With thinning patience, others become white knuckled at an "Under Construction" sign. Occasionally, the "We need standards" chant arises, although it seldom lasts. A level of discontent exists.

Many forget that they themselves dove into their first few projects with more than a little scorn for users' needs. The user was a secondary, trivial concern. Their content was immensely more important than how the presentation might come across.

The intent of this booklet is not to criticize, not to chide, not to lay down standards. It is to encourage you to continue Web development with all the energy you can bring to bear. Sacrificing your energy to make a better presentation is not worth it. The heck with those who complain; your ideas will carry the day. With that understanding, there are a few things you need to hear at least once, and it's better you hear them from someone who doesn't take format guidelines all that seriously -- someone who believes that underlying ideas are more important.

You should be told that with a few presentation adjustments your ideas will come alive for more people. Some of the changes are trivial; others will require more thought and a rework of your logic. As you go through the following sections, select the guidelines that fit with your style, but be careful not to sacrifice your energy as you do so.

On Being Invisible

Strangely enough, when a software application is called invisible, it's quite a compliment. It means the application fulfills its function so smoothly, so in-sync with the user, that it's no longer noticed.

An invisible application is like a carpenter's hammer. Most builders have a favorite hammer that is so familiar it becomes an extension of their arm. Day after day, week after week, they hammer away automatically, without a thought of appreciation. Rue the day the hammer gets lost or broken, though. Things just won't go right with a substitute, and a finding a replacement becomes a life mission.

When a computer application is so good it becomes invisible, the competition has little chance against your product. When others' pages are harder to navigate, less to the point, users will always come back to yours.

Unfortunately, novice Web designers, in the energy burst that comes with a new venture, often dress up a page more than is necessary. An extra splash of color here, a self-portrait there. They forget that the purpose is not to inflate themselves but to fill a need, to provide a service. Ironically, the less they're noticed, the greater their fame becomes.

The good news is that only a few areas account for most annoyances: readability, speed, needs assessment, and ease of use. Most pages' content and information schema's are acceptable -- it's just a matter of cleaning up the cosmetic issues.

Readability.

A majority of Web pages present written information. The more easily it can be read, the easier the message is to grasp. For those who spend long hours at a computer monitor, readability is critical. At certain levels of fatigue, the eyes start refusing to absorb information.

In printer jargon, readability is the ability to distinguish words and letters. Book printers researched the impact of line spacing, margins, and font types on a person's ability to read with good comprehension.

In a computer oriented environment, the contrast between the letters and the background dictate readability. Several contrast combinations make the screen readable: black on white, yellow on black, bright green on black, and bright blue on black. If you want a message understood, use these color combinations. Pretty, colorful, and otherwise catchy designs must have the right color contrasts, or they reduce the user's ability to understand your message.

Background patterns are at the bottom of the readability index. Not only do these patterns violate the color contrast guideline, they introduce conflicting shapes and images. The mind, which has been raised on standard printed material, has difficulty processing letters floating on top of this mix of symbols.

The selective use of patterns is only common sense. For example, if you wanted to be spotted by a rescue plane, you wouldn't stand in the forest. You'd find a snow covered field and put on black clothing. Words need the same visibility. Keep them away from patterns.

Dictating Action

The ability to anticipate the audience's needs is key in any presentation. If you know why a user stops at your Web site, you can shape your offering to those needs. This may sound fundamental, but many new comers build their pages based on what they know, not on what someone is looking for.

Example:

From menus to status.

The concept of having a choice brings us to the menu screen.

The first advance in user friendly screen design was the Menu. It offered a list of actions and the common prompt: "Select the number of your function and press ENTER." At one time in computer history, this was a heady development. We were catapulted from cryptic parameters with -'s and \ /'s to a menu that asked, "What do you want to do?"

Recent shifts to graphic presentations improved the menu structure. Button and icons replaced numbered choices, but the underlying context remained the action oriented.

Today, however, advanced interface builders are saying:

What would this decision aid look like? In its simplest form, it could remind us to act, warning of low levels, not unlike a car's gas gauge. Rather than waiting for instructions, it could hint, warn, and help us change plans in advance.

Status: Web style.

Unfortunately, the connection of status and action on Web pages is not always obvious.

To understand the connection, let's view a typical Web page. The most common pages are action oriented: read the news section, find a research reference, and get new e-mails. The user knows what he/she wants to do and arrives at the page ready to take action.

Understanding that their services function on the action level, Web developers must ask:

This is a dimension changing question. It puts the Web developers on the next level of service -- they begin thinking at the decision level, not limiting themselves to after the fact requests. They step into the realm of advice and guidance. Helping with decisions will make your page stand out. It's not common for Web services to be that proactive.

Example:

Traditional business operations have a full range of status to keep track of: delivery dates, expiration dates, scheduled meeting, and high/low supply levels. Web pages have: download times, last changed dates, file sizes, search relevancy, or usage rating. These are the raw data of useful status.

Examples:

The trick for Web designers is to change perspective from action oriented to decision oriented. They must continually ask, "What should the user consider before they take this action? How could I help with that?"

Once the decision choices are understood, another level surfaces: the action could be taken automatically. E-mail would be broken into content categories; home pages would suggest and direct optimum usage; a robot operated status sheet would suggest study, career, and sales segment programs.

How would this shift relate to the average Web page usage? If you can tune your pages to the status and needs of the user, users will return more readily, and they'll be quicker to sign up for products and services. As users weigh the use of your page against other similar pages, you will come out ahead because you take the person to their next level of functioning -- you help with their decisions.

Design territory: inside the user's head.

To design the right mix of status and anticipated action into your pages, you must shift your perspective from what you know to what the user needs.

For example, let's look at a design session for a Web news service:

Several creative slants were unfolding. First, Sue noted that people have different news interests, and rather than attempting a broad, thin presentation, it would be better to decide what is important. This is not a trivial shift. It means moving from what a reporter may have to say, to reporting what the users need.

Next, noting how a warning message would be useful in extreme conditions is a change from simply reporting the news. It is evaluating the effect of news on the individual and taking an appropriate action.

Also, the concept of status was introduced. As every category becomes more complex, it becomes necessary to maintain the broader view. This applies to following a local team and to tracking technology advances. Even though the team might have lost, in the larger context, they still maintained first place; even though Oracle came out with a new replication service, four others also did so.

Giving advise.

Status helps us decide what to do next. If a pot is boiling over, I need to turn down the heat. Many times the status is obvious, and the recommendation to action is the focus. However, if boiling water was automated, I would rather not be told it was boiling over. I would rather be notified of the action after it was taken automatically. Better yet, don't tell me anything, just serve the food. A summary status might be more appropriate -- a notice indicating pots are always boiling over. A recommendation for regulation might follow.

Recommendations play an important role in Web pages that sell similar products. Help the customer. Give them suggestions backed with pros and cons. In cases where status is not enough, make specific product recommendations.

Example:

On Annoyance

Clutter and distractions.

Making me work.

The products and services your page offers should be accessible right from the start. Give me the chance to find it quickly.

When I go into a hardware store for a hammer, I don't want to search four acres of tool bins to find it. My preference would be have it on display just I came into the store.

In the hardware store, I don't want to wander; on a Web page, I don't want to scroll and follow vague links. Put the key options on the first page. And make them concrete. References on the front page are perfect -- I can go directly to my destination.

People come to your site looking for something specific. If they're browsing, chances are they'll never find their way back to your page again. But users who have come with a mission don't want to be told to look around until they stumble across the items they're looking for. Give it to them immediately, or tell them how to get there. And please don't make them wait for a bunch of images that have nothing to do with the search.

Loading times.

If you combine a useless first page with slow loading images, to the best of my ability I will never, ever come back to your page. If the images are relevant, the wait might be bearable, otherwise it is rude to make me wait.

The annoyance factor is so severe, that my advice is to error on the side of speed. Don't put large images on the front page. If the images are essential, place them several pages down in the page layout. If I seek them out specifically, I'll have more patience for their download time.

On the side of the Web page builder, it is easy to overlook the loading time. The page doesn't take as long to load on a test system with its memory and disk caches. In the turmoil of a development project, how things appear on another system can easily be forgotten. When you see an image load in .5 seconds, there isn't much empathy for the someone who might experience a 20 second load.

Urge to return.

A precursor to the "urge to return" is the "urge to not return." Any annoyance from loading speed, readability, and clumsiness due to paging and useless links must be removed. Only with the annoyances removed does your page have a chance to motivate users to return.

Although removing annoyances is important, the act of irritating users doesn't always have an immediate effect. If, for example, your page is cluttered, but you offer a service that's essential to my work, I will return in spite of your shortcomings. Your service outweighs my irritations. However, once a more streamlined alternative exists, I'm gone.

Example:

Why am I here?

Satisfying all visitors can be tricky, because their individual needs can be diverse. Some may come with a specific questions, others with a complaint, and yet others out of curiosity.

Anticipating the requests and offering options on the first page is fundamental. It surprises me that elaborate displays and promotional pitches ignore this common courtesy. Even an aggressive shoe sales person will ask, "Can I help you?"

Example:

This front page is user oriented. It allows the greatest number of users to address their needs quickly and clearly.

Spirit of the internet.

When I'm visiting a site, I appreciate being offered something of value for no charge. It's a neighborly gesture in the cooperative spirit of the internet.

Putting up a version of the company brochure does not provide this exchange. Your offering should have value and is best if it conveys a part of yourself. For lack of a demo product offering, you might install a category called "Hot Topic of the Week" and lead with a question you genuinely consider worth discussing. It could be "Why IBM is doing well?" Include ten of the best replies you've heard at the water cooler. Don't sell anything, offer real insight.

With the speed of technical change, many are looking for guidance and insight into decisions that are best for their industry. This is your opportunity to lead -- offer a series of white papers on current trends and dilemmas. Don't worry about who sees it, leaders guide entire industries. It will be obvious to your customers when your competition proposes your suggestions.

Additional Reading

About Face: The Essentials of User Interface Design by Alan Cooper. IDG Books Worldwide, 1995.

Tog on Interface by Brude Tognazzini. Addison-Wesley, 1992.

| Web Booklets | AWSS Home | Your feedback is important: Jim Davis