Web Site Usability

Chapter 2 - Heuristics, Affordances and Web Site Standards

Heuristics

What the heck does "heuristics" mean, anyway?

• 10 Usability Heuristics (www.useit.com) by Jakob "Mr. Usability" Nielson
• First Principles www.asktog.com/ printable version

Heuristics are basically Rules of Thumb. While there is really no substitute for User Testing to find out if your sites are elegantly effortless for your audience, you can at least start somewhere, using well-established guidelines to assist in the process.

There is no better place to start than with Jakob Nielson:

10 Usability Heuristics - Examples

Rule	Example
1. Visibility of system status	Hourglass Blue bar creeping across its box showing how much time is left to complete a process "Your order has been received" page "Breadcrumbs" Rollover buttons
2. Match between system and the real world	File-folder tabs for navigation Buttons which act pushed when you click on them Simple language on labels, for example "product code" instead of "item SKU" (unless the site is internal, and SKU is the more common term)
3. User control and freedom	"Undo" button Stop button on browser "Remove from cart" Close window Unplug the machine
4. Consistency and standards	Don't (as I have done) call something "Help Files" in one place and "Tips and Tricks" in another. Use what people know: put navigation on the left, links to special site tools on the upper right, and featured items on the right. Especially if you use unconventional navigation, your site should make it easy to learn the new way (see Rule 3) then reinforce the learning through strict consistency.
5. Error prevention	"Are you sure?" message Validation - check for @ sign in e-mail addresses Clear labels - "Check Out NOW." Large enough buttons
6. Recognition rather than recall	Choose from list of options Mouse-over tool tips Help system always available
7. Flexibility and efficiency of use	Different methods for novice and expert - mouse vs keyboard Frequently-used actions become first choice - on Mapquest, the addresses you've looked up show up as "Recent Searches" the next time.
8. Aesthetic and minimalist design	Omit unnecessary words Leave clutter off the pages, and that adorable animated gif you think is so cool. Cute once, annoying forever. Japanese study found that beautiful things were actually easier to use. Experiment repeated in Israel, with the same results, completely contrary to expectation!
9. Help users recognize, diagnose, and recover from errors	Useful error messages - "Incorrect Password. Check to see if your caps lock key is on." On Google - "Did you mean web site?" when you typed web stie.
10. Help and documentation	Your site should be designed so well that documentation is not necessary. If not, documentation and help should be readily available, clear, and correct. Popup help Clear link to customer service

Affordances - Pushable, Clickable

Material objects have properties which suggest to us the ways they can be used. These "the way it can be used" properties are their affordances. A chair, for example, affords us the possiblity of sitting. A rubber ball, we quickly learn, affords us the possibility of bouncing, or rolling it.

Read Don Norman on affordances.

• Don Norman and The Design of Everyday Things
• http://www.jnd.org/dn.pubs.html

Attractiveness

• The Need for Attractiveness in Usability - from Don Norman's new book

Emerging Web Site Standards

• Don't Make Me Think - Steve Krug
• Browser Compatibility and W3C Standards

Discussion: What are some web standards you have noticed

 

 

==>Next