Web Design and Usability Techniques 

Overview:    This course is designed for individuals getting started in Web design and development, and focuses on creating static sites. Dynamic, database-driven sites involve additional design approaches that are beyond the scope of this course. However, the concepts in this course still apply to dynamic content, since the focus is on what the user sees, rather than how the content is generated. This course is designed for anyone interested in learning some important principles of Web design that apply to just about any purpose or theme. You will explore several pitfalls of Web design and how to avoid them, and a variety of design tips and guidelines that you can use no matter what your Web site project entails. Students taking this course should have at least intermediate-level experience with HTML, including tables and forms, and familiarity or experience with Cascading Style Sheets (CSS). 

Prerequisites: 

Delivery Method:    Instructor-led, group-paced, classroom-delivery learning model with structured hands-on activities. 

Hardware/software required to run this course 
•	Windows 95, 98, NT or 2000, or Macintosh OS. 
•	32 MB RAM 
•	A 486 or faster processor (Pentium or equivalent is strongly recommended). 
•	An 800 x 600 or higher resolution color monitor set to a minimum of 256 colors. For best image quality, we recommend setting monitors to High Color (16-bit). 
•	Microsoft Internet Explorer 4.0 or later. 
•	Netscape Navigator 4.x. Some concepts and exercises in this course discuss support issues in Navigator 4.x. 
•	A working connection to the Internet. 
•	Microsoft Personal Web Server (PWS) 
•	Browser Sizer: Download a free copy at www.applythis.com/browsersizer/ 
•	(Optional) PowerMapper: Download an evaluation copy at www.electrum.co.uk/mapper 
•	Mac users: Download the Macintosh version of the W3's Tidy program at www.geocities.com/SiliconValley/1057/tidy.htm. Once there, click on the "download" link to access the Macintosh download page. 

Performance-based objectives
Lesson objectives help students become comfortable with the course, and also provide a means to evaluate learning. Upon successful completion of this course, students will be able to:
•	Identify common problems in Web design. 
•	Effectively plan a Web site project. 
•	Create designs that focus vital content above the "fold". 
•	Identify image formats. 
•	Use images effectively. 
•	Use color effectively. 
•	Recognize the benefits of valid HTML 4.0 code. 
•	Identify structural problems. 
•	Use server-side includes to organize and maintain code templates. 
•	Apply CSS styles that break down gracefully. 
•	Critique a site's usability. 
•	Apply techniques that enhance usability. 
•	Recognize effective navigation techniques. 
•	Create accessible Web sites. 
•	Design for different monitor resolutions. 
•	Use browser detection scripts. 
•	Publicize your Web site. 
•	Write effective meta content. 
Lesson 1: Overview of Design Issues
       Common Problems in Web Design

Lesson 2: Planning a Site
       The Planning Phase
       Choosing a Site Metaphor
       Content Outlining and Storyboarding

Lesson 3: Design Guidelines
       Choosing a Design Approach
       Using Site Mock-ups
       Page Design Considerations

Lesson 4: Effective Use of Images
       Choosing the Right Image Format
       Optimizing Graphics

Lesson 5: Effective Use of Color
       Color 101
       Color and Design

Lesson 6: Writing Good Code
       Authoring with HTML 4.01
       Validating Your Code
       Organization and Maintenance Techniques

Lesson 7: Safe CSS
       Styles that Break Down Gracefully
       Web Typography with CSS

Lesson 8: Creating Usable Sites
       Principles of Usability
       Simple Usability Techniques
       Designing Effective Navigation

Lesson 9: Accessibility
       Creating Accessible Sites
       HTML and CSS Accessibility Techniques

Lesson 10: Dealing with Browser Incompatibilities
       Browser and Platform Issues
       Using Browser Detection Scripts

Lesson 11: Publicizing Your Web Site
       Promoting Your Site: Meta Content

Lesson 12: Review
       Apply Your Knowledge

Appendix A: Quick Reference