Web Bloopers: 60 Common Web Design Mistakes, and How to Avoid Them (Interactive Technologies) - page 5

 <  Day Day Up  >  


When I wrote Don't Make Me Think , I told readers that I wasn't going to give them a checklist of Web design do's and don'ts because I thought it was more important that they really understood just a few key principles. The truth is, I knew that a checklist ”the right kind of checklist ”would be very useful. But I also knew just how much work it would be to compile the right kind (like the book you have in your hands), and I knew I'd never be able to muster the energy to do it justice .

Fortunately, all authors, like all Web users, are different people. Jeff Johnson has the three things it takes to write a book like this: He's a very smart fellow, he's been at this usability game for a long time, and he's determined and methodical by nature. (He also happens to be a very nice fellow, but that's just a bonus ”I imagine you can probably write a useful book even if you're a louse.)

Oh, and a fourth thing: He knows how to write ”which in this case means he knows how to make a complicated point without putting you to sleep. (While I was writing my own book, one of the happiest moments occurred when I opened Jeff's newly published GUI Bloopers and discovered that he only had one short chapter on Web bloopers. Whew!)

In this book, Jeff has compiled more than a checklist: It's a catalog of design lessons, each small enough to absorb , each telling a compelling little story that everyone working on a website should hear. Some are big ("Home Page Identity Crisis"), some small ("Compulsory Clicking: No Default Text Input Focus"), but they're all important and all very digestible ”perfect train or bedtime reading. They're lessons every usability expert knows from experience, but I enjoyed reading them anyway because, as usual, the genius is in the details, and Jeff's details are consistently instructive and engaging.

Gathering all of these examples, thinking them through, and spelling them out is a huge job. I'm glad somebody else wanted to do it.

Steve Krug
Chestnut Hill, Massachusetts
February 2003

 <  Day Day Up  >  
 <  Day Day Up  >  


The dot-com crash of 1999 “2000 was a wake-up call. It told us the Web has far to go before achieving the level of acceptance predicted for it in 1995. A large part of what is missing is quality. A primary component of the missing quality is usability. The Web is not nearly as easy to use as it needs to be for the average person to rely on it for everyday information, communication, commerce, and entertainment.

A Few Choice Bloopers

As an example of poor quality and low usability, look at a Search results page from WebAdTech.com , an e-commerce site (Figure I.1). The results are for a search that found nothing. The page has several serious problems:

  • Where am I? Neither the site we are in nor the page we are on is identified.

  • Where are my Search results? The page is so full of ads, it is hard to spot the actual search results.

  • Huh? The message shown for null search results is written in such abysmal English (not to mention inappropriate capitalization), it is hard to understand.

  • What now? The remedy offered for not finding anything is a box for searching the entire Web.

click to expand
Figure I.1: www.WebAdTech.com (Dec. 2000)-No page identification; poorly written error message hard to spot amid ads; unhelpful website search box.

Not surprisingly, WebAdTech was one of the casualties of the dot-com crash; it is gone. However, many sites with significant usability problems remain .

For example, searching for my name at the Yale Alumni website yields three Jeff Johnsons, with no other identifying information (Figure I.2). The only way to find the right one is by clicking on them.

click to expand
Figure I.2: www.aya.yale.edu (June 2002)-Found items all the same.

There is also the site map at a Canadian government site that seems to have been designed based on the game of bingo (Figure I.3). Not very useful, eh?

click to expand
Figure I.3: www.cio-dpi.gc.ca (Dec. 2000)-Cryptic site map.

Add the following to those:

  • The auto company site that pops up "Method Not Allowed. An error has occurred." when visitors do things in the wrong order

  • The state unemployment form that won't accept former employer names like "AT&T" and "Excite @ Home" because of "nonalphanumeric" characters

  • The intranet Web-based application that displays large buttons but ignores clicks that aren't on the buttons ' small text labels

  • The computer equipment company site that contradicts itself about whether its products work with Macintoshes

  • The airline website that can't remember from one page to the next the time of day you want to fly

  • The bus company site that, failing to recognize a customer's departure or arrival city, substitutes the one in its list that is nearest ” alphabetically !

Unfortunately, the examples are endless. The Web is teeming with bloopers.

 <  Day Day Up  >