Basic Design Principles

  1. Check the alignment.
  2. Group similar elements into closer proximity. (Headlines should be closer to their body copy than to the text or graphics above them. Make sure captions are close to the photos. Make sure there's enough space between elements that are not similar.
  3. Create repetitive elements. (color scheme, consistent background pattern, arrangement of elements, graphic headlines, navigation bar)
  4. Create contrast in appropriate places.
  5. Keep in mind what the graphic safe area of your screen is. For example, if you are designing for a screen that is set to 1024 x 768 pixels , the graphic safe area would be 980 x 580 pixels. The maximum width of the content should be no more than 980 pixels. For the height, the maximum without scrolling is 580 pixels.

The Not-So-Good Design Checklist

  • Backgrounds: gray default background; color combinations of text and background that make the text hard to read; busy distracting backgrounds that make the text hard to read
  • Text: crowding against the left edge; stretches all the way across the page; centered type over flush left body copy; paragraphs of all caps, bold, or italic
  • Links: default blue links; blue link borders around graphics; unclear links; links in body copy that distract readers; text links that aren't underlined so you don't know it's a link; dead links
  • Graphics: large graphic files that take forever to download; meaningless or useless; thumbnail images that are nearly as large as the full-sized images; graphics with anti-aliasing artifacts around the edges; graphics with no alt labels; missing graphics; graphics that don't fit on the screen
  • Tables: borders turned on in tables; tables used as design elements
  • Blinking and animations: anything that blinks, especially text; rainbow rules; under construction signs; animations that never stop
  • Junk: counters on pages; junky advertising; having to scroll sideways; awards that don't mean anything
  • Navigation: unclear navigation; overly complex; complicated frames; orphan pages (no links back to where they came from, no identification; useless page titles
  • General design: entry page that doesn't fit within 980x580 pixels; no focal point; too many focal points; navigation buttons as only visual interest; cluttered; lack of contrast; pages that look okay in one browser but not in another

(From The Non-Designer's Web Book, Robin Williams & John Tollett, Peachpit Press, 1998)

  • Information Services
  • Date Created: June 19 2000
  • Last Modified:June 12, 2008
  • Expires: August 31, 2009