The purpose of this project is to apply what you have learned about effective CSS and other Web design techniques. As with the CSS Zen Garden project, you will be given an HTML document to format with CSS. You will also submit a final design report in which you discuss your goals and technical implementation of the project.

Your Mini Zen Garden project should demonstrate significant changes from the CSS base-file, and should reflect a wide range of understanding of CSS principles, both for layout and text formatting.

After the project submission date, you will be asked to present your design in class. The class will review and vote on their favorite submissions.

The Style Sheet & Design

Everyone in the class will post their project to their UWSP inetpub folder. You may not change the XHTML document. Instead, you must use CSS to change the look and layout of this document. Remember that you can include images in CSS to further make the style of this document your own.

While it is standard practice among designers to borrow CSS code snippets and gain inspiration from others, as a whole, your design should be an original composition. Before you use a design element from the Web, make sure you have permission.

Standards & Browser Compatibility

In order for everything to work, you will need to post this XHTML document (index.htm) to a folder at the root level of your inetpub folder called mini-zen. You should also save the stylesheet to the same folder (style.css) as well as your design report (report.htm), described below.

Images and other resources can be saved wherever you deem appropriate.

Mozilla Firefox does a better job of supporting web standards, so your style sheet should be primarily designed to work with Mozilla Firefox. It should also be viewable in IE 6 and degrade gracefully.

As you work on your project, load your style sheet to your UWSP Web space. From your index.htm page, use the css link under "validation" to check your style sheet.

Design Report

In addition to posting your completed style sheet to your Web space, you will also write a 500-800 word Design Report in which you:

Post your Design Report to your Web  folder as design-report.htm. It should make effective use of headings, bullets, and other design conventions.

The best project submissions will also apply their style sheet to their Design Report.

Suggestions

As you browse the Web over the next few weeks, pay attention to the various designs you see on the sites you visit. Spend some time surfing around CSS Zen Garden for inspiration. Consult some of the sites listed on the Resources page of our course website. Bookmark pages and take notes from any sites which you find interesting.

If you use Firefox for browsing, Chris Pederick has created an extension called Web Developer that provides a number of tools for evaluating other sites' designs.

Grading

When your project is ready to grade, send me an email with the name of your mini-zen garden. I'll update the include file.