    |
Web Usability Checklist
The following checklist includes most of the factors that we consider during a usability evaluation of a prototype, or a partial or full user interface. They are a work in progress. Check back periodically for new versions.
Table of Contents
- Site Design
- Navigation
- Page Design
- Text & Typography
- Links
- Graphics
- Forms
- Text Boxes
- Drop Down Menus
- Labels
- Checkboxes
- Radio Buttons
- Buttons
Site Design
Content
is useful, accurate, up to date, and relevant to the audience
Provides
at least one contact for the Web site, and provides alternate contact
methods (phone, snail mail)
Information
is organized in manner that makes sense to the users
Information
is chunked into meaningful units
Has
been tested with actual users
Navigation
Matches
the way users will want to work or complete a task
Navigation
is designed for what 80% of the users need to do 80% of the time
Provides
a home page for each major area of the site
Relies
on organization more than search fields
If
uses search fields, places them toward the center and right, uses large
font for the label
Page Design
Important
content at the top of a page
Each
page has a title
Information
is aligned vertically
Avoids
horizontal scrolling
Limits
home pages to two screens
Limits
inside pages to maximum of six screens for each page
Utilizes
sufficient white space
Minimizes
the number of unique margins
Provides
layout consistency throughout the site
Uses
grouping to bring order and show connection
Uses
a consistent footer
Name
and/or logo on every page, links back to the site's home page
Text & Typography
Uses
at least a 12-point for headings, and prefereably a 10-point font for
text
Avoids
overly decroative fonts
Never
any more than six different fonts on any page
Does
not place text on busy backgrounds
Avoids
text in ALL CAPITAL LETTERS
Writing
is grammatically correct and is short and concise
Uses
short paragraphs
Uses
headings and sub-headings for text
Links
Uses
visual cues, such as color, size, and positioning to show how relatively
important links are
Puts
important links on the top half of the page
Uses
enough text to explain a link
Links
only keywords, not the whole paragraph
Linked
graphics are large enough and spaced widely enough for easy clicking
Places
the text link at the beginning of a paragraph
Matches
the wording of the link with the title of the page it goes on
Graphics
Every
graphic has a reason/purpose/meaning - no purely decorative graphics
Absolutely
NO animated GIFs
Uses
graphics that are as small in file size as possible for fast loading
Uses
alternative text tags or graphics
Uses
text descriptions with graphics if helpful
Avoids
beige or brown pictures
Makes
graphics linkable as much as possible
Forms
Shows
what data is required and/or optional
Groups
data appropriately
Labels
grouped data meaningfully
Uses
a group heading to separate the groups
Matches
the user's workflow
Makes
best use of standard controls
Text Boxes
Lengths
of fields match where appropriate
Shows
display-only data without a box
Uses
consistent field height
Left
aligns data, except for true numerical values
Text
boxes indicate data length if necessary
Uses
default value if appropriate
Drop Down Menus
Ordered
appropriately
Used
to save space
Used
if users will pick default most of the time
Used
for navigation or data entry
Labels
All
fields have labels
Uses
industry standard abbreviations only
Includes
colons
Places
label at center of text height
Checkboxes
Used
as a toggle
Stacks
vertically
Orders
appropriately
Not
used for mutually exclusive choices
Radio Buttons
Used
only when one choice (of a group) is available at a time
Stacks
vertically
Labels
the group meaningfully
Orders
by frequency or logic
Buttons
Uses
clear and concise button labels
Uses
heading style capitalization for button label
Labels
buttons consistently
Buttons
appear where they are needed
