Monday, January 10, 2011

Book: Don't Make Me Think, by Steve Krug

Average reading speed: 1.2 ppm

Krug, Steve. Don't Make Me Think: A Common Sense Approach to Web Usability. Berkeley, CA: New Riders Publishing, 2000. Print.

The number one point is "Don't make me think!" A site should just be self-evident, a user shouldn't have to "learn" how the site works, they should be able to just scan the site and know how to accomplish their goal. They shouldn't be left to wonder "Is that a button?" or "What does that do?"

Use the most common term. Don't write "Quick Search" when the user is likely scanning for "Search."

Whatever is clickable should look clickable. Don't use links or images where a button is needed. A user shouldn't have to waste a single moment on whether or not something is clickable.

Users don't read, they scan with something in mind that they are looking for. They may be thinking "How do I start?", "What is this site for?", or "Where is 'x'?" Your job is to anticipate what they want and present it in an way that's immediately obvious when their eye scans over it and that they can tell is clickable.

Make the important things stand out. Make things into a hierarchy via standards, font size, defined areas, color, and nesting. Group things together logically and use the elements listed to indicate what the important item is that they're likely scanning for. Organize and prioritize the elements on the page.

"Conventions are your friends." Use standards that people are used to. Don't re-invent the wheel unless the new way is self-explanatory or truly worth the pain of thinking.

Keep it quiet. Don't make the site so busy it's overwhelming. Any elements that can be toned down should be so the important stuff stands out. Less is more. Unless you need it, don't include it.

Define your terms. You can't assume the user knows the subject matter and knows what the terms mean. Make it clear what will happen if they click on a button or link.

"Omit needless words." They aren't going to read it anyway, so get rid of it. Anywhere that text is needed, it needs to be parsed for any extraneous words and reduced to its bare essence. If you need to provide instructions, you've failed as designer, the site should be intuitive.

Labels, breadcrumbs, and navigation. The user should be able to scan for the words they want and find it. As they drill down into your site, there must be a means for them to see where they are, how they got there, and how to get back. Consistent navigation and visual cues are key. It's important to work out the entire top-to-bottom navigation from the beginning. Every page should have a search box and a name in a consistent and prominent location with the name matching the text of what the user clicked to get there.

Breadcrumbs help users back up a level or go back to the home page, but they need to in conjunction with a navigation scheme. They work best when they: are placed at the top of the page above all content, use tiny font, separate items with a greater-than sign, are labeled "You are here", and have the last item boldfaced.

Color Coding is good, but don't rely on it. 1 in 12 men are color blind in some way. Use contrast more than color.

Tabs: Work well, make sense to even inexperienced users. Make sure there's a tab selected when the user first enters the site and that the selected tab has a strong contrast to the others.

A user when dumped randomly on some page on your site should be able to answer the following questions easily: "What site is this? What page am I on? What are the major sections of this site? What are my options at this level? Where am I in the scheme of things? How can I search?"

Always avoid stacking underlined text links on top of each other as they're very hard to read. Left or right alignment is better than centered items in creating a hierarchy.

Home Page Design: Tells where you are, what the site is for, what you can do (navigation takes care of this), has a search mechanism, gives the user a reason to stick around, some timely content, sign-in/registration, shortcuts as applicable, has a clear starting point. It needs to answer these questions: What is this? What can I do here? What do they have here? Why should I be here? How do I start?

Pulldowns and rollover popups both have same drawbacks: you have to click on them to find if it's what you want, you can't scan, they show and hide too easily with minor mouse movement.

Home page sins:
- A Banner Ad. Pushes down the branding, negative 1st impression, slows down the page load.
- Promoting everything. Overwhelming. Clutter hides what's really important.
- Too many cross-promotions. Don't address user needs, so they leave. Nascar effect.
- Greedy for data. User has to trust you before they cough up data. Don't require registration without letting them see the goods or ask for an email address before there's a compelling reason for user to provide it.

There is no Average User. Instead of asking "Do most people like pulldown menus", ask "Does this pulldown, with these items and this wording in this context on this page create a good experience for most people who are likely to use this site?" The only way to answer that is by testing.

Usability testing: one user at a time is shown something and asked to either figure out what it is or try to use it to do a typical task.

Testing:
- Testing one user is 100% better than testing none.
- Testing one user early in the project is better than testing 50 near the end.
- The importance of recruiting representative users is overrated. It really doesn't matter who you test (there are some exceptions to this, eCAFE's situation is one of them).
- The point is not to prove or disprove something, it's to inform your judgment.
- Testing is an iterative process.
- Nothing beats a live audience reaction.

You only need to test 5 users, they'll uncover 85 percent of the site's usability problems and any more result in seriously diminishing returns. Test 3 users, fix the issues, test 2 more, fix the issues.

Do "Get it" tests, Key task tests, Cubicle tests on your friends, co-workers, neighbors, passerbys, anyone.


Summary:
- Don't make me think.
- Use obvious/common terms.
- Whatever is clickable should be obviously clickable.
- Users don't read, they scan. Make it scannable.
- Make the important things stand out.
- "Conventions are your friends."
- Don't overwhelm the user.
- Define your terms.
- "Omit needless words."
- Labels, breadcrumbs, and navigation.
- There is no Average User.
- There is no substitute for testing.

No comments:

Post a Comment