Blooper 31: Baffling Search Controls

 <  Day Day Up  >  

Blooper 31: Baffling Search Controls

Let's imagine you are an evil Web designer, trying to make the search function at your site as difficult as possible to use. How might you do it?

Geeky Search Options

One way would be to label the search controls in your site using technical concepts and jargon from the information-retrieval and database subfields of computer science. For example, you could ask site users to choose between "keyword" search and "text search," as the websites of the Association of Computing Machinery ( and the Institute for Global Communications ( used to do (Figure 5.2). Faced with such a choice, many people will either waste time staring at the controls trying to decide which setting is right for their query or just leave it as it was set, whether or not that is correct for their search.

click to expand
Figure 5.2: A- (Mar. 2000); B- (Mar. 2000)-Search controls distinguish keyword search from text search.

ACM might be excused for making this distinction: Its website is targeted at computer professionals. However, IGC has no such excuse : Its website is aimed at a much broader demographic. Fortunately, IGC eventually realized that this was poor design and simplified its search controls considerably. Even ACM eventually eliminated the need for users to specify keyword versus text search (although, as discussed later, it introduced other complexities).

SBC, the parent company of several regional phone companies in the United States, has a website that used to make a similar but more blatant mistake: forcing people to specify whether the search terms they typed were "literal text" or "boolean" expressions (Figure 5.3). Few visitors to would know what "boolean" means. Like IGC, SBC eventually corrected this blooper.

click to expand
Figure 5.3: (Mar. 2000)-Search page expects users to specify whether their search text is "Literal Text" or "Boolean."

By now you may be hypothesizing that using geeky terminology in website search controls is an affliction of organizations with three-letter names . Before you run off to check the FBI, CIA, and KGB websites, let me counter that hypothesis with an example from a company with a four-letter name : Dice.'s job-search function provides a choice between searching for "all of the ... keywords," "any of the keywords," and "boolean expression" (Figure 5.4).

click to expand
Figure 5.4: (Jan. 2002)-Search function offers several choices, including "Boolean expression," but it's hidden in a menu and isn't the default value, so it's not so bad.

On the other hand,'s blooper isn't as serious as those in the aforementioned sites: Its "boolean" option is hidden in a menu, so people who don't bother to open the menu never see it.

Insider Terminology

Continuing to imagine ourselves as evil Web designers, let's consider another way to thwart people who hope to find something using our site's search facility. Even without resorting to geeky terminology, we can stymie users by labeling the search options using insider terminology-words users wouldn't know unless they are as familiar with the site as the designers are.

For example, consider the website of the state of California's Department of Motor Vehicles. It's a subsite of, the California state government site. The search function offers a choice between searching "this site" and "My CA," with "My CA" as the default (Figure 5.5). My CA is your own personalized "California home page" containing links to the parts of you use often.

click to expand
Figure 5.5: (Sept. 2002)-Search function offers choice of searching "My CA" or "This Site," with the former as the default. Visitors unfamiliar with the main California website won't know what My CA is.

Whoever designed these search controls must know that many visitors to the DMV's website won't have seen the main State of California home page, where the opportunity to create a My CA page is offered . For example, I got to by searching Google for "CA DMV" Even visitors who have been to the main California home page may not have a My CA page because they didn't create one. Therefore, for many visitors to the DMV pages, the "My CA" choice will be either meaningless or not applicable .

Worse, "My CA" is the default. Many visitors will type text into the's Search box, hit the button, and be presented with a list of hits that aren't from the DMV subsite, but are from other parts of For example, searching for "drivers' license" returns a list of press releases from the governor 's office that mention licenses rather than links to the DMV's pages about drivers' licenses. That isn't how website search functions usually work. Usually, a site's search function searches that site, at least by default (see also Chapter 4, Blooper 25: Faulty Defaults).

"Unique" Search Controls

A third method the evil Web designer has for thwarting users who try to use a site's search facility is to devise such original, unfamiliar controls that no one will have seen anything similar before and so won't know how they work. Take for example the "Restrict by Area Code" search option provided at (Figure 5.6). Presumably, this control restricts the search to a particular area code or codes, but I'll bet few users figure out how to set it. [3]

click to expand
Figure 5.6: (Jan. 2002)-Restrict by Area Code option- How does it work?

I mentioned earlier that the Search page was revised to eliminate the need for site users to choose between keyword and text ("phrase") search. Unfortunately, they added two very unusual search fields: "Specify a Domain Name" and "Specify a Base URL" (Figure 5.7). I'm a computer professional, and I can't tell what these fields are for, even though examples are provided.

click to expand
Figure 5.7: (May 2002)-Unclear how to use Domain Name and Base URL fields, or what they do. These fields are so mysterious , they will be ignored by many site visitors.

Why should I give a domain name, when I'm at the domain I want to search: And what does "Base URL" mean? The example given isn't a URL, it's just a piece of one. Finally, the extra fields are marked "optional," but it's unclear whether they can be used alone or only in concert with the "Keywords and Phrases" field. In short, it was an improvement to combine keywords and phrases into one field, but the highly unusual new fields cancel out any improvement in usability.

The prize for unusual search controls goes to, the website of National Public Radio in the United States (Figure 5.8). Its Search page formerly presented a bewildering array of options and made command buttons look like radiobuttons . No one to whom I showed this page understood what the choices were, much less how to operate them.

click to expand
Figure 5.8: (Mar. 2000)-Unusual search options. Choices are difficult to understand and distinguish, for example, "search" versus "concept search." And what is "relate?" Also, the buttons look like radiobuttons but aren't.

Web developers might assume that users will "figure out" the unusual search controls eventually, but that's a naive view of how people use the Web. First, people probably wouldn't use NPR's search function often enough to "figure it out." It's only one of dozens-maybe hundreds-of websites they use, after all. Second, as Krug (2000) points out in the book Don't Make Me Think , people don't figure out software and websites they don't understand; they just muddle through. On this page, they would simply type something into the text box and hit Enter (or maybe the Search button), ignoring everything else.

Avoiding the Blooper

The guidelines for designing search controls that won't confuse users are straightforward: keep it simple, use nontechnical language, and optionally , focus the search controls on specific site content.

Keep It Simple

The easiest way to keep search controls simple is to provide just one Search box and no options. provides an example (Figure 5.9[A]). So does (Figure 5.9[B]). Search controls can't get much simpler than this.

click to expand
Figure 5.9: A- (May 2002); B- (May 2002)-The simplest possible search controls are a text field and a button.

For searching the entire Web, Google has without question the simplest controls (Figure 5.10). There are options (presented as tabs and links), but the most commonly used option, search the Web, is the default.

click to expand
Figure 5.10: (Sept. 2002)-Simplest controls for searching the Web.

Use Nontechnical Language

If the search function must include more options-and they often must-Web designers can keep the controls simple by avoiding technical jargon. Use language meaningful to the people who visit the site. The advanced search options at the state of California's main website, in contrast to those on the California DMV's home page, are clear and sensible (Figure 5.11).

click to expand
Figure 5.11: (Sept. 2002)-Search controls are labeled in easy-to-understand nontechnical language.

Similarly, SBC's new site clearly does a better job than its old one of sticking to familiar terminology. The "boolean" option is gone (Figure 5.12).

click to expand
Figure 5.12: (May 2002)-Search controls are labeled in easy-to-understand nontechnical language.

Focus on Specific Site Content

A third way to make a search function easy to use is to consider what people will usually be looking for at the site and focus the search function on helping them find that. For example, an e-commerce site's search facility could focus on product search. This of course ignores the possibility that some people might want to find the organization's privacy policy or postal mailing address, but that may be fine, assuming those things can be easily found without searching.

BIZARRO 2002 by Dan Piraro. Reprinted with permission of UNIVERSAL PRESS SYNDICATE. All rights reserved.

This approach can be seen at The search function is explicitly for finding products (Figure 5.13). It won't find links pertaining to jobs at SharperImage, corporate news, or other non-product topics. The site covers such topics, but they must be found by following links from the home page. That is okay: The main thing visitors come to the site looking for is products.

click to expand
Figure 5.13: (Nov. 2000)-Task-focused search function finds products only.

The label "Text Search" is a bit geeky; I would label it "Product" instead. But otherwise , this is a good design. If you know the name of the product, you use one field; if you have a catalog and know the item code, you use the other field. Nice.

NPR, which used to have a horribly confusing search function (see Figure 5.8), redesigned it to focus on what most visitors look for: stories they heard on the radio. The new task-focused controls are a clear improvement in usability over the old ones, even though they won't find everything at the site (Figure 5.14). NPR's old search controls might in principle have provided access to more of the site's content, but in practice they provided access to less, because people couldn't figure out how to use them.

click to expand
Figure 5.14: (May 2002)-Task-focused search function finds radio stories only.

Other examples of search functions tailored to a site's content are as follows :

  • Many news, historical, and scientific archives provide ways to search for items by dates or date ranges.

  • Some poetry sites provide ways to search for words rhyming with specified words or for rhyming words that occur in the same poem.

[3] Answer: You can restrict the search to between one and five area codes by typing one area code into each box.

 <  Day Day Up  >  

Web Bloopers. 60 Common Web Design Mistakes and How to Avoid Them
Web Bloopers: 60 Common Web Design Mistakes, and How to Avoid Them (Interactive Technologies)
ISBN: 1558608400
EAN: 2147483647
Year: 2002
Pages: 128
Authors: Jeff Johnson

Similar book on Amazon © 2008-2017.
If you may any questions please contact us: