Four questions to answer before beginning any design

  • What is the point of the site? -- To promote? To educate? To sell? Etc.
  • What are your goals for the site? -- What features might achieve those goals?
  • Who are you, and who's your audience?
  • How will people view your site? -- Dial-up modem? Brand new Macs or old PCs?
 
 
Thumbnails
 
Three traits of good design
  • Has unity and variety
    • Most common problem -- too much variety
  • Supports, but does not overpower, the message
  • Appropriate to particular message being conveyed
 
The designer's mission
  • Unify
  • Clarify
  • Organize
  • Emphasize
  • Simplify
 
Considerations for page architecture and hierarchy
  • Many users will view pages on much smaller monitors than those in the lab
    • Basics of page (navigation, company name, etc.) must be viewable at 640x480 pixels
  • In Western cultures, people read from left-to-right, top-to-bottom
 
Choosing your color palette
  • Do the colors work in harmony with the content of the site?
    • Color conveys emotions
  • Do the colors exist on the 216-color Web-safe palette?
  • Palette should be limited to 3-4 colors
 
Poynter eye-track studies
  • What do Web viewers look for first -- text or images?
    • Text -- Readers often look for images only after having clicked away to a full-length article
 
Back to Top
 
 
 
Choosing your typography
  • Limit the number of fonts (3 maximum)
  • Give each font a particular job (one for headlines, one for body copy, etc.)
  • Don't forget bold for contrast, but avoid italic except in very small doses
  • Good strategy -- one serif and one sans-serif = automatic contrast
  • Serif fonts -- Times, Georgia, Palatino
  • Sans-serif fonts -- Helvetica, Arial, Verdana
 
Typographical warning
  • The font must be on the individual user's computer in order for it to display correctly
  • You're safe with -- Times, Georgia, Helvetica, Arial, Verdana
  • Only way to be sure other fonts will display is to create GIFs (e.g. headlines, buttons)
 
Choosy typographers choose GIF
  • Fonts similar to these must be embedded in GIFs to ensure they will display correctly on all computers
 
Back to Top
 
 
 
Readability -- Color and type
  • Is all type (including visited links) easily readable on the background color?
  • Black type on white background may be dull, but it's foolproof (add color in other elements)
  • Too boring? Go for maximum contrast, then back off just a bit (e.g. black on light gray or pale blue)
 
Readability -- Other issues
  • Line lengths -- long ones slow down reading
  • Smaller the type -- shorter the line lengths
  • Optimum line length -- 39 characters per line (300-400 pixels wide for text type)
  • Best constrained in a table
    • Could also use <blockquote>
 
 
 
 
 
Back to Top
Back to Web Publishing Page
Back to Main Page