Don't Make Me Think

Don't Make Me Think

Melinda Hileman

Owner of Hileman Holdings, LLC

1

Hi, my name is Melinda Hileman, the owner of Hileman Holdings, the parent company of

Hileman Design and Grounding Stones Jewelry

Hileman Design provides graphic design, web design, desktop publishing and public relations services, and with Grounding Stones Jewelry, I make and sell wire-wrapped stone jewelry

Steve is a usability consultant with more than 20 years of experience as a user advocate for companies like Apple, Netscape, AOL and others

He has become a highly sought-after speaker on usability design since the first version of

this book came out

“What’s the most important thing I should do if I

want to make sure my Web site is easy to use?”

Nothing important should ever be more than

two clicks away?

Speak the user’s language?

Be consistent?

3

Krug’s First Law of Usability

DON’T MAKE ME THINK!

Self-evident, obvious and self-explanatory The user should be able to “get it”

4

Krug’s First Law of Usability is Don’t Make Me Think If you only have room in your head for one usability rule, make it this one!

Your pages should be self-evident, obvious and self explanatory

The user should be able to “get it” - what your page is and how to use it - without expending any effort thinking about it

In the first example, as the user visits the page, he has a lot of questions

But in the second example, there are no questions - the user is able to easily digest the page and find the content they’re looking for

So, when you’re creating a site, it’s your job to get rid of the question marks

Things That Make Us Think

6

A lot of things on a Web page can make users stop and think unnecessarily, like names of

things, and links and buttons that aren’t obviously clickable As a rule, people don’t like to

puzzle over how to do things The fact that the people who built the site didn’t care to make things obvious - and easy - can erode a user’s confidence in the site and its publishers

So you can see in this first example, simple wording can help users find what they are looking for quickly In the second example, making links obviously clickable is also important Ways

to do this would be to use conventions such as buttons or blue underlined text

What shouldn’t visitors

have to think about?

Where am I?

Where should I begin?

Where did they put _?

What are the most important things on this page?

Why did they call it that?

7

The last thing you need is another checklist to add to your stack of Web design checklists

The most important thing you can do is to just understand the basic principle of eliminating question marks

If you do, you’ll begin to notice all the things that make you think while you’re using the

Web, and eventually you’ll learn to recognize and avoid them in the pages you’re building

How we really use the Web

Scanning, satisficing, and muddling through

We create sites as though people are going to pore over each page and weigh their options before deciding which link to click

What they actually do most of the time (if we’re

lucky) is glance at each new page, scan some of

the text and click on the first link that catches their interest or vaguely resembles the thing they’re looking for

As the children’s riddle goes; “Why are things always in the last place you look for them?

Because you stop looking when you find them.”

Here’s a fact of life - users don’t read pages, they scan them Mostly because they’re in a

hurry, users know they don’t need to read everything, and frankly, they’re good at it

The net effect is like this Far Side Cartoon with Ginger and her owner What users see when they look at a Web page depends on what they have in mind, but it’s usually just a fraction of what’s on the page

Like Ginger, they tend to focus on words and phrases that seem to match (a) the task at hand

or (b) their current or ongoing personal interests And of course, (c) the trigger words that are hardwired into our nervous systems, like our name, “Free,” “Sale,” and “Sex.” The net effect is like this Far Side Cartoon with Ginger and her owner What users see when they look at a Web page depends on what they have in mind, but it’s usually just a fraction of what’s on the

page

Like Ginger, they tend to focus on words and phrases that seem to match (a) the task at hand

or (b) their current or ongoing personal interests And of course, (c) the trigger words that are hardwired into our nervous systems, like our name, “Free,” “Sale,” and “Sex.”

If life gives you lemons

You may be thinking, “Why don’t I just get a job

at the local 7-11? At least there my efforts might

be appreciated.”

If your audience is going to act like you’re

designing billboards, then design great

billboards.

11

Billboard Design 101

Design Pages for Scanning, Not Reading

12

Faced with the fact that your users are whizzing by, there are five important things you can

do to make sure they see - and understand - as much of your site as possible The net effect

is like this Far Side Cartoon with Ginger and her owner What users see when they look at a Web page depends on what they have in mind, but it’s usually just a fraction of what’s on the page

Create a clear visual hierarchy on each page Take advantage of conventions

Break pages up into clearly defined areas

“nested” visually to show what’s part of what

2: When reading a newspaper, we know that a phrase in very large type is usually a headline that summarizes a story underneath it, and that text underneath a picture is a caption that

tells me what it’s a picture of All conventions start as somebody’s bright idea For instance, enough people are now familiar with the convention of using a metaphorical shopping cart on e-commerce sites that it’s safe for designers to use a shopping cart icon without labeling it

Make it obvious what’s clickable Minimize noise

Billboard Design 101

Design Pages for Scanning, Not Reading

14

4 Since a large part of what people are doing on the Web is looking for the next thing to

click, it’s important to make it obvious what’s clickable and what’s not

5 There are two kinds of noise; busy-ness, where many things are clamoring for a user’s

attention and they have to figure out what to focus on; and background noise, where it’s like being at a social cocktail party; no one source of noise is loud enough to be distracting by

itself, but there are a lot of tiny bits of visual noise to wear us down Some people have no

problem with busy pages and background noise, but many do

People won’t use your Web site if they can’t find their way around it!

Street Signs

15

People won’t use your site if they can’t find their way around it Let’s say you’re headed to

the mall to buy a chainsaw As you walk into Sears, you think “Hmm Where do they keep

chainsaws?” As soon as you’re inside, you decide that you are going to look for it on your

own instead of asking someone where they are You start looking at the department names, high up on the walls Tools or Lawn and Garden?

Given that Sears is so heavily tool-oriented, you head in the direction of Tools When you

reach the Tools department, you start looking at the signs at the end of each aisle When you think you’ve got the right aisle, you start looking at the individual products

If it turns out you guessed wrong, you try another aisle, may back up and start over again in the Lawn and Garden department, or ask someone for help

Eventually, if you can’t find what you’re looking for, you’ll leave This is as true on a Web site

as it is at Sears You’ll leave when you’re convinced they haven’t got it, or when you’re just too frustrated to keep looking

The overlooked purpose of navigation and breadcrumbs

Helps users find what they’re looking for Tell users where they are

Gives users something to hold on to Tells users what’s here

Tells users how to use the site Gives users confidence in the people who built it

16

At Sears, I really only need to see the name on my way in; once I’m inside, I know I’m still in

Sears until I leave But on the Web - where my primary mode of travel is teleportation - I need

to see it on every page By this “it,” I mean obvious navigation and breadcrumbs

I enter the site.

My goodwill is high because I saw a product

on TV, and I want to order it from this site.

I glance around the Home page.

There are a lot of links, pictures, and Flash videos I am feeling overwhelmed.

I look at the navigation.

I can’t find a link to order products, just a link that lists the products.

I go to the product list

page.

I see a button that tells

me to click it to order their products.

I click the button.

They don’t sell my item, even though the TV ad said they did I leave.

The Reservoir of Goodwill

Imagine that every time a user enters a Web site, they start out with a reservoir of goodwill Each problem they encounter on the site lowers the level of that reservoir.

17

The reservoir is limited, and if you treat users badly enough and exhaust it there’s a good

chance that they’ll leave

But leaving isn’t the only possible negative outcome; they may just not be as eager to use

your site in the future, or worse, they may think less of your client’s organization

I’m out

of here!

Sometimes a single mistake can empty it

You can refill it It’s situational

The Reservoir of Goodwill

It’s idiosyncratic

18

1: Some people have a large reservoir, some small Some people are more suspicious by

nature; others are inherently more patient The point is, you can’t count on a very large

reserve

2: If a user is in a hurry or have just come from a bad experience on another site, their

expendable goodwill may already be low when they enter your site, even if they naturally

have a large reserve

3: Even if you’ve made mistakes that have diminished the user’s goodwill, you can replenish

it by doing things that make them feel like you’re looking out for their best interests

4: For instance, just opening up a registration form with tons of fields may be enough to

cause some people’s reserve to plunge instantly to zero

The Reservoir of Goodwill

Things that diminish goodwill Things that replenish goodwill

Hiding information that users want Punishing users for not doing things your way

Asking users for information you don’t really need

Shucking and jiving them Putting sizzle in their way Your site looks amateurish

Know the main things that people want

to do on your site and make them obvious and easy

Tell users what they want to know Save them steps wherever you can Put effort into it

Know what questions users are likely to have, and answer them

Provide them with creature comforts like printer-friendly pages

Make it easy to recover from errors When in doubt, apologize

19

There are a lot of things that can diminish, or replenish a reservoir of goodwill

Some things that diminish goodwill are hiding information that users want, asking users for information you don’t really need - which can scare users who are concerned with their

security, putting too much sizzle in their way, like multiple Flash videos, or making your site amateurish - remember the days when we all used animated gifs of a little guy waving or the

“Building a good Web site is an enormous challenge, and anyone who gets it even half right has my admiration.”

“Please don’t take anything I’ve said as being against breaking ‘the rules’ - or at least bending them I know there are even sites where you want the interface to make people think, to puzzle or

challenge them Just be sure you know which

rules you’re bending, and that you at least think

you have a good reason for bending them.”

That’s all, folks

Closing comments by Steve Krug

20

There is still a large part of the book that I didn’t cover, so be sure to pick up a copy He

wrote the book in a such a way that the reader could read it on an airplane

Want to know more?

http://psychology.wichita.edu/surl

http://usability.gov/guidelines/index.html

http://www.sensible.com

http://www.usabilityviews.com http://www.useit.com

http://www.webword.com

21

Melinda Hileman

Owner of Hileman Holdings, LLC

22