Web site examples

Ideal Web Design Goals

• Meet site and audience objectives
• Concise and meaningful content
• Content and readership are key
• Clean and intuitive design
• Consistent user interface
• Effective navigational tools
• Design for the screen
• Exploit the Web!
• Fast downloads (under 40KB/page)
• Browser-independent pages
• Browser-safe and theme colors
• Plug-ins: only if absolutely necessary?
• Easy-to-maintain pages

Web Design Process

• Define site objectives and audience
• Plan your Web site to enhance...
  • usefulness and navigational usability
  • efficiency
  • maintainability and reusability
• Map out information structure
  • how pages related with each other
  • blueprint and flowcharting
  • URL by URL (site map)
• Define user interface
• Visual design
• Production
• Test your pages
• Seek input
• Test again
• Keep improving your Web site

Examples: Good: http://www.discovery.com Good: http://www.enews.com/ Bad:http://ccism.pc.athabascau.ca:80/html/students/stu_html/frame.htm

Traditional Publishing Elements

• Most of them still apply for Web publishing!
• Page elements like font sizes, colors, visual cues and consitent design
• Nameplate, banner or logo
  • prominent on first page
  • smaller version for subsequent pages
  • see AT&T WorldNet home page
• Web page mission statement
• Table of contents
  • what one will find at your Web site
• Kickers
  • links for feedback
  • emphasize links to How To hypermedia
  • provide a search facility (possible on-line)
• Headlines
  • effective short blurbs summarizing what's ahead
  • see http://www.salon.com
• Subheadlines and subtitles
  • very important for navigation
  • they lead user directly to content
  • they help organize the Web site
  • useful to implement information hierarchies
  • not necessarily font/size only...
    • you could use color
    • text on color backgrounds or table cells
    • graphics, indents, rulers
• Leading and pull-quotes
  • like kickers: they give non-intrusive hints
  • they add spice to textual monotony
  • subliminal summary readings/tidbits
• Teasers
  • "free HTML software"
  • a well indexed page clearinghouse
  • track lastest reviews, technologies, etc.
  • see http://www.tweak.com
• Artwork and photographs
  • more important than ever
  • must keep them small in size, though
• Captions - just as important
• Mastheads, credits and contact info