Art 49540 3AD Design for the Web 2
This course emphasizes Web 2.0 design guidelines and the use of semantic structure and hand coding to create standards-compliant pages using advanced CSS for position and formatting. Prereq.: Art 39540; 3 hrs./3 cr.
The syllabus and weekly handouts will be posted on the web site as PDF
files: at: http://www.annetteweintraub.com/courses/49540/49540.html
Links and e-handouts are posted on LabShare in the folder ‘to_students’ organized by week
If you are absent, you must email someone on the contact list to get the assignment or check the website.
Course Content
This course is an exploration of advanced CSS-based web design. Other topics may include alternate style sheets for print, formatting for handhelds and style sheet switching.
Syllabus may be revised during the semester depending on the needs of the course.
Projects
The ZenCSS/Transcending CSS approach applies a variety of different stylesheets to a structured text.
It emphasizes separating document structure from design. A core text, that has content hierarchies defined, is used as a base. Style sheets with different design looks are applied, resulting in pages with a very different appearance, but the same underlying structure.
We will deconstruct style sheet examples of existing sites, analyze design and css structure, write new styles and develop pages based on exploration of various style sheet techniques. We will develop alternate style sheets, using fluid/fixed/floating layouts and experiment with type handling, scaling and layout. We will also look at troubleshooting style sheets across different browsers.
Projects are organized in two or three-week units with CSS and themed topics. We use the ZenCSS core text for weeks 2-8. We will also apply these principles to new content repurposed from a print page and create a portfolio page showcasing the class projects and students’ Web 1 work.
We will also apply these principles to new content repurposed from a print page and create a portfolio page showcasing the class projects and students’ Web 1 work.
This course places equal emphasis on coding AND design. Students must use ORIGINAL art [photography and illustration] and pay close attention to the concept & execution of page designs.
Course Objectives
• To become familiar with the design history as it relates to web design.
• To develop vocabulary for web design critique and use this terminology in oral and written briefs.
• To develop superior skills in design, imaging and typography and apply these skills to creative projects in web design.
• To analyze problems, develop alternate conceptual approaches, employ project planning, workflow and production skills to web design projects.
• To become fluent in the range of digital tools, used by artists in a web design context.
• To prepare a web design portfolio which could be used to gain an internship, employment or admission to graduate school.
Course Portfolio
All work for this class is web-based. The final portfolio is a gallery site that will be uploaded and presented live online.
All work is presented online. Be sure to copy your work to the server before class. We will look at it from the server.
Gallery Portfolio sites will be kept online for 4 semesters
• content is restricted to course portfolio work ONLY
• any work in violation of copyright will be removed
Be sure to BACKUP your work onto extra disk(s). YOU are responsible for keeping copies of your work!
Missing work, or failure to be at the Midterm or Final will receive an F.
Required Texts
CSS the Missing Manual, 2nd Edition, David McFarland, Pogue Press, 2009.
Purchase textbooks and bring to class by week 2
Recommended Texts
Transcending CSS, Andy Clarke, New Riders, 2006.
Handcrafted CSS, More Bulletproof Web Design, Dan Cederholm, New Riders, 2009.
Adobe PhotoshopCS4: Up to Speed, Ben Willmore, Peachpit Press, 2009.
Materials
USB drive (or other removable storage media), 1GB preferred
BACKUP MEDIA: 2nd USB or CDs
Lab fee includes USB drives [given out around mid-semester] and blank DVDs ; students also receive 2 years of web site hosting as part of the lab fee.
Class Resources, links
General Requirements
2 unexcused absences only before a grade reduction
three latenesses=1 absence
Purchase textbooks and bring to class by week 2
Incompletes
Incompletes are only granted for medical or legal reasons and must be requested before the final review date Incompletes can only be changed by the Academic Standards Committee.
Grading
Grades are given based on:
• visual design, 30%
• correct use of HTML, CSS, 30%
• completion of weekly assignments 30%
• professionalism, 10%
[participation in class, meeting deadlines and attendance/lateness]
A grade of "C" is average.
Students begin with an assumed grade of "C" and move up or down, depending on the quality of work, presentation in class critiques, attendance and attention to deadlines.
Art Majors [declaring SP09 and later] and BFA students must maintain a GPA of 2.5.
Missing the midterm or final reviews will result in a failing grade.
Lab Reminders
No food/drink in the Lab
At the end of your work session, clean up the area around your computer
We will suspend your Lab account if you break these rules!
Report Lab problems in WRITING, using a copy of the problem report form posted next to Skiter's office, or email him (skiter@ccny.cuny.edu)
DO NOT try to clean the computer monitors; Windex cleaners will spoil the anti-glare coating on the screen.
Syllabus and Weekly Assignments
Syllabus [PDF]
Weekly topics + download links page
DOWNLOADS
Web Developer addon for Firefox: http://addons.mozilla.org
Firebug addon for Firefox: http://addons.mozilla.org
TextWrangler: http://www.barebones.com/products/textwrangler/
CSSzengarden text: http://www.csszengarden.com/zengarden-sample.html
GRID: http://sprymedia.co.uk/article/Grid
Pick/analyze colors & palettes without Photoshop: http://www.colorzilla.com/firefox/
Resources from WEB 1 [.sitx] [.zip] 2.7MB
cheat sheets and handouts: copyright, html cheat sheets, flowchart, wire frame, browser grid, doc type, web page divisions, layout grid, color hex chart, assortments, browser sizes
Weekly Assignments:
Week 1: February 3 [PDF] page of links: classlinks_week1.html
Week 2: February 10 NO CLASS /SNOW DAY
Week 2: February 17 page of links: classlinks_week2.html
Week 3: February 24 [PDF] page of links: classlinks_week3.html
Week 4: March 3 [PDF] page of links: classlinks_week4.html
Week 5: March 10 [PDF] page of links: classlinks_week5.html
Week 6: March 17 [PDF] page of links: classlinks_week6.html
Week 7: March 24 [PDF] page of links: classlinks_week7.html and navigation_examples.html
SPRING BREAK: NO CLASS on MARCH 31
Week 8: April 7 [PDF] MIDTERM classlinks_week8.html
Week 9: April 14 [PDF] page of links: classlinks_week9.html
Week 10: April 21 [PDF] page of links: classlinks_week10.html
Week 11: April 28 [PDF] page of links: classlinks_week11.html
Week 12: May 5 [PDF] page of links: classlinks_week12.html
Week 13: May 12 [PDF] page of links: classlinks_week13.html
Week 14: May 18 [PDF] page of links: classlinks_week14.html
Final Review date: TBA
General course information and links
Get Adobe Acrobat Reader