Good Design List

A positive response to the two "Does Your Web Site Suck?" checklists at the http://www.webpagesthatsuck.com/ web site by Vincent Flanders

Updated 3/7/2009 at 2:40 p.m.

Optimization, Speed of Loading, and Getting the User's Attention

  1. Your index page must load within 4 to 7 seconds.
  2. Explain what your site is about very quickly. You have 4 seconds to engage your user's interest.
  3. Make sure your users know what your site can do for them.
  4. Limit the content of the index page so it all fits in one screen (i.e. does not require scrolling).
  5. Other screens should fit within 4 or 5 "pages" of scrolling. Web users like to skim the pages.

Navigation, Layout, and Consistency

  1. Make sure the <title> tag contains something meaningful.
  2. Do not require horizontal scrolling.
  3. Keep your pages consistent. The user needs to know where to find navigational elements.
  4. Don't use a splash page. Get to the point on your index page. Navigation should be immediately available on the index page.
  5. Use white space to separate important content items.
  6. Do not over-use white space.
  7. Limit your use of pop up windows. Use them only if necessary.
  8. Provide clear instructions on your forms.
  9. A site's navigation should tell you where you are, where you're going to go, and how to get back to the home page.
  10. Each page should have a link (probably in the main navigation) back to the home page.
  11. Do not use Flash animation.
  12. Navigation must be in the index page. It must be above the fold (in the first screen-full if the page scrolls).
  13. On a business site particularly, the logo should be at the top, and on every page.
  14. The logo should be an active link to the home (index) page.
  15. Images should enhance, not detract from, the page's content.
  16. Do not use images for text content.
  17. Do not use flashing or animated images. They may cause seizures.
  18. Make sure your site has a legal and/or privacy statement page.
  19. Keep your site updated and current.

Text and Color

  1. Use no more than 2 different font styles and sizes per page. This includes text colors.
  2. Don't use text that is either too small or too large.
  3. Make sure your text can be resized by the user.
  4. Use sufficient contrast between text and background color.
  5. Use underlined text only for hypertext links. (Underlined links are done automatically by the browser.)
  6. Unless your links are in a navigation bar, leave them underlined.
  7. Links should say something other than "Click Here".
  8. Links should be labeled/worded clearly and concisely. Make sure the user knows what the link is going to display.

Plugins and Technology

  1. Do not make Flash the basis of your site. Use Flash elements sparingly.
  2. Do not automatically play music or movies when the page loads.
  3. Use pdf files only if absolutely necessary. Pdf's are not designed as a substitute for Web pages. Pdf's are primarily intended for displaying printed forms.
  4. If you link to a pdf, excel, or powerpoint file, tell your users what kind of file they are linking to.

Browser Compatibility and Testing

  1. Test your site in several major browsers to make sure it looks the same in each browser. (Test in IE and Firefox at a minimum.)
  2. Make sure links work, images are visible, "Lorem ipsum" text is not in any pages, etc.
  3. Don't assume that your users will understand your links and navigation. Get someone else to test your site and give you feedback.