The Elements of User Experience

A basic duality: The Web was originally conceived as a hypertextual information space; but the development of increasingly sophisticated front- and back-end technologies has fostered its use as a remote software interface. This dual nature has led to much confusion, as user experience practitioners have attempted to adapt their terminology to cases beyond the scope of its original application. The goal of this document is to define some of these terms within their appropriate contexts, and to clarify the underlying relationships among these various elements.


Web as software interface

Visual Design: graphic treatment of interface elements (the "look" in "look-and-feel")

Interface Design: as in traditional HCI: design of interface elements to facilitate user interaction with functionality

Information Design: in the Tuftean sense: designing the presentation of information to facilitate understanding

Interaction Design: development of application flows to facilitate user tasks, defining how the user interacts with site functionality

Functional Specifications: "feature set": detailed descriptions of functionality the site must include in order to meet user needs

User Needs: externally derived goals for the site; identified through user research, ethno/techno/psychographics, etc. Site Objectives: business, creative, or other internally derived goals for the site





Web as hypertext system

Visual Design: visual treatment of text, graphic page elements and navigational components

Navigation Design: design of interface elements to facilitate the user's movement through the information architecture

Information Design: in the Tuftean sense: designing the presentation of information to facilitate understanding

Information Architecture: structural design of the information space to facilitate intuitive access to content

Content Requirements: definition of content elements required in the site in order to meet user needs

User Needs: externally derived goals for the site; identified through user research, ethno/techno/psychographics, etc.

Site Objectives: business, creative, or other internally derived goals for the site

The Nine Pillars of Successful Web Teams

The most successful Web teams build their team structures and their
processes on these nine essential competencies:




Project Management: The hub that binds all the tactical competencies
together as well as the engine that drives the project forward to completion,
project management requires a highly specialized set of skills all its own.
Neglecting this area often results in missed deadlines and cost overruns.


Concrete Design: Before the abstract design can become a fully realized
user experience, you must determine the specific details of interfaces,
navigation, information design, and visual design. This realm of concrete
design is essential to creating the final product.


Content Production: Knowing what content you need isn't enough. You also
need to know how you'll produce it. Gathering raw information, writing and
editing, and defining editorial workflows and approvals are all part of content
production.


Technology Implementation: Building technical systems involves a lot of
hard work and specialized knowledge: languages and protocols, coding and
debugging, testing and refactoring. The more complex your site, the more
important a competency in technology implementation becomes.

Abstract Design: Information architecture and interaction design translate
strategic objectives into a conceptual framework for the final user
experience. These emerging disciplines addressing abstract design are
increasingly recognized for their value in the Web development process.


Content Strategy: Content is often the reason users come to your site. But
what content can you offer to meet your users' expectations? How much
content is appropriate, and what form should it take? What style or tone
should it have? Before you can produce that content, you need to answer
fundamental content strategy questions such as these.


Technology Strategy: Web sites are technologically complex, and getting
more intricate all the time. Identifying the technology strategy for the site –
platforms, standards, technologies, and how they can all interoperate – is
essential to avoiding costly mistakes.


Site Strategy: Defining your own goals for the site can be surprisingly
tricky. Arriving at a common understanding of the site's purpose for your
organization, how you'll prioritize the site's various goals, and the means by
which you'll measure the site's success are all matters of site strategy.


User Research: User-centered design means understanding what your
users need, how they think, and how they behave – and incorporating that
understanding into every aspect of your process. User research provides the
raw observations that fuel this insight into the people your site must serve.

The Four Inch Rule

Zeldman writes, "We've debated the issue for four years, but the truth is, nine times out of ten, the 'best' web layout is the one which fully embraces the medium, by allowing itself to reflow as it is poured into different readers' individual computing setups." There is an unspoken rule in print which states that text should not exceed four inches in width on a page. Any text less than four inches is more readable than any text over four inches--the reader's whiplash will speak for itself. In following this rule we can incorporate the same concept into web design with a fixed-width table inside of a 100% width table, as is the case with Digtal-Web.com. Doing this not only allows for better readability at higher resolutions, but it also allows the designer to incorporate the proper blank space needed to make the page appear more aesthetically pleasing to the eye.

Navigation mechanisms

GUI users employ menus, trees, lists, dialogs, and wizards, and receive near instant response time. Navigation mechanisms are standardized by UI toolkits and style guides. They are supplementary to the information in the client area. Navigation is a weakly-established concept in GUI applications -- function/action dominates, and navigation is sometimes a side effect. Some push buttons cause navigation, others don't. For example, the OK, Cancel, and Help buttons shift the user's focus to a different window while Apply does not. The ellipsis on "routing" menu choices, like "Save as..." conveys a fairly strong sense of navigation. Wizards also create a strong sense of navigation forward and backward in a basically straight-line sequence of dialogs.

For Web users, navigation is a significant and highly visible concept. Web users employ links and bookmarks, and they type URLs. Latency is very significant. Only a few standards are well established, such as the Back button. Navigation mechanisms are more typically an inherent part of the page design, therefore there tends to be quite a bit of variation, or lack of consistency. This is one of the most confusing aspects for users.

The notion of place, or establishing a context so that users know where they are and where they can go is extremely important on the Web. Designers can employ two basic paradigms -- go to and bring to me. In the "go to" paradigm users consciously choose to go elsewhere, and are aware when they take such a link. The context changes distinctly and users are not surprised. In the "bring to me" paradigm, users essentially ask that information be "brought to them" within the context of the current page. This paradigm preserves context, stability, and a sense of place. Each paradigm is appropriate to specific situations, but that's another article.

A few practical guidelines

To ensure a positive user experience and encourage users to remain in flow while using a website, consider the following guidelines:

• don't use pop-up windows
• make form follow function
• use as much of the screen area as possible
• guide users with sensitive feedback
• consider the software users will be viewing the website within
• make sure the Back Button works properly

Websites that have good posture, in line with the extent of interaction that typical users will be required to perform, will succeed in maintaining user flow. If those websites also have good manner, users will perceive the site to be helpful and professional. What kind of website would you choose: an unhelpful, complicated, interrogative website or a helpful, simple, and informative one? The answer is probably obvious, and it's just as simple for ordinary users.

What is design

Design is everywhere - and that's why looking for a definition may not help you grasp what it is.

Design is everywhere. It's what drew you to the last piece of furniture you bought and it's what made online banking possible. It's made London taxi cabs easier to get in and out of and it made
Stella McCartney's name. It's driving whole business cultures and making sure environments from hospitals to airports are easier to navigate.

The single word 'design' encompasses an awful lot, and that's why the understandable search for a single definition leads to lengthy debate to say the least.

There are broad definitions and specific ones - both have drawbacks. Either they're too general to be meaningful or they exclude too much.

One definition, aired by designer Richard Seymour during the Design Council's Design in Business Week 2002, is 'making things better for people'. It emphasises that design activity is focused first and foremost on human behaviour and quality of life, not factors like distributor preferences. But nurses or road sweepers could say they, too, 'make things better for people'.

Meanwhile, a definition focused on products or 3D realisations of ideas excludes the work of graphic designers, service designers and many other disciplines. There may be no absolute definitions of design that will please everyone, but attempting to find one can at least help us pin down the unique set of skills that designers bring to bear.


Translation

Design could be viewed as an activity that translates an idea into a blueprint for something useful, whether it's a car, a building, a graphic, a service or a process. The important part is the
translation of the idea, though design's ability to spark the idea in the first place shouldn't be overlooked.

Scientists can invent technologies, manufacturers can make products, engineers can make them function and marketers can sell them, but only designers can combine insight into all these
things and turn a concept into something that's desirable, viable, commercially successful and adds value to people's lives. There are many misconceptions about design. Sunday supplements and glossy magazines often use 'design' as a buzzword denoting style and fashion. While the toaster or corkscrew being featured may be well designed, the result is to feed the belief of would-be design clients that design is restricted to the surface of things and how they look, and that it's best employed at the end of the product development process. But good design isn't simply about the surface. Aesthetics are important, but only a part of a bigger picture.

Design is fundamental. People often need reminding that everything around us is designed and that design decisions impact on nearly every part of our lives, be it the environments we work in,
the way we book holidays, or the way we go about getting get the lid off the jam jar. When those things work, it's taken for granted, but, as Bill Moggridge, founder of international consultancy IDEO, says: 'A lot of trial and error goes into making things look effortless.'


Design and the user

Good design begins with the needs of the user. No design, no matter how beautiful and ingenious, is any good if it doesn't fulfil a user need. This may sound obvious but many products and services, such as the Sinclair C5, Wap mobile phone services, and a great many dot com businesses failed because the people behind them didn't grasp this.

Finding out what the customer wants is the first stage of what designers do. The designer then builds on the results of that inquiry with a mixture of creativity and commercial insight.
Although gut instinct is part of the designer's arsenal, there are more scientific ways of making sure the design hits the mark. Different designers use different methods - combining market
research, user testing, prototyping and trend analysis. Any product launch is ultimately a gamble, but these methods help decrease the risk of failure, a fact that often comes as a surprise to clients.


Creativity

A design doesn't have to be new, different or impressive to be successful in the marketplace, as long as it's fulfilling a need, but design methods do lead to innovative products and serivces.
Designers learn that ideas that may seem strange are worth exploring and that the 'common-sense' solution is not always the right one. Designers often hit on counter-intuitive concepts through methods such as drawing, prototyping, brainstorming and user testing. Watching users in real-world situations especially gives insights into their behaviour that lead to ideas that wouldn't have formed had the designer simply thought about the situation, or relied on generalised market research.


Design and Business

Designers, unlike artists, can't simply follow their creative impulses. They work in a commercial environment which means there is a huge number of considerations that coming to bear on
the design process.

Designers have to ask themselves questions such as: is the product they're creating really wanted? How is it different from everything else on the market? Does it fulfil a need? Will it cost too much to manufacture? Is it safe?

Emphasis on the customer makes design a formidable weapon for any business. Companies have often designed their way out of failure by creating a product that serves the customer's needs
better than its rivals'. Design delivered the operating-system market to Microsoft, rescued Apple Computer and made Sony an electronics giant. A Design Council study has shown that
design-led businesses on the FTSE 100 out-performed the index by 25%.

Putting an emphasis on design brings creativity into an organisation and increases the chance of producing market-leading, mould-breaking products. As the sophistication of the consumer and global competition increases, this becomes more and more valuable.

Businesses are finding that they can no longer compete just by slashing prices or upping the marketing budget. Innovation in the form of design is the key to success.


Design and public services

Billions are poured into public services every year but, despite the UK being home to a huge variety of top design talent, our best designers are rarely involved in public sector work.
Design can help public services in a number of ways, from making sure products and services meet the needs of users to increasing innovation within organisations and bringing new perspectives to issues such as procurement.

Ten Good Deeds in Web Design

When analyzing Web design, it is easy to identify a large number of mistakes that reduce usability:

• the original top-ten mistakes of Web design
• the top-ten new mistakes of Web design
• the top-ten mistakes of Web project management

It is much harder to say what good things to do since I have never seen a website that was truly stellar with respect to usability. The best major site was probably amazon.com as of late 1998, but during 1999 Amazon declined in usability due to the strategy of blurring the site's focus.

Of course, articles that list 30 mistakes can be seen as constructive criticism and a prescription for 30 things to do in a Web project: design to avoid each of the mistakes!

Here's a list of ten additional design elements that will increase the usability of virtually all sites:

1. Place your name and logo on every page and make the logo a link to the home page (except on the home page itself, where the logo should not be a link: never have a link that points right back to the current page).


2. Provide search if the site has more than 100 pages.


3. Write straightforward and simple headlines and page titles that clearly explain what the page is about and that will make sense when read out-of-context in a search engine results listing.


4. Structure the page to facilitate scanning and help users ignore large chunks of the page in a single glance: for example, use grouping and subheadings to break a long list into several smaller units.


5. Instead of cramming everything about a product or topic into a single, infinite page, use hypertext to structure the content space into a starting page that provides an overview and several secondary pages that each focus on a specific topic. The goal is to allow users to avoid wasting time on those subtopics that don't concern them.


6. Use product photos, but avoid cluttered and bloated product family pages with lots of photos. Instead have a small photo on each of the individual product pages and link the photo to one or more bigger ones that show as much detail as users need. This varies depending on type of product. Some products may even need zoomable or rotatable photos, but reserve all such advanced features for the secondary pages. The primary product page must be fast and should be limited to a thumbnail shot.


7. Use relevance-enhanced image reduction when preparing small photos and images: instead of simply resizing the original image to a tiny and unreadable thumbnail, zoom in on the most relevant detail and use a combination of cropping and resizing.


8. Use link titles to provide users with a preview of where each link will take them, before they have clicked on it.


9. Ensure that all important pages are accessible for users with disabilities, especially blind
users.


10. Do the same as everybody else: if most big websites do something in a certain way, then follow along since users will expect things to work the same on your site. Remember Jakob's Law of the Web User Experience: users spend most of their time on other sites, so that's where they form their expectations for how the Web works.

Finally, always test your design with real users as a reality check. People do things in odd and unexpected ways, so even the most carefully planned project will learn from usability testing.

Top Ten Guidelines for Homepage Usability

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 " section is the best way to link users to more in-depth information than can be presented on the homepage. (See also my report with 50 guidelines for the design of "about us" areas of corporate websites.)


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.
(Update: Based on more recent findings, my recommendation is now to make the search box 27 characters wide. This and other new guidelines are covered in my tutorial on Fundamental Guidelines for Web Usability at the Usability Week 2008 conference in New York, San Francisco, London, and Melbourne.)


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.

The Ten Most Violated Homepage Design Guidelines

1. Emphasize what your site offers that's of value to users and how your services differ from those of key competitors

Compliance rate: 27%
Guideline number in Homepage Usability book: 3

This is one of the most important issues in homepage design, so it's particularly sad that it's the least followed of all the guidelines. Websites are incredibly bad at explicitly stating what they offer users. Instead, they hide their offerings in generic marketese that makes very little impression on prospective customers.

Remember: when users have needs, they typically query search engines and allocate only a few seconds to scan each of the sites that the search engine drags up.


2. Use a liquid layout that lets users adjust the homepage size

Compliance rate: 28%
Guideline number in Homepage Usability book: 67

Fighting frozen layouts seems a lost battle, but it's worth repeating: different users have different monitor sizes. People with big monitors want to be able to resize their browsers to view multiple windows simultaneously. You can't assume that everyone's window width is 800 pixels: it's too much for some users and too little for others.


3. Use color to distinguish visited and unvisited links

Compliance rate: 33%
Guideline number in Homepage Usability book: 37

Knowing where you've been is one of the three basic features that all navigation designs should support. (The other two are "Where am I?" and "Where can I go?")

It's sad that only a third of corporate homepages tell users at a glance which site areas they've already seen. Navigational confusion results when designers disable one of the few useful features of a standard Web browser: having visited and unvisited links appear in different colors. Our testing has shown that violating this guideline is particularly harmful for elderly users.

> More on changing link colors


4. Use graphics to show real content, not just to decorate your homepage

Compliance rate: 35%
Guideline number in Homepage Usability book: 56

For example, use photos of people who have an obvious connection to the content as opposed to using models or generic stock photos. People are naturally drawn to pictures; gratuitous graphics can distract users from critical content.

Stock photography sellers are doing a brisk business, but users don't believe that your product will make them happy just because there's a smiling lady on your homepage. Better to show your actual product.


5. Include a tag line that explicitly summarizes what the site or company does

Compliance rate: 36%
Guideline number in Homepage Usability book: 2

Our recent study of how people use "about us" information on websites did find that most users could eventually dig up information about a company's purpose. But why do most sites make prospects work so hard?

In keeping with most advertising slogans, content-free tag lines abound. Once you've paid millions to get a useless slogan developed, it's probably hard to accept that it won't work for your website.

I suggest a compromise: put the useless slogan in a graphic banner next to your logo, where it will be ignored. Then add a true tag line in plain-text format in the content area where people will actually see it.


6. Make it easy to access anything recently featured on your homepage

Compliance rate: 37%
Guideline number in Homepage Usability book: 33

For the Alertbox, 80% of the readership happens after a column has passed from the homepage into the archives. In general, users remember when they've seen something interesting on a homepage. However, unless that homepage lists recent features and offers links to them in the archive, users will never be able to find what they're looking for on subsequent visits.


7. Include a short site description in the window title

Compliance rate: 39%
Guideline number in Homepage Usability book: 75

This is mainly important for search engine visibility, but why not take advantage of this superior -- and cheap -- form of Internet marketing?


8. Don't use a heading to label the search area; instead use a "Search" button to the right of the box

Compliance rate: 40%
Guideline number in Homepage Usability book: 49

This is a small point, but there's no reason to label the search box if there's a "Search" button right next to it. Interaction design's less is more principle tells us that extra elements in a dialogue distract users from the salient points and reduce their ability to understand an interface.

9. With stock quotes, give the percentage of change, not just the points gained or lost

Compliance rate: 40%
Guideline number in Homepage Usability book: 110

This guideline only applies to sites that provide stock quotes, either in the investor relations information or elsewhere. With stock quotes, the general principle is to help users understand the relative magnitude of a change, and thus its true importance. (A similar guideline applies to presenting other statistics that change over time.)

A stock increase of $0.75 means very different things if the starting price was $8 (a booming 9% leap) versus $60 (a modest 1% gain).


10. Don't include an active link to the homepage on the homepage

Compliance rate: 41%
Guideline number in Homepage Usability book: 43

This is a special case of a guideline that applies to all website or intranet pages: never have a link that points to the current page. (A button to refresh stock quotes or other changing information is a different matter, and should be presented as a command button rather than a navigation link since it doesn't lead to a new location.) Active links to current pages cause three problems:

• If they click it, a link leading to the current page is an utter waste of users' time.
• Worse, such links cause users to doubt whether they're really at the location they think they're at.
• Worst of all, if users do follow these no-op links they'll be confused as to their new location, particularly if the page is scrolled back to the top.

Homepage links on the homepage typically result from using a universal navigation bar that includes "home" as an option. Fine. But when users are on a page that's featured in the navbar, you should turn off that option's link and highlight it in such as way that indicates that it's the current location.

The Top Ten Web Design Mistakes

The "top ten" design mistakes I identified in 1996 are still bad for Web usability and are still found on many websites. So in that sense, not much has changed over the last three years.

But unfortunately new Web technology and new applications for the Web have introduced an entirely new class of mistakes. Here are the ten worst.


1. Breaking or Slowing Down the Back Button
The Back button is the lifeline of the Web user and the second-most used navigation feature (after following hypertext links). Users happily know that they can try anything on the Web and always be saved by a click or two on Back to return them to familiar territory.

Except, of course, for those sites that break Back by committing one of these design sins:

• a new browser window (see mistake #2)

• using an immediate redirect: every time the user clicks Back, the browser returns to a page that bounces the user forward to the undesired location

• prevents caching such that the Back navigation requires a fresh trip to the server; all hypertext navigation should be sub-second and this goes double for backtracking


2. Opening New Browser Windows

Opening up new browser windows is like a vacuum cleaner sales person who starts a visit by emptying an ash tray on the customer's carpet. Don't pollute my screen with any more windows, thanks (particularly since current operating systems have miserable window management). If I want a new window, I will open it myself!

Designers open new browser windows on the theory that it keeps users on their site. But even disregarding the user-hostile message implied in taking over the user's machine, the strategy is self-defeating since it disables the Back button which is the normal way users return to previous sites. Users often don't notice that a new window has opened, especially if they are using a small monitor where the windows are maximized to fill up the screen. So a user who tries to return to the origin will be confused by a grayed out Back button.


3. Non-Standard Use of GUI Widgets

Consistency is one of the most powerful usability principles: when things always behave the same, users don't have to worry about what will happen. Instead, they know what will happen based on earlier experience. Every time you release an apple over Sir Isaac Newton, it will drop on his head. That's good.

The more users' expectations prove right, the more they will feel in control of the system and the more they will like it. And the more the system breaks users' expectations, the more they will feel insecure. Oops, maybe if I let go of this apple, it will turn into a tomato and jump a mile into the sky.

Interaction consistency is an additional reason it's wrong to open new browser windows: the standard result of clicking a link is that the destination page replaces the origination page in the same browser window. Anything else is a violation of the users' expectations and makes them feel insecure in their mastery of the Web.

Currently, the worst consistency violations on the Web are found in the use of GUI widgets such as radio buttons and checkboxes. The appropriate behavior of these design elements is defined in the Windows Vista User Experience standard, the Macintosh human interface standard, and the Java UI standard. Which of these standards to follow depends on the platform used by the majority of your users (good bet: Windows), but it hardly matters for the most basic widgets since all the standards have close-to-identical rules.

For example, the rules for radio buttons state that they are used to select one among a set of options but that the choice of options does not take effect until the user has confirmed the choice by clicking an OK button. Unfortunately, I have seen many websites where radio buttons are used as action buttons that have an immediate result when clicked. Such wanton deviations from accepted interface standards make the Web harder to use.


4. Lack of Biographies

My first Web studies in 1994 showed that users want to know the people behind information on the Web. In particular, biographies and photographs of the authors help make the Web a less impersonal place and increase trust. Personality and point-of-view often wins over anonymous bits coming over the wire.

Yet many sites still don't use columnists and avoid by-lines on their articles. Even sites with by-lines often forget the link to the author's biography and a way for the user to find other articles by the same author.

It is particularly bad when a by-line is made into a mailto: link instead of a link to the author's biography. Two reasons:


• it is much more common for a reader to want to know more about an author (including finding the writer's other articles) than it is for the reader to want to contact the author - sure, contact info is often a good part of the biography, but it should not be the primary or only piece of data about the author

• it breaks the conventions of the Web when clicking on blue underlined text spawns an email message instead of activating a hypertext link to a new page; such inconsistency reduces usability by making the Web less predictable


5. Lack of Archives

Old information is often good information and can be useful to readers. Even when new information is more valuable than old information, there is almost always some value to the old stuff, and it is very cheap to keep it online. I estimate that having archives may add about 10% to the cost of running a site but increase its usefulness by about 50%.

Archives are also necessary as the only way to eliminate linkrot and thus encourage other sites to link to you.


6. Moving Pages to New URLs

Anytime a page moves, you break any incoming links from other sites. Why hurt the people who send you free customer referrals?


7. Headlines That Make No Sense Out of Context

Headlines and other microcontent must be written very differently for the Web than for old media: they are actionable items that serve as UI elements and should help users navigate.

Headlines are often removed from the context of the full page and used in tables of content (e.g., home pages or category pages) and in search engine results. In either case the writing needs to be very plain and meet two goals:


• tell users what's at the other end of the link with no guesswork required

• protect users from following the link if they would not be interested in the destination page (


8. Jumping at the Latest Internet Buzzword

The web is awash in money and people who proclaim to have found the way to salvation for all the sites that continue to lose money.

Push, community, chat, free email, 3D sitemaps, auctions - you know the drill.

But there is no magic bullet. Most Internet buzzwords have some substance and might bring small benefits to those few websites that can use them appropriately. Most of the time, most websites will be hurt by implementing the latest buzzword. The opportunity cost is high from focusing attention on a fad instead of spending the time, money, and management bandwidth on improving basic customer service and usability.

There will be a new buzzword next month. Count on it. But don't jump at it just because Jupiter writes a report about it.


9. Slow Server Response Times

Slow response times are the worst offender against Web usability: in my survey of the original "top-ten" mistakes, major sites had a truly horrifying 84% violation score with respect to the response time rule.

Bloated graphic design was the original offender in the response time area. Some sites still have too many graphics or too big graphics; or they use applets where plain or Dynamic HTML would have done the trick. So I am not giving up my crusade to minimize download times.

The growth in web-based applications, e-commerce, and personalization often means that each page view must be computed on the fly. As a result, the experienced delay in loading the page is determined not simply by the download delay (bad as it is) but also by the server performance. Sometimes building a page also involves connections to back-end mainframes or database servers, slowing down the process even further.

Users don't care why response times are slow. All they know is that the site doesn't offer good service: slow response times often translate directly into a reduced level of trust and they always cause a loss of traffic as users take their business elsewhere. So invest in a fast server and get a performance expert to review your system architecture and code quality to optimize response times.


10. Anything That Looks Like Advertising

Selective attention is very powerful, and Web users have learned to stop paying attention to any ads that get in the way of their goal-driven navigation. That's why click-through rates are being cut in half every year and why Web advertisements don't work.

Unfortunately, users also ignore legitimate design elements that look like prevalent forms of advertising. After all, when you ignore something, you don't study it in detail to find out what it is.

Therefore, it is best to avoid any designs that look like advertisements. The exact implications of this guideline will vary with new forms of ads; currently follow these rules:


• banner blindness means that users never fixate their eyes on anything that looks like a banner ad due to shape or position on the page

• animation avoidance makes users ignore areas with blinking or flashing text or other aggressive animations

• pop-up purges mean that users close pop-up windoids before they have even fully rendered; sometimes with great viciousness (a sort of getting-back-at-GeoCities triumph). I don't want to ban pop-ups completely since they can sometimes be a productive part of an interface, but I advise making sure that there is an alternative way of using the site for users who never see the pop-ups.