web site design & implementation 409
winter quarter 2009 (092)

& meeting
Dan Bogaard
primary e-mail: dsbics@rit.edu
office phone: 475-5231
office location: 70b-2571
current schedule

Section 409.01: Class meets Mon/Wed, from 10-11:50am, in 70-3690

My office hours this quarter are Wed 2-4 & Thurs 12-2 in my office

Description &
  • 4002.320 -or- 4004.741
  • 4002.360 -or- 4002.720
  • 2 course programming sequence

Important note for non-IT students: This course is not intended for students wanting a one-course introduction to web site design. All prerequisite knowledge applies to all students [You should be familiar with basic HTML coding (using text editors!), CSS (both textual and positioning manipulation), web graphics creation/optimization, and basic design principles for the web, simple SQL statements, as well as UNIX commands for creating, deleting, renaming, and changing permissions for files and directories].

  • Information design & architecture
  • Graphic design, including typography
  • Basic JavaScript
  • Dynamic HTML (DHTML)
  • Web-based forms
  • Server-side technologies (CGI, SSI, php, authentication)
Texts &

The following texts are available at the bookstore, or via online booksellers such as amazon.com and bn.com. Note that all of the texts are recommended. They make a good suppliment to the online readings found at the end of this syllabus.

Bulletproof Web Design: Improving flexibility and protecting against worst-case scenarios with XHTML and CSS (2nd Edition) (Cederholm)
New Riders, ISBN: 0321509021
-XHTML/CSS ubiquitous web design

coverInformation Architecture, Blueprints for the Web (Wodtke)
Que, ISBN: 9780735712508
-Information Architecture

coverWebmaster in a Nutshell, 3rd ed (Spainhour)
O'Reilly & Associates, ISBN: 0596003579

Grading &

Your grade will be based on your individual assignments (40%), your group project (40%), and a final practical (20% - based on in-class exercises).

It's important to understand that if you complete all the requirements for an assignment, that entitles you to a grade of "B" (i.e. "satisfactory work"). To receive an A for an assignment, you must go beyond the basic requirements, and demonstrate creativity, initiative, and excellence--the grade of A is intended for work that is superior, rather than average.

Assignments submitted after the due date/time, without prior approval from me, will lose one full letter grade for each day that they are late. If you know that a situation will prevent you from turning something in, contact me in advance of the deadline to make alternate arrangements.

If you wish to dispute your final course grade, you must do so before the end of the quarter following this one; otherwise documentation of your work may not be available.

Last Day to Drop the Class: For this quarter, you can drop the class on or before Sunday - December 6th. After that date, you must withdraw from the course, which will show on your transcript as a W.

Last Day to Withdraw: The deadline for withdrawing from a course with a W grade is the end of the 8th week of the quarter. Forms may be obtained from the IT office, and must be signed by your instructor. Completed forms should be returned to the IT office no later than the last day of the 8th week . After that date, a grade will be assigned based on the work that you have submitted.

"Incomplete" Grades: You may request an incomplete, or "I" grade, only in cases where exceptional conditions beyond your control, such as accidents, severe illness, family problems, etc., have kept you from completing the course. You must alert us to these circumstances as soon as possible--telling your instructor in Feburary that you were sick in January is not acceptable. If your request for an incomplete is granted, you must complete the work for the course within the time limits set by the instructor. The maximum time is two (2) academic quarters. Unfinished "I" grades automatically become "F".
Incomplete grades are not given to students who have simply fallen behind in their work.


Assignments will be discussed in class, and posted here. They will always be due at 5pm on the due date. Except for the design document, all projects are web pages - so they MUST be up and viewable on the web (in the specified directories and viewable from the class-list). Once you are finished with the assignement, please do NOT modify them in any way.

Individual Assignments:

  • Assignment 1: Create a new directory named 409 in the www directory of your gibson account for your assignments, and place in that directory an index.html page from which you will link all subsequent assignments. (That means the url to the index.html page will be http://people.rit.edu/yourid/409/ .) The page must include a picture of yourself, your name, and your preferred e-mail address (the one you check most often, and would like me to use). Do your best to use the principles of design you learned in 320; I want to see the best you can do (that does not mean putting in every type of bell and whistle you can imagine; keep it simple and clean.) Make sure that your page is linked from the class list page (found above in the pull-down menu). All future assignments will just be linked from this assignment. (end of second week).
  • Assignment 2 ("Midterm"): Create a promotional website for a movie of your choice. The website should include at least 10 separate pages linked. You will be graded on your basic design, organization of information, content, navigation and use of CSS (both text and positioning), and server-side authentication. Include as a part of your project a separate linked page documenting what you have done in each category. (end of fifth week).
  • Assignment 3 ("Final"): Create a revised and expanded version of assignment 2, incoporating a variety of technologies covered in class. (end of tenth week)

Grading Guidelines:

  • Clean, standards-compliant HTML (passes either w3c or WDG in batch mode HTML validator check). The WDG one MUST have an index.html file to work...
  • Documentation of process and citations to code sources
  • Content and design
  • Technology implementation

Based on the information you provide to me in the pre-test, I'll divide the class into five or six groups of 5-6 people each. You'll find out your groups in class in week 2.

Your group project grade will be based on the assignment grades (60%), and a peer evaluation that will be filled out by each group member (40%).

  • Group Assignment 1: Site Design Document with page mock-ups. Due in class, Wednesday, 5th week. (25%)
  • Group Assignment 2: Prototype of site for in-class critique. Due in class, 9th week. (ungraded)
  • Group Assignment 3: Final presentation of site, our final time. (35%)
  • Peer Evaluation: You will evaluate each member of your group based on their effort and the quality of their work. Due along with final presentation. (40%)
I will post announcements related to class in our class conference on the mycourses server, rather than sending mass e-mails. I will also set up conferences for each group; I strongly suggest that you use them for group communication. If you do not yet have an IT account (or an NT account, which you'll need to use the PCs in the lab), you can get accounts set up in the IT learning labs in building 70.

It is important that you understand what consitutes academic dishonesty, and what the penalty associated with it is. Read this policy carefully. Please note, in particular, the definitions of cheating and collusion. There is a fine line between asking for a classmate's help in solving a technical problem, and using their work as your own. Don't cross it. Similarly, while it's fine to get ideas from web sites, you must credit your source. If you violate the academic dishonesty policy, you will fail the course. It's just not worth it.

(VERY subject to change)

The readings for each week should be completed before that week begins, so that you're prepared to work with examples and exercises, and to ask questions.


Course Overview


WebStandards.org FAQ
DOCTYPE Explained
Are Users Stupid?
Zen Garden

Weeks 2-4

Information & Graphic Design

Week 2:
Web Typography
CSS Type Formatting
CSS Positioning

Weeks 3-4:
Information Architecure,
Organization Information,
Interaction Design/Navigation,
Presentation Design &
Information Architecture



Week 2 Readings:
Web Typography

Week 3-4 Readings:
Webmonkey IA tutorial

Eye-tracking study
Color Picker-1
Color Picker-2
Color Swatches
Play with color in a page setting (somewhat limited)
Stripe generator
Reflection generator
'web 2.0' designs
Inspiring Design
Yale Site Design - Style Guide
The Magic Number Seven
Web Navigation
Designing User Experience

Assignment 1

Weeks 5-7


  • The Document Object Model
  • Javascript Basics
  • HTML Forms
Cross browser issues (and some fixes)
Webmonkey JS Tutorial
w3schools JS Tutorial
w3schools Form Tutorial
w3schools DHTML Tutorial
DHTML Lab (resource)

Assignment 2

Group Assignment 1

Weeks 8-9


  • basic server operation & configuration
  • SSI and XSSI
  • PHP and MySQL
  • .htaccess files for server-side authentication
Other Possible Topics:
  • Accessibility
  • php introduction
  • http - what exactly is going on?
  • SVG

Apache SSI Tutorial

Group Ass. 2 (Prototypes)
in class, 9th week (9a).

Weeks 10

review for final practical (10a)

Last Class (10b) - Practical Exam!

Practical Exam
in class, 10th week (10b).

Assignment 3

Finals Week Presentation/Critiques of Final Group Projects Group Assignment 3