Web Bloopers by Jeff Johnson
» Read the Table of Contents
» Read Chapter 1: Introduction (PDF)
» Get your copy!
 

Additional Web Bloopers

Many more bloopers were considered than could fit into a reasonably-sized book. I thought it would be useful to list those in each category that didn't make the final cut. I also list two categories of bloopers that were excluded entirely: Shoddy Work bloopers, and Socially Irresponsible or Evil bloopers.

In the included categories, certain bloopers were excluded because I didn't have enough good examples. Others were omitted because they weren't clearly distinct from bloopers that were included. Still others were left out because they were judged to be too unimportant or rare.

The Shoddy Work category was excluded from the book because it is hard to know what advice to offer besides "be more careful". The Socially Irresponsible or Evil category was excluded for the opposite reason: Web developers commit such bloopers on purpose and so don't want to avoid them.

If it is decided to publish a second edition or Volume 2 of Web Bloopers, some of these may be included, provided I have enough good examples and am convinced they are important and common. Readers are invited to use the Web-Bloopers Discussion area to suggest examples or additional common bloopers.

Content Bloopers

  • FAQ isn't just the FAQs. The site's Frequently Asked Questions page contains questions that are clearly not frequently-asked, or no questions that are frequently-asked, or even no questions at all. One of Nielsen's Top Ten Web Design Mistakes for 2002 (see UseIt.com).

Task-Support

  • Erroneous Error Message. Naive design and/or bugs can cause error messages to be incorrect, which really misleads people.
  • Transaction Left in Limbo. In the middle of a transaction, something goes wrong, but the site simply fails without indicating the status of the transaction. The user is left wondering if the transaction went through.
  • No Printer-Friendly Page. A special case of not providing functionality to support users' requirements. Many pages are formatted in such a way that printing them directly results in content running off the side of the printed page. The solution is to provide a printer-friendly version of such pages. Many sites don't, even many that provide news articles or opinion papers.
  • Irrelevant Info Shown. Information is displayed that has no value to users. Maybe it is there for the convenience of the developers; maybe it is there because the developers thought it might be useful to users, but it isn't. Could also be considered a form of speaking Geek.
  • Unnecessary Splash Screen. Splash screens that serve no purpose other than showing off the developers' graphic design or programming prowess. They are usually irrelevant to users' goals (unless one of users' goals is to be entertained). They delay users needlessly. In some cases they look deceptively like a Home page, so this could also be considered a Navigation blooper.

Navigation Bloopers

  • Multiple Home Pages. Related to Numerous Navigation Schemes (Blooper 16) and to Site Reflects Organization Chart (Blooper 15).
  • Site's Web Address Hard to Guess. Either the site does not have its own domain name (e.g., members.stonehenge.org/~fredflintstone) or the domain name is different from the company or product name (e.g., PWCglobal.com). One of Nielsen's Top Ten Web Design Mistakes of 2002 (see UseIt.com).
  • Navigation Info Shown Only on Rollover. Navigation bars that display descriptions of each link only when the mouse pointer is moved over an item. Flanders calls this "mystery meat" navigation (see WebPagesThatSuck).
  • Breadcrumb Path Misleads. Breadcrumb path doesn't show what users expect. May show exact route to this page instead of depth in hierarchy, or vice-versa. What is right depends on what users of the site expect.
  • Useless Site Maps. Site maps that are unusable, or that provide no value beyond what the site's regular navigation bars, links, and Search function provide.
  • Unpredictable BACK. BACK button doesn't behave as users would expect. Discussed in GUI Bloopers.

Form Bloopers

  • Overly Tolerant Data Fields. Type-in fields allow users to type invalid data that causes problems downstream. It's the flip-side of Intolerant Data Fields (Blooper 23).
  • No Support for Keyboard-Only Operation; Users Must Use Mouse. Forcing users to use the mouse to operate a form or control panel. Sites that have this blooper are bad for the blind and people with repetitive stress injuries or motor impairments.

Search Bloopers

  • Null Results Treated Badly. When a search returns nothing but the results don't acknowledge that and just display a blank page or a display bug.
  • Inadequate Results Navigation. When the results aren't easily browsable because of the how they are presented. Perhaps could be considered part of Hits Sorted Uselessly (Blooper 37).

Text and Writing Bloopers

  • No extra bloopers at present.

Link Appearance Bloopers

  • Internal vs. External Links Not Distinguished. No indication whether links go off-page or down the same page. Discussed in GUI Bloopers. Could also be considered a Navigation blooper.
  • Link Opens New Browser without Warning. Discussed in GUI Bloopers. Could also be considered a Navigation blooper.

Graphic and Layout Bloopers

  • Controls Not Where Needed. Controls that are in the wrong place given what users are looking at when they need the controls. E.g., you need them when you get to the bottom of the page, but they are at the top, forcing you to scroll back up.
  • Odd Layout. Layout that is so non-standard and unusual that users are confused about how to interpret it or what to do.
  • Sloppy Layout. Unintentionally screwed up layout resulting from design oversights, bugs, etc. Because these are unintentional, pointing them out has questionable value. On the other hand, they show how sloppy many web developers are, and how rarely sites are tested before being put online.
  • Important Info Below Fold. An obvious topic, but it has been covered elsewhere, e.g., by Nielsen, Krug.
  • Inconsistent Page Style. Very different page layout and/or graphic styles on different pages of the same site. Suggest that the site is a hodge-podge of new and legacy pages. Related to Site Reflects Organization Chart (Blooper 15).
  • List is Not a List. Itemized lists that do not use HTML list constructs, so the lists are poorly formatted, e.g., bullets or numbers are not out-dented, items are run together, etc.
  • No ALT Tags. An obvious error, well-covered elsewhere, e.g., Nielsen, Flanders.
  • Images Not Optimized for Fast Download. An obvious topic, well-covered elsewhere, e.g., Nielsen, Flanders.
  • Fixed-Width Pages. Pages that needlessly use fixed width formatting for large amounts of body text. See UIWizards.com for an example of a site that avoids this blooper: the main body text on every page is variable width, even though certain columns of information, such as the navigation bar, are fixed width.
  • Bad Frames. Using frames OK now if you do it correctly, but many don't use them correctly. The pros and cons of frames have been discussed extensively by Nielsen (see UseIt.com).
  • Requires Fancy Browser Plug-In. Needlessly requiring the latest whiz-bang browser plug-in to be able to view the site. Sites that do this are merely eliminating potential customers.

Sloppy Work Bloopers (Bugs)

  • Broken internal links. Links in a website that are supposed to go to other pages on the same site, but instead produce a "Page not found" error. These are much less excusable than broken external links. The Web changes. External pages change. If you link your website to other sites, those sites may move or disappear. Yes, you should check your external links periodically to make sure they still work, but broken internal links are completely inexcusable: they show that the developers didn't check their work.
  • Display bugs. Information or controls are displayed incorrectly or the wrong place. Website code appears in the browser. Elements of a page overlap. This blooper is related to two other sloppy-work bloopers: "Fails in common browser" and "Sloppy layout".
  • Fails in common browser. The page doesn't display as intended in one or more of the popular Web browsers, e.g., Internet Explorer or Netscape Navigator. I've seen sites in which part of the site (developed by one team) worked in IE but not Netscape, while another part of the site (developed by a second team) worked in Netscape but not IE.
  • Faulty meta-content. These are errors in the non-displayed information that the page provides to browsers and search-engines: page titles, keywords, etc. Web developers often copy existing pages to create new ones, but forget to edit the meta-content for the new page, so many pages on their site end up with the same page titles, keywords, etc. Many pages on the Web have fake Latin filler text "Ipsum lorum dolor sit amet..." as a title.
  • Functions don't work. Some functionality on the site simply doesn't work as it is supposed to, either in all browsers or in certain browsers. This is more common for complex functionality implemented in Javascript or in Java applets.
  • Template with null data. A page is based on a template, but no data ever got filled into the template, so it is basically an empty page with a few structural elements.
  • Truncated text. Error messages, instructions, labels, or menu-items that are truncated for some reason. Perhaps something in the implementation is truncating the text string rather than displaying all of it, or perhaps part of the text string was mistakenly cut from the implementation.

Socially Irresponsible/Evil Bloopers

  • Annoying/distracting popups and pop-unders. Little windows that pop out of the browser, in the users' face, and distract them from what they are doing. Perhaps even worse are pop-under windows, which appear and quickly hide themselves under the browser window hoping that the user will come across it later. Not all pop-up windows are bad. Error messages, for example, are often best presented in pop-up windows. But unexpected pop-up windows are a scourge on the Earth and should be banned.
  • Violating own privacy policy. Sometimes the privacy policy stated on websites is a lie; the company has no intention of adhering to it. Other times, the privacy policy was written by part of the company, but another part of the company doesn't know about it and does something that violates it. And sometimes companies state a privacy policy, and then are taken over by a company that uses customer information in ways that violate the policy that was in effect when people gave the company their information.
  • Bait and switch (breaking promise) . Many e-commerce sites promise "extra discounts if you purchase/book on the Web", but when you get to the website, the extra discounts are not available. Some sites have links that promise one thing but deliver something else. For example, one site offers "free subscription" to the company's magazine, but when you follow the link, you're taken to a subscription page that costs money.
  • Misleading meta-content. This is setting incorrect meta-content on a site's pages to mislead browsers, search engines, etc. It is unfortunately a common practice for websites to include many - sometimes hundreds - of unrelated keywords so Search engines will "find" the site no matter what Search terms Web users use.

Home | About the Author | Web Bloopers Checklist | Additional Web Bloopers | Resources | Discussion Forum

© 2003 Morgan Kaufmann Publishers