Web Design Checklist
The 2002 Dogwood participants originally developed this peer review web design checklist, which has been modified by subsequent project participants.  While you should consider all of these design elements when you review a web site, not all of them may be relevant for each web site.
Use the following Web Design Checklist to complete peer reviews that focus primarily on design issues.
 
Home Page General Design
Text and Page Design Navigation
Links Color Scheme
Graphics Judgment Calls
 
 

Home Page:

  • The website has a name.
  • The name of the website designer (author) or other contact person is included.
  • The text fits on the screen (very little vertical scrolling).
  • There is a stated purpose/objective of the website. (This purpose could be inferred from the title and navigation; it could be a link to "about this site.")
  • The page is easy/quick to load (no heavy graphics).
  • The page includes a link to the author's college home page and professional home page.
General Design:
  • Be sure that the entire website is ADA-compliant
  • All pages use adequate margins and white space.
  • There is a footer with last update and an email link on every page.
  • A copyright notice is posted where applicable for borrowed material.
  • A descriptive title appears on all pages.
  • The site appearance is consistent throughout.
  • The site has thematic unity.
  • The site is not cluttered.
  • There is navigation back to the site home page on all pages.
  • Each page provides some context for a visitor arriving from outside the site.
  • Each page has one focal point.
  • The footer includes copyright information.
Text and Page Design:
  • All pages should fit in a 600 x 800 window without horizontal scrolling.
  • Pages use an easy to read font, preferably a sans serif font (e.g., Verdana, Arial, Helvetica).
  • There are no more than two fonts in the site.
  • Fancy text is saved as a .gif file.
  • Fonts should be used consistently throughout the site.
  • The text is large enough for mature readers.
  • Fussy text (such as overuse of italics and/or bold) is avoided .
  • All underlined text is hot-linked. (Book titles may be all capitals or italicized.)
  • Large blocks of text are not center-justified.
  • Drop shadows and other eye-stopping graphic textual elements are used judiciously, if at all.
  • There is a reasonable balance between head and navigation elements and page content.
  • There is some visual appeal either through font color or graphics.
Navigation:
  • Any buttons clearly indicate "This is a link."
  • Use the ALT label on the navigation buttons.
  • Design principles should recognize the importance of consistency; consistency issues include:
    • overall color
    • button color
    • position of navigation bar
    • font on button
    • text on button
    • contrast
    • location of footer and webmaster contact link.
  • Buttons and/or bread crumbs lead the user back to the home page.
  • Long pages use anchors.
  • If the site is large, a site map and/or table of contents is linked to the site entry page.
Links:
  • All links work.
  • All links are visible and recognizable and distinguishable from each other and from unlinked text.
  • The link colors are appropriate for site color scheme.
  • Active and visited link colors are consistent and obvious on all pages.
  • The link name should lead the user to a logical location.
  • Add links to plug-ins (e.g. Adobe Reader) as necessary.
  • External links are checked periodically and repaired if necessary.
Color Scheme:
  • Pages provide high contrast between text and background for ease of reading.
  • Background color and design are not intrusive.
  • Use subtle textures for background.
  • Text and link colors are distinct from one another.
  • Brightness is controlled; the screen should not scream out.
  • A page should use from two to four distinct colors.
  • The colors fit the theme.
  • The color scheme is coordinated.
  • The pages use color consistently.
  • The site considers the color blind (avoid red/green) and visually impaired (lack of contrast). Mature users have trouble seeing blue.
  • The site may use color to distinguish different sections.
Graphics:
  • Images load quickly (assume a 56K modem).
  • Images are sharp, clear and well-cropped.
  • Graphics relate to the site theme.
  • ALT labels are included with all graphics, including any navigational buttons.
  • Graphics links have a matching text link unless the graphic link is obvious.
  • Animated graphics turn off by themselves.
  • Graphic elements (photos, subheads) break up large areas of text. Repetitive graphic elements unify site appearance.
  • Graphics are in jpeg (photos) or gif (line art or graphic with solid colors) formats.
  • Graphics are optimized for minimum download time consistent with quality.
  • Judiciously use graphics to add interest to most pages.
  • A copyright statement is used to indicate the source of each image that is not "free."
  • If thumbnails are used, they must convert to larger images quickly over a 28K modem.

 

Dogwood logo.
 

This page is copyright © 2004, A. Taormina and C.T. Evans
For information contact cevans@nvcc.edu