Don't make me think: A Common Sense Approach to Web and Mobile Usability
Summary
Rules for web usability.
Don’t make me think
Nothing important should be two clicks away. When creating a website, your aim should be to get rid of question marks.
Things that make us think
Select simple names instead of clever names.
Eg. for a person looking for a job, finding a link with Job title is easier than employment opportunities or job-o-rama.
Every question mark adds to our cognitive workload, distracting our attention from the task at hand.
You can’t make everything self evident.
If you can’t make something self-evident, you at least need to make it self explanatory.
The design should create a sense of nearly effortless understanding.
How we really use the web
People glance at each new page, scan some of the text and click the first link that catches their interest or vaguely resembles the thing they’re looking for.
Fact of life 1: We scan pages
Exceptions: People alternate between reading and scanning for these.
- news stories
- reports
- product descriptions.
why do we scan
- We’re on a mission.
- we know we don’t need to read everything.
- we’re good at it.
Fact of life 2: We don’t make optimal choices
People choose the first reasonable link instead of reading all the links.
Fact of life 2: We don’t figure out how things work. we muddle through.
very few people take the time to read the instructions.
if your audience is going to act like you’re designing billboards, then design great billboards.
- In a nutshell,
- Conventions are your friend.
- Create effective visual hierarchies.
- Break pages up into clearly defined areas.
- Make it obvious what’s clickable.
- Eliminate distractions.
- Format content to support scanning.
conventions are your friend.
eg. Logo - Top left.
Don’t reinvent the wheel.
Use what has been successful in past.
Clarity trumps consistency.
Create visual hierarchies.
- More important elements are bolder or larger or set off by more white space.
- Things that are related logically are related visually.
- Things are nested visually to show what’s part of what.
Break pages up into clearly defined areas.
Eg. Banner blindness: Users ignore area they think contain ads.
Eliminate distractions.
Three different kind of noises.
- shouting: Everything can’t be important.
it is the result of a failure to decide which elements are important.
- Disorganization: Use grids for the design.
- Clutter:
7 Practical Questions
- How can i make design of major areas
conventional. - How can i support scanning (Bold, Highlight)?
- How can i avoid banner blindness?
- How can i make it obvious what’s click-able?
- How can i eliminate distractions from the website?
- How can i group similar visual items together (Gestalt)?
Mental Models mentioned.
- Banner Blindness
- Users ignore any area resembling to the banner.
