Youthtopia's 26 Principles of Usability

About Web Usability

In his bestselling book Designing Web Usability: The Practice of Simplicity (1999), Jakob Nielsen coined the phrase "Home-Run Websites". The term means: "websites that get repeat traffic from loyal users". He makes the essentials easy to remember with an acronym for H-O-M-E. Nielsen's principles are still valid, but six years have passed. I've updated his ideas with three more ideas: an acronym for R-U-N.

High-quality content
Often updated
Minimal download time
Ease of use
RSS enabled (any XML feeds)
Uses XHTML and CSS
Nice to look at

Web Usability might be defined as the art and science of answering four essential questions:

A. Who will be reading the website?
B. What elements or features are needed?
C. How should each of these elements/features look?
D. Where should each of these elements/features be placed?

Based on these questions, my own experience, and works on Usability by Jakob Nielsen and Steve Krug, here are 26 Usability Principles that make sense to me. Nielsen is a usability pioneer, to be sure; but as the web grows, his ideas (like everyone's) should be re-examined. At times he seems to advocate sameness in page design.

A world of web sites that all look like clones of Amazon.com? ... That's not for me. Web sites should be easy to use and yet unique, both in content and in style.

Youthtopia's 26 Usability Principles

  1. Provide high-quality content.
  2. Separate structure and presentation by making well-formed XHTML pages, and then styling them with CSS.
  3. Be sure that the page's title and subtitle tell the reader -- clearly and immediately -- what the site is about.
  4. Write in brief chunks, because most readers scan web pages rather than read them. Yet keep in mind that the human mind is capable of understanding far more than a PowerPoint Presentation. Write naturally -- not in short chunks -- whenever the natural style is appropriate. Subheadings with larger type can be used to organize and highlight key ideas in long passages.
  5. Update often, but not so often that the reader can't keep up.
  6. Keep each web page's download time around 10 seconds per page or less (based on a 56K modem) -- which means a maximum of 50 KB per page. (This limit may rise with the spread of broadband.)
  7. Add an RSS or XML feed link to each home page.
  8. Links to "Contact Us" and "About Us" should be placed on the home page.
  9. A navigation bar should be used, either across the top or on the left or right side of each page. Determine some effective way to tell the reader the trail-hiking equivalent of "You are here."
  10. A search box should appear on the home page, "above the fold": on the visible part of the page if the web page extends to more than one screen.
  11. Large sites should have well-organized, tree-structured site maps.
  12. Make reading easier by including lots of white space on each page.
  13. The text on the page should not be smaller than 12 px. The text color should be black, or a color that contrasts effectively with the background color. The text-size units should be expressed in pixels rather than points, so that the reader can use his/her browser to change the size.
  14. For body text on a computer screen, the easiest fonts to read are sans-serif fonts, such as Verdana, Arial, Helvetica.
  15. A printer friendly style sheet should be linked to each page, so it will print effectively, without including the unnecessary graphics and navigation bars.
  16. The print style sheet should be designed so that the URLs under the links are printed.
  17. Links should look like links. Don't make readers wonder: Is this a link?
  18. Use pullquotes to give the reader the essence of the article/story in one or two sentences.
  19. The site should have a blend of two kinds of content: fresh, and permanent.
  20. All images should have "alt" tag added.
  21. Include nothing unimportant. Place everything essential "above the fold".
  22. Remember these "Seven Deadly Sins of Web Design" ... Sites should never: (1) use frames; (2) be so wide that they need to be scrolled left to right; (3) automatically play music; (4) require plug-ins; (5) have a splash page; (6) omit about and contact information; (7) use text too small to be easily read.
  23. If advertisements are included, they should be clearly distinguished from content.
  24. When small photos are reduced from large photos, these should be cropped so that main subject is highlighted, and not too small. (This savvy tip is from a recent article by Nielsen).
  25. If PDF files are included on the page for download, provide instructions to the user that tells a) it is a PDF file; and b) how to download it. Otherwise, if a user clicks that link, the PDF file will open up and could take a long time.
  26. Make the page look interesting and unique.

Usability Books

Usability Web Sites

Please visit the Youthopia Blog Resources page, at
http://www.youthtopia.net/508sites.html


Return to Youthtopia Blog Home Page