Can Hated Design Elements Be Made to Work?

by Jakob Nielsen on March 14, 2011

Summary: Once users reject a design technique due to repeated bad experiences it's almost impossible to use it for good because people will avoid it every time.

Users detest many Web design ideas. For some of the worst, see:

In our Fundamental Guidelines for Web Usability seminar, people often ask me whether these problematic designs are all bad. Couldn't something that often causes usability problems have a positive use as well?

Yes, this does happen.

PDF presents a clear example. Usually, PDF files torment users on websites and intranets. Posting a sales brochure, annual shareholder report, or the HR manual online as a single, lumpy PDF file is a sure prescription for usability problems. Much better to convert the content into a navigable information space and rewrite it according to the guidelines for writing for the Web.

That said, PDF has its uses — they're just not in the realm of interactive information access. When people want to download a report for later reference, PDF shines. Indeed, I use it myself for this purpose. (As an example, see our report on social media usability, which is available for free download. And also note how the report link follows the guideline to direct users to a gateway page where they can download the document, as opposed to linking directly to the PDF file and causing "PDF shock.")

Unfortunately, even good uses of bad design techniques are usually doomed. Users hate these designs so much that they can't overcome their negative first impressions in the fraction of a second they allocate to stuff they think they don't need.

Splash Screens

Take splash screens. Yes, they're universally condemned, and we all know that users' only reaction is to go straight for the "skip intro" button. However, a usability study we did with Chinese users earlier this month included a very nice splash screen for the Shanghai Peninsula hotel:

Splash screen from the Peninsula Hotel Shanghai

Technically, this might not qualify as a splash screen because the page does offer some navigation options. Still, in practice, a page with no content except a huge photo serves the same function as a splash screen — and sure enough, the user immediately clicked away.

This user reaction is exactly what I'd typically expect; it's not news that people detest splash screens.

In this case, however, the user was planning a business trip to Shanghai and was particularly interested in learning the hotel's location: was it convenient for her meetings? The splash screen answers this question in a single look: You can see immediately that the hotel is right on the Bund. (The most prestigious address in Shanghai, though on the opposite side of the Huangpu River from the Pudong business district.)

Unfortunately, the test participant didn't allocate any attention to the splash screen even though it could have offered her high usability by addressing one of her top concerns.

Bad experiences with many previous splash screens made the user dismiss this one. Instead, she went immediately for the navigation menus, trying to find a "location" link. (See separate guidelines for location finders.)

It's almost impossible for any single website to overcome the cumulative effect of users' visits to countless other sites. (Remember Jakob's Law of the Internet user experience: users spend most of their time on other sites.)

Would I advise the Peninsula to remove the photo? No, I actually think it's a clever illustration. But ironically, it would have more impact if it were smaller and combined with a bulleted list highlighting hotel features — including a bullet for something like "right on the Bund (see photo)."

Lightbox Overlay Dialog Boxes

A few years ago, I named lightboxes the interaction design technique of the year. In a test we did in Australia last week, a lightbox helped a user looking for flights on the Webjet site:

Iterative user interface design: conceptual process model

Note the design's usability features:

  • It's contextual : shown only to Australian users.
  • It's simple: only two choices and one button, and the most likely choice is preselected as the default value.
  • It clearly highlights the customer benefits of going to the Australian site, even though the user typed in the URL for the American site.

In last week's study, this design worked well, just as many other lightbox designs have performed swimmingly in our previous usability studies.

Sadly, later in the week, we came across this repugnant perversion of an overlay dialog box on another Australian site:

Iterative user interface design: conceptual process model

Although implemented differently, this is no better than a pop-up, which is the #1 most hated advertising design. Just as we saw with the Chinese splash screen, our Australian test user aggressively dismissed the pop-up-like overlay. One of the lessons of these two weeks of testing is that people are the same all around the world: when they despise a Web design they immediately get rid of it.

(See separate guidelines for usable subscription interfaces for email newsletters.)

Obnoxious abuse of a Web design element will ultimately poison the well for decent websites as users start shunning that design element, even when it's well intentioned.

Annoying blinking banner ads were probably the first design approach to go south and destroy a website's ability to include any design elements of a similar shape. In 1999, I declared "anything that looks like advertising" to be #10 on my list of top Web design mistakes. Every year since, studies have shown ever-stronger banner blindness.

For now, the lightbox overlay remains a useful design technique. Please don't destroy it for all of us by abusing it.

Share this article: Twitter | LinkedIn | Google+ | Email