|
General
usability guidelines
Research
based web design and usability guidelines
Webstyle
guide
Tinhat.com
usability pages
Top
ten mistakes in webdesign from useit.com: Jakob Nielsen's
website
Usable web
Usability
News at Wichita State University
Usability
First: Usability Links
Common usability mistakes
Formatting
Effects
of Surrounding Information and Line Length
on Text Comprehension from the Web by McMullin, Varnhagen, Heng,
& Apedoe
The influence of reading speed and line length on the effectiveness of
reading from screen. by Dyson and Haselgrove in the Int. J.
Human-Computer Studies (2001) 54, 585-612.
The Effects of Line Length on Children and Adults. Online Reading
Performance by Bernard, Fernandez, & Hull
The relationship between comprehension/reading speed and line length is
not clear. McMullin et al. found no relationship using line lengths of
55 characters and 115 characters. These corresponeded to approximately
360 and 760 pixels on their display. By comparison, Dyson and
Haselgrove found that comprehension was better for text displayed at 55
characters per line than at 100. Bernard found suggestive but not
conclusive evidence for a comprehension advantage of a medium line
length of 76 characters per line (550 pixels) over both a short line of
45 charcters per line (330 pixels) and a long line of 132 characters
per line (930 pixels). Regarding preference, their users were about
equally split between preferring the short and medium line lengths with
no users (out of 20) preferring the long line lengths.
Considering both comprehension and preference, we recommend that
developers shoud avoid both short and long line lengths. Line lengths
should be roughly between 500 and 700 pixels in length which typically
corresponds to approximately 70 to 100 characters.
Contrast
on screen
Provide
contrast between text and background
Accessibility
guidelines
Section 508 of the 1998 amendment of the
Rehabilitation Act stipulates that all electronic communication of a
Federal entity must be made to be accessible by those with disabilities
and influences the development of websites other than those owned by
the Federal Government due to the scope, applicability, and public
availability of those specifications. The W3 organization maintains a
Web Content Accessibility Guidelines document which specifies methods
and general guidelines with which a web content author may design a
site to be accessible by those with disabilities or even by those in
sub-optimal viewing conditions (such as insufficiently-lit rooms).
Since plain text is a media universally accessible in some form or
other, generally these sources advise that a web author should make all
content or equivalent content available to the viewer in the form of
text.
http://www.section508.gov/index.cfm?FuseAction=Content&ID=3
http://www.w3.org/TR/WAI-WEBCONTENT/
Getting
Started: Making a Web Site Accessible
Accessibility
checklist
Dive
Into
Accessibility
Go
button with drop down lists
Do
we need a GO button?
Should
a GO Button be Included with a Drop-down List?
Breadcrumbs
Breadcrumbs are navigational aids on a website; they help users
to figure out the structure of the site and they reduce the
memory load by showing the location or the path for the current
page. They also offer “shortcut” links to previously
visited pages.
There are three different types of breadcrumbs. The location
breadcrumbs are the same for a particular page regardless of
how the user got to it, whereas path breadcrumbs show the actual
path of the user. More than one attribute breadcrumb can be
show on the same page representing several possible locations
of the page within the hierarchy of the website.
According to a survey by Summers, Colter and Smith on 3,500
commercial websites only about 17% use some type of breadcrumb.
The most frequently used connector type is the greater-than
sign (>). Based on the same study it seems that most users
don't notice breadcrumbs as specific navigational elements,
they use them as regular links.
Another study by Rogers and Chaparo (2003) from Wichita State
University found that breadcrumbs users use less frequently
the browser's Back button than non-breadcrumb users. Additionally,
breadcrumbs located under the title of the page are used more
frequently than breadcrumbs on the top of the page. However,
only 6% of the page clicks were accounted by the breadcrumbs.
As a summary, breadcrumbs are useful navigation tools on a website.
They help users to understand the structure of the website. Finally,
breadcrumbs should be located under the title rather than on the top of
the page.
Further readings:
Location,
Path and Attribute Breadcrumbs
Breadcrumb
Navigation: An Exploratory Study of Usage
Breadcrumb
Navigation: Further I nvestigation of Usage
Navigation-General
Always indicate to the user where he/she is
in the
site by using breadcrumbs and navigation bars.
Change the color of visited links to help navigation.
Avoid "orphan page" that don't link back to the site.
To larger sites add a site map.
Use the same title for pages as the referring link.
Navigation
aids
Menus
There is a wide range of menu styles
available to
web page designers, each with its own descriptive name, e.g.
drill-down, fly-out, drop-down, cascading, and rollover. Regardless of
the menu style, the advise from designers is unwavering: use menus
sparingly on the web. They can help designers conserve space, reduce
clutter, and present hierarchically structured information. However,
they are associated with a number of usability problems. For instance,
they may be confusing to users because they are used for such a myriad
of purposes; by definition, they reduce the amount of information
presented to users prior to their selection; and they limit category
descriptions to 2 or 3 words at most. However, should you choose to use
menus in your web design arsenal, it is generally recommended to use
menus which provide more control to users, such as point-and-click
menus, rather than mouse-over menus.
Drop-down
menus: use sparingly
A
flying menu attack can wound your navigation
Navbars:
Why Drill-Down Menus are Harmful
Users
Decide First; Move Second
Mouse-Over
vs. Point-and-Click: It Depends!
Pop-up
windows
Pop-up windows can be a usability disaster if used without great care.
However, when used properly, there are circumstances in which they can
greatly enhance usability. Caroline Jarrett provides five sensible
guidelines for using pop-ups: (1) The user expects the window to be a
pop-up, (2) there is an advantage to seeing the pop-up without leaving
the existing page, (3) the pop-up is relatively small, (4) users know
how to close the pop-up, and (5) only one pop-up is open at a time. In
addition, Barry Tedstone adds that pop-ups should not have links.
Although we generally agree with this, there are exceptions. One is an
informational site with pop-ups for glossary items. Glossary items
should be able to link to other glossary items but not to any other
pages. Only one glossary item should be open at one time.
As pointed out by Philip Chalmers, pop-ups are particularly useful for
(1) contextual help when it is important for the user to see the help
and the original page at the same time and (2) dictionary pages and
other explanations. Sean Kenney contends that pop-ups should not be
used for navigation. Although we agree in general, there are
exceptions. For example, the online books at Atomic Dog Publishing have
a pop-up table of contents that allows the user go navigate throuhg the
sections in the book. Their interface appears to be quite usable.
A Farewell to Pop-Ups
Pop-Up
Windows and Accessibility
Usability
- Pop-up Windows
Search
Search:
visible and simple
Add
search to your site
The
Search Box - Increasing Usability
Cancel/Clear/Reset
buttons
Reset and
Cancel Buttons
Don't
use Clear or Reset Buttons
Information
architecture:
Website design: Information architecture
Stanford
Guidelines for Web Credibility
|
Home 
Research 
Resume 
Photos 
Portfolio 
Links 
Email 