Introduction to Web Design

In this course, students will learn the basics of designing and developing a web site. We'll take a look at design issues specific to web-based presentations, learn web page layout, effective navigation and delve into the design process. We examine some of the how-to's, in's, out's and pitfalls of using graphics, color and fonts on web pages as well as working with tables and CSS. Some site management techniques are covered, accessibility issues and working with domains and clients discussed.

Outline

Week 1: Basics of Web Design

• Focus on the customer
• Working with your clients
• FYI - information on domains
• Web design patterns
• Site development processes
  • Naming conventions
  • Purpose of a website
  • Planning your site

Week 2: Design Principles

• Design principles
• Effective Page Layouts
• Layout options
  • Using tables, layers, frames
  • Working with forms
  • Using CSS to add interest and flexibility to a design

Week 3: Page Layout - Navigation

• Principles of effective navigation
• More than one way to navigate
• Hierarchal organization
• Task-based organization
• Other ways to organize your navigation
• Making navigation easy
  • Bread crumbs
  • Links, embedded and external
  • Error messages
  • Unified browsing hierarchy
  • High-visibility buttons
• Accessibility issues

Week 4: Managing Content

• Speeding up your Site
• Assisting your visitors with task completion
• Writing for search engines
• Printable pages
• Version control
• Searching the site

Week 5: Color and Graphics

• Using color on your pages
  • Flashing colors
  • Bright colors
• Pros and cons of background colors
• Contrast
• Do's and don'ts of Graphics
• Dimension vs weight
• Wrapping text around a graphic
• Using Background graphics
• Banners and moving objects

Week 6: Credibility

• Site branding
• Privacy policies
• Disclaimers
• Email subscriptions

Week 7: Site Management

• Site organization
  • Organizing associated files
  • Keeping prior versions
• Directory structure and organization
• Too many cooks in the kitchen - version control

Week 8: Final Steps and Extras

• Testing your site
• When you need help testing
• Online research

Prerequisites

• Completion of the HTML course (H101) or XHTML course (H401) or equivalent previous html experience can attend. Material covered in the H101 class will not be covered again in this course.
• Students must have webspace available to post assignments, and the ability to post their homework in that webspace.
• Student browsers should be equipped with the latest Flash Player and be able to play Quicktime movies. Students will need at least two browsers, Firefox and IE are recommended as cross-browser compatibility will be stressed.
• Some familiarity with CSS and graphics editing, although not required, is helpful.

Requirements

• FTP software for uploading assignments, such as WS_FTP at http://wsftp.com, an HTML editor such as Dreamweaver or a text editor such as Notepad for hand coding. Although not required, students will find it helpful to have a photo processing application such as PhotoShop or PSP and drawing program such as Illustrator.