Web Design Tips - Pt. 2
 ISSUE 33   July 2002|  updated 7/12/02   

 

49 Tips for Better Websites- Part 2 of 3

We started this series with Writing for the Web, Visual Design, and Color.

This month we're covering Type and Graphics, and we'll finish up next month with Domains & Hosting and Promotion.

These are only my opinions, based in experience and lots of research. Many were learned the hard way. But they're still only opinions. As always I welcome your comments and additions or deletions to these lists.

Learn more about web design:
Online tutorials
Recommended books
 
  Typography
  1. Keep it simple! Use no more than 2-3 different typefaces (fonts) for your entire site.
  2. Keep it consistent: pick a particular font & size for headlines, subheads, main text, etc., and stick to it.
  3. Typefaces have personalities: choose what's appropriate for your material.
  4. Make type large enough to read easily: users prefer 10 to 14 pt. type for main copy.
  5. Italics and bold become difficult to read after a few sentences: use them sparingly
  6. Use ALL CAPS only for emphasis, headlines, etc. As above, they are hard to read in quantity.
  7. Contrast can be effective: Use bold or fancy headlines with normal text, etc.
  8. Don't use a script or italic font in all caps: it's very hard to read.
  9. Don't set type vertically: it's nearly impossible to read (we're used to reading left to right).

Agree? Disagree? Email me your comments. See also links on typography on the web.

All caps are a no-no with script or italic!

Likewise, running the letters vertically:

 
 

Graphics

  1. File size is critical: a 50k graphic takes about 10 sec. to download on a 56k modem.
  2. Low resolution is the name of the game: 72 ppi is all you need.
  3. Less is more: a few well-chosen graphics reduce visual clutter and speed download.
  4. Re-use the same graphic in different places to save download time.
  5. Use GIF for typography and flat, cartoon-y artwork.
  6. Use JPEG (JPG) for photographs and art with subtle color blends.
  7. For large images, use a small "thumbnail" to link to the image on another page.
  8. Use "interlaced" or "progressive download" format so large images show up in stages as they download.
  9. Create simple backgrounds by "tiling" a small image: be careful to not overpower the text.
  10. Avoid web "clichés": spinning logos, 3-D buttons, blinking text, rainbow effects.

Yes? No? Email me your comments.

Return to TOP  
  Coming next month: Domains & hosting; Promoting your website.

 

Return to TOP

 

 

 
 
TOP
| HOME  |  ABOUT  |  EMAIL US