GCOM 362 : Int. Creative Web Page Design

Spring 2009 | Jan. 17 - May 20 Wednesdays, 5:30-7:10 = p.m.

Rm: COS=20 108
Instructor: Aaron Winters email
Office Hours: = 7:10 - 8=20 p.m., immediately following class.
GCOM site = | GCOM Blog =

Download Syllabus As PDF HERE

Course Requirements & Objectives

Required Texts

Stylin' With CSS By Charles Wyke-Smith (New Riders, ISBN:=20 0321525566)

Dreamweaver CS4: Visual Quickstart GuideBy Tom Negrino & = Dori=20 Smith (Peachpit Press, ISBN: 0321573528)

Required Software

You must have access to the following software: Dreamweaver CS4 and = one of=20 the following: Photoshop, Illustrator, Fireworks, or other robust = graphics=20 editing program; Firefox web browser and one other web browser software = (Safari,=20 Explorer, Mozilla, Opera etc.) Access to both PC and Mac computers is=20 recommended.

The best possible place to buy the absolute cheapest Adobe software: = http://www.uscollegebuy.com/s.= htm.=20 This is special pricing that is only for California Community College = students=20 and faculty. For Adobe apps, it is a fraction of the price from any = other=20 educational supplier.

Prerequisite

GCOM 361 with a grade of "C" or better or the equivalent. Please be = advised=20 that knowing how to make original graphics in Web file format is a = prerequisite.=20 I can not provide graphics for you. You are responsible for getting = appropriate=20 graphics for your site and will be graded on the appropriateness of your = graphics. It is nearly impossible to pass this class without meeting the = prerequisite. Taking GCOM 360 (Graphics for the Web) concurrently will = satisfy=20 the prerequisite. I am happy to discuss your individual situation if you = need=20 advisement.

Goals and Requirements

Although we will review these concepts, these are some skills you = will need=20 prior to the class to do well in this class. If 3 or more of these = concepts are=20 above your skill level, you may need to take or repeat the beginning = class, GCOM=20 361 or participate in additional reading and practice to catch up:

Basic HTML (or at least be acquainted with the concept)=20
Know how to make your own graphics=20
The Dreamweaver Interface, how to upload and download, open, edit = and save=20 files=20
Familiarity with the concept behind CSS

What you should be able to accomplish at the end of this class:

Redesign an existing site=20
Write a creative brief and a project proposal=20
Create a full, professsional looking site that is = search-optimized,=20 accessible and functions on multiple browsers.

Attendance:

Mandatory Attendance Required for the first class, midterm and last = classes.=20 Attending lectures will help make the most of your learning experience. = If you=20 miss THREE OR MORE classes, and have not discussed these absences with = me, I may=20 drop you from the class. You are still expected to turn in your = assignments by=20 email on or before the start of each lecture. Attendance is also used to = weight=20 grades at the end of the semester, meaning, if you ended up with a 79% = in the=20 class, but did every assignment and came to every class, you will most = likely=20 earn a B.

Assignments:

Assignments are generally due at 5pm the day before the next class = after they=20 are assigned. No late work will be accepted for credit.

Please keep a backup of all files that you upload, in the rare case = that they=20 are accidentally deleted. Also keep a copy of all our email = correspondence where=20 grades are noted, just in case there is a question at the end of the = semester=20 when final grades are assigned.

Class Policies:

No guests are allowed in class lectures =E2=80=94 only registered = students please. If=20 you are planning on missing a class (vacation, etc) you need to let me = know in=20 advance so that we can make appropriate arrangements for missed=20 lessons/tutorials.

Feel free to tape record lectures, but your recording device must be = compact=20 and you must come to class early enough to set it up without disturbing = the=20 class--do not bring in your boom box to record lectures and do not = interrupt the=20 class to set up your recorder.

NO active phones, NO text messaging etc. in class.

Please raise your hand to ask questions or speak up if I'm not = looking. Your=20 questions are very important for me to answer and if I don't have an = immediate=20 answer, I'll let you know the following session.

If you miss lectures, you are responsible for getting the tutorial = and=20 knowledge on your own. READ THE BOOK. There is also a TON of CSS-related = info=20 online. Use it to your advantage as a free resource.

It is the student's responsibility to initiate discussion with the = instructor=20 regarding illness, planned absence, or other situations like dropping = the class.=20 It is also your responsibility to bring it to my attention any learning = or=20 English language problems you are aware of which might affect your = performance.=20 It is your responsibility to drop the class if you no longer want to be=20 enrolled.

Please e-mail for questions about class or assignments. Do not wait = until you=20 see me again if it will affect your grade.

Only extreme circumstances warrant a grade of "incomplete."

Student experiences an extreme situation which is unexpected. = (Death in=20 family, serious illness requiring student to miss several classes, = employment=20 loss)=20
Student's grades are passing (C or higher) at the time of extreme=20 situation.=20
Student notifies instructor within 10 days of occurrence mentioned = in item=20 A.

Home computer failure is not an acceptable excuse since the lab at = SCC is=20 available to everyone.

Projects

Two main projects will be assigned to assist you in developing your = skills=20 and to apply the tools of Adobe Dreamweaver CS4. Most of the tutorials = in the=20 first half of the class will build on the previous week towards a = "finished"=20 redesign which will be presented as your midterm. Each topic will be = discussed=20 in lecture in conjunction with the textbook. The second half of the = course will=20 be spent creating a new site from scratch using skills learned in the = first half=20 of the semester along with new ones each week. The finished site will be = presented as your final.

Please keep current with your assignments as they build on the = previous ones.=20 Each week you will be graded 1-10, with letter grades assigned for the = midterm=20 and final. Please place priority on following directions of the = tutorials and=20 learning core skills over trying to dazzle me with effects.

Assignments will be due every week on Monday at 5 p.m., uploaded to = your=20 site, or emailed to me. It will be considered "turned in" once you email = me the=20 URL to the file in question. DO NOT just put it up there and assume I = will go=20 look for it.

Assignemnts and Projects will be graded on the following criteria = (full=20 criteria will be emailed before each major project is due):

Did you follow the directions?=20
Best Practices=E2=80=94 Do you understand how to use the = particular CSS skill=20 correctly? Do you know which tools are most effective in terms of your = idea in=20 that particular use?=20
Computer skills =E2=80=94 Do you understand how to use = Dreamweaver's tools? Do you=20 know which tools are most effective in terms of your idea?=20
Timeliness =E2=80=94 Did you meet your deadline?=20
Standard scale: +90% =3D A, +80% =3D B, etc. Total points earned = determines=20 your grade =E2=80=94 a grade of F will be assigned if less than 60% of = the total=20 points are earned.

Right-click/Control-click each link to download

Week 1 Support Docs & Links

GCOM = 362:=20 Syllabus Fall09 (PDF)=20
Site=20 Review Questionnaire (Text file)=20
Defining=20 a Site, Basic Tab (PDF)=20
Defining=20 a Site, Advanced Tab (PDF)=20
Site=20 Mistakes (LINK)

Week 2 Support Docs & Links

FYI:=20 Home Page Goals (PDF)=20
FYI: W3C = HTML=20 Primer (LINK)=20
= FYI:=20 HTML Resource (PDF)=20
FYI:=20 How to Grok Web Standards (PDF)=20
FYI:=20 Questions To Ask The Client (PDF)=20
FYI:=20 Analyze What The Website Needs (PDF)=20
FYI:=20 Process Similar To Our Assignment (LINK)

Tentative Schedule

Week 1 (Jan. 21, 2009)

Setting Up/Site Mgmt
Assignment: Set Up = FTP
Reading:=20 VQSG: Ch 02, Stylin' Ch 01 MORE=20
Week 2 (Jan. 28, 2009)

Under The Hood
Assignment: Strip/Retag from table to=20 default-styled page
Reading: VQSG: Ch 03, Stylin' Ch 02 MORE=20
Week 3 (Feb. 4, 2009)

CSS Mechanics
Assignment: Style text only (no = positioning)=20
Reading: VQSG: Ch 05, 07, Stylin' Ch 03
Week 4 (Feb. 11, 2009)

Positioning
Assignment: Break page into sections and=20 position.
Reading: VQSG: Ch 06, Stylin' Ch 04, 05
Week 5 (Feb. 18, 2009)

Media Objects
Assignment: Create and add new site=20 furniture.
Reading: VQSG: Ch 09, 16
Week 6 (Feb. 25, 2009)

Media Objects Continued
Assignment: = TBA
Reading:=20 VQSG: Ch 09, 16
Week 7 (March 4, 2009)

Basic Navigation
Assignment: Create and style nav = sidebar or=20 header
Reading: VQSG: Ch 08, Stylin' p205-215
Week 8 (March 11, 2009)

Bugs
Assignment: Midterm: Index page w/nav =
Reading:=20 VQSG: Ch 18, handouts
Week 9 (March 18, 2009)

Midterm due
Week 10 (March 25, 2009)

Site Planning
Assignment: Brief, Mock-Ups =
Reading:=20 VQSG: Handouts
Week 11 (April 1, 2009)

Workflow
Reading: VQSG: Ch 15, 18 p508
Week 12 (April 8, 2009)
SPRING BREAK=20
Week 13 (April 15, 2009)

Forms
Assignment: Create standalone form page=20
Reading: VQSG: Ch 11, Stylin' p189-204
Week 14 (April 22, 2009)

Advanced Navigation
Assignment: Assign Final,=20 Rollovers
Reading: VQSG: Ch 13, Stylin' p217-229=20
Week 15 (April 29, 2009)

Spry
Assignment: Add one spry widget
Reading: = VQSG:=20 Ch 14=20
Week 16 (May 6, 2009)

Other Media & SEO
Assignment: create printable=20 css
Reading: VQSG: handouts
Week 17 (May 13, 2009)

Final presentations & Business

Design Education

Design education is a lifetime activity. Constant change will require = constant renewal. It is not a career for a slow-paced, nostalgic person. = To keep=20 up with this fast-changing field you must approach the basic principles = and=20 practices with a flexible, curious mind.

A common misconception among people new to digital graphics is that = computers=20 make the process so easy and automatic that anyone can become an = designer.=20 Because these digital tools have so many automated features which make = it so=20 that any person with little or no formal training can call themselves a = designer=20 and make money, I will attempt to show you through the course of this = class to=20 become a web designer that knows more than the next guy, and how that = merits=20 being paid! Only through gaining a firm knowledge of the mechanics of=20 presentational code, then using Dreamweaver to display them, will you = begin to=20 be able to navigate the many quirks and challenges the internet = presents.

No software program can make intelligent design decisions, choose = just the=20 right color combinations or generate concepts and ideas. Online, all = your design=20 decisions are at the mercy of screen sizes, computer platforms, etc., = and it=20 takes a LOT of knowledge beyond Dreamweaver to master. Web design is the = domain=20 of the professionally trained and talented technician. A software = program is of=20 no use if you have not developed good coding and design skills.

A New Greener Approach:

The GCOM Department at SCC recently became the first community = college in the=20 U.S. to join the Designers Accord =E2=80=94 an international coalition = of designers,=20 educators, researchers, engineers, business consultants, and = corporations, who=20 are working together to create positive environmental and social impact. = As part=20 of GCOM's effort, we are planning to implement more "sustainable" = practices in=20 the way we teach and run our program. (For more info on the Designers = Accord,=20 visit http://abide= visuals.com/362/www.designersaccord.org)

GCOM 362 : Int. Creative Web Page Design

Spring 2009 | Jan. 17 - May 20 Wednesdays, 5:30-7:10 = p.m.

Course Requirements & Objectives

Required Texts

Required Software

Prerequisite

Goals and Requirements

What you should be able to accomplish at the end of this class:

Attendance:

Assignments:

Class Policies:

Projects

Assignemnts and Projects will be graded on the following criteria = (full=20 criteria will be emailed before each major project is due):

Week 1 Support Docs & Links

Week 2 Support Docs & Links

Tentative Schedule

Week 1 (Jan. 21, 2009)

Setting Up/Site Mgmt

Week 2 (Jan. 28, 2009)

Under The Hood

Week 3 (Feb. 4, 2009)

CSS Mechanics

Week 4 (Feb. 11, 2009)

Positioning

Week 5 (Feb. 18, 2009)

Media Objects

Week 6 (Feb. 25, 2009)

Media Objects Continued

Week 7 (March 4, 2009)

Basic Navigation

Week 8 (March 11, 2009)

Bugs

Week 9 (March 18, 2009)

Midterm due

Week 10 (March 25, 2009)

Site Planning

Week 11 (April 1, 2009)

Workflow

Week 12 (April 8, 2009)

Week 13 (April 15, 2009)

Forms

Week 14 (April 22, 2009)

Advanced Navigation

Week 15 (April 29, 2009)

Spry

Week 16 (May 6, 2009)

Other Media & SEO

Week 17 (May 13, 2009)

Final presentations & Business

Design Education

A New Greener Approach: