Final Project Assignment: UPDATED
Your final project assignment:
Submit three (3) high-quality, hand-coded, custom-design, standards compliant web sites.
Due Dates
- Monday, April 12: Submit Site #1
- Monday, April 19: Submit Site #2
- Monday, April 26: Submit Site #3 — OR UPGRADE YOUR SITES 1 & 2
New Options for April 26 Deadline #3
If you prefer, or if you need — rather than design a new site, improve, enhance or develop your sites 1 & 2. If you pursue this option, you will need to obtain my approval on a plan that involves significant new work, in addition to the standard criteria below.
Options include:
- Add a functioning Contact Form, and style it so that it jibes with your site. (See the upcoming post with code and instructions.)
- Add an additional Javascript component.
- Optimize it for the mobile web — perhaps for the iPhone, iPad, or other mobile devices. (See the upcoming post with information to get started.)
- I am open to other recommendations and will help you land on a plan during Monday’s class. As usual, I will be available to assist you on Wednesday and Friday.
Evaluation Criteria
Pro-Quality Design
- Beautiful Photoshop images (see recommended tutorials below)
- Simple, Straightforward layout (header, footer, 2 or 3 columns)
- A Portfolio Page with a portfolio stack and lightbox
- A strategically used content slider
- Clear Visual Hierarchy
- Good use of Whitespace (margin’s padding, etc.)
- Skillfully designed typography
Pro-Quality Code
- valid XHTML 1.0 markup
- valid CSS
- NOTE: advanced CSS may be strategically used, following the principle of “progressive enhancement” — CSS3 does not have to validate.
- a reset, base, and or global stylesheet
- stylesheets for print and Internet Explorer
- strategic use of jQuery — most typically:
- lightbox
- a content slider
- hide and show
- At least one site should make some strategic use of the PHP-include function — which we will cover soon.
- NOTE: Check back here. I reserve the right to add to this list!
HTML/CSS Frameworks
Here are links to the frameworks we’ve been working on together.
Recommended Resources
First, don’t forget our Web Design Resources page!
Photoshop Skills
- Create a Set-Width Translucent Design — Tutsplus.com
- Includes ability to place large full-width image behind translucent bars.
- Design a Beautiful Website From Scratch :: Nettuts+
- 8 Great Web Design Tutorials :: Powerusers
CSS Review and Assistance
- “CSS in Depth” :: a series of 4 articles :: Spyre Studios
- a GREAT review of key CSS principles, and an introduction to CSS 3
- CSS for Designers — Lynda.com
- HTML Dog Tutorials
- W3 Schools