Web Portfolios
Days: M W
Time: 1:00pm-2:50pm
Building: MCMA
Classroom: 0009E
Instructor: Robert Spahr
Contact: rspahr@siu.edu AIM:
rospahr
Office: MCMA 1121E
Office Hours: Tue 1-3pm, Wed 9-11am, Thurs 1-3pm
Course Syllabus Location: http://www.robertspahr.com/webp/
Course Listings:
Adv Tpcs Interdisciplinary Std: Web Portfolios - CP 470D 002 CRN: 26888
Media Arts Studio Seminar: Web Portfolios - MCMA 543 005 CRN: 27241
Suggested Text:
Castro, Elizabeth. HTML, XHTML, and CSS, Sixth Edition (Visual Quickstart Guide). Peachpit PressFurther Reading:
Chapman, Nigel & Jenny. Web Design, A Complete Introduction. Wiley
Wardrip-Fruin, Noah & Montfort, Nick. The New Media Reader. Cambridge, MA: MIT Press
Packer, Randall & Jordan, Ken. Multimedia From Wagner to Virtual Reality. New Yok, NY, W. W. Norton & Company
Manovich, Lev. The Language of New Media. Cambridge, MA: MIT Press
Description:
The Web is part of a larger environment that constantly evolves in relation to social and technological developments. This course investigates the design of online experiences through lectures, discussions, workshops, and projects. Students explore relationships among design, technology, and user experience in the context of contemporary Internet cultures and develop skills in designing information architectures, interface behaviors, navigation systems, and typographic and image strategies with particular emphasis on creating web portfolios.
Syllabus:
Jan 20
Introductions, The Internet, Basic Markup
Speed-Viewers Guide to Digital Media
Lecture Notes - Internet, HTML
Jan 25
XHTML Basics, Tables & CSS Basics
Project #1 is due.
Lecture Notes - Lists, Tables
Lecture Notes - CSS - Style
Reading:
Mark Tribe: Introduction to New Media Art
Jan 27
Completed Project #1
Questions for Website Critiques
Lab
Feb 01
Images, Typography, Wire Frames & Multimedia
Lecture Notes - Images - Typography - Multimedia
Reading:
Joe Gillespie: Typography, Feb 1, 2000
Russolo: The Art of Noises, July 1, 1913.
Mashups:
Kutiman-Thru-you - 01 - Mother of All Funk Chords
Kutiman-Thru-you - 03 - I'm New
Alohomora
Scrumdiddlyumptious
Feb 03
Requesting SIUC website space
Open Studio/Individual Meetings to discuss Project #2
Feb 08
Advanced Layout Using CSS
Lecture Notes - CSS Layout
CSS Examples:
CSS Layout - Position Absolute
CSS Layout - Position Relative
CSS Bulleted List Navigation
Feb 10
Open Studio
Feb 15
Open Studio
Feb 17
Open Studio
Feb 22
Open Studio
Feb 24
Open Studio
Mar 01
Project #2 is due. Critique
Sketchbooks due.
Mar 03
Project #2 Critique continued.
#############################################################
Spring Vacation Saturday, March 6, 12:00 Noon through Sunday, March 14
#############################################################
Mar 15
Javascript
Lecture Notes - Javascript
Code Examples:
Javascript
CSS rollover image
Favicon Information:
http://en.wikipedia.org/wiki/Favicon
Mar 17
Lab
Mar 22
Open Source
Reading:
Richard Stallman: The GNU Manifesto, March 1985
Lawrence Lessig: The Internet Under Siege, November 1, 2001
Wired Magazine: In the Next Industrial Revolution, Atoms Are the New Bits, January 25, 2010
To be viewed in class:
Go Open - Richard Stallman Part 1 Full Interview 10:00:00
RiP! A Remix Manifesto 1:26:23
Mar 24
Lecture Notes - Validators, Browser Testing, Free Software
Open Studio/Individual Meetings to discuss Project #3
Mar 29
Usability, Search Engines, Site Management
Lecture Notes - Usability, Search Engines, Site Management
Reading:
Shirky: Newspapers and Thinking the Unthinkable, March 2009
Jakob Nielsen: How Users Read on the Web, October 1997.
Mar 31
Social Media, Web 2.0, Creative Commons
Lecture Notes - Recent Trends
Reading:
Tim O'Reilly: What Is Web 2.0, September 2005.
Apr 05
Frames, Forms, CGI, Client vs. Server
Lecture notes - Frames
Lecture notes - Forms
Sample form
Apr 07
Open Studio
Apr 12
Wordpress, Installation and Templates
Demo: Installation, Customizing Wordpress Templates & Stylesheets
Web Resource:
Wordpress Lessons
Apr 14
Open Studio
Apr 19
Class is cancelled.
7th Annual Research Town Meeting and Fair
Apr 21
Introduction to jQuery
jQuery Javascript Library
16 Examples of jQuery Image Galleries
Sample Gallery 01 (simple)
Sample Gallery 02 (more features)
Sample Gallery 03
Apr 26
Open Studio
Apr 28
Open Studio
May 03
Open Studio
May 05
Project #3 is due. Critique
Sketchbooks due.
May 13, Thursday 12:50-2:50pm
Project #3 Critique continued.
Project 1: Compare and Contrast
View Template #1
Select two web sites, one that you think is successful, and a second one that you think is unsuccessful. Using the supplied template, create a fully resolved link to an image from each of the two sites, fill in the site name and link that name to the fully resolved URL of the site. In the comments area, compare and contrast the two sites explaining the strengths and weaknesses of each. Address all of the following issues: Consider the audience of each site, navigation, information clarity, the visual dynamics that structure the page and the site, as well as color choices. Why is one site more successful than the other? If you were enlisted to redesign these sites, what suggestions would you offer to improve them?
Name your template using the following convention:
lastname_project1.html (ex: spahr_project1.html)
Attach your html file to an email and send it to me by the beginning of next class.
Project 2: Gallery Portfolio
Explore the artbase at http://www.rhizome.org/. Select at least 5 works organized with a specific theme. Create an online presentation to present to the class. This presentation will be uploaded to the class website. You should also hand in a CD-ROM of your project. You will be graded on the concepts as well as the design of this online presentation.
Potential Themes to Explore
hypertext / mark up languages
software / programming
open-source & free culture
databases
non-linear media
surveillance
social networks / social software
ownership
installation
tactical media
video games
search engines
artificial intelligence
Project 3: Personal Portfolio
Design and develop the look and feel of your personal portfolio site. Consider the audience and the purpose of the site. Develop a navigation convention and interface that successfully presents your work.Details regarding this project will be discussed.
Evaluation:
Your final grade will be determined by the following:
- 5% Sketchbook
- 15% Participation
- 5% Project #1
- 35% Project #2
- 40% Project #3
Sketchbook
I suggest a Black, bound 8.5"x11", to travel with you throughout the semester for quick sketches, small color studies, ideas and assignments. This book can also be used for class notes when important technical information and demonstrations are given. Your sketchbook should also include a CD-ROM containing any digital sketches and studies you may have created.
Attendence to all classes is expected. There are no acceptable number of absences. Three unexcused absences will result in failure for the class. Two lates are the equivalent of one absence. Leaving a class early is considered equivalent to arriving late.
All assignments and projects are due at the beginning of class.
Web Resources:
Technical Skills
Controlling the Network &Intellectual Property
Open Source/Free Software Movement
Web 2.0 (Wiki, RSS, AJAX, Social Networking)
Art and Design
Technical Skills
Setting Type on the Web to a Baseline Grid
The Elements of Typographic Style Applied to the Web
Zen Garden - The Beauty of CSS Design
Web Page Design for Designers: Typography
Image Map for Detailed Information
useit.com: Jakob Nielsen's Website
IE8 Version Targeting causes quite a stir
Controlling the Network & Intellectual Property
Wired.com: Military and Social Networking
Kelly: The Technium - Better Than Free
All your Internets are belong to ATT & the NSA
Schoolkid chipping trial 'a success'
Comcast Actively Hinders Subscribers' File-Sharing Traffic, AP Testing Shows
Law Firm Uses Copyright Claim To Say You Can't View Its Website's HTML Source
Free speech could lead to online disconnect
MySpace Censors Anti-War Websites
US cities' Wi-Fi dreams fading fast
Web search for bomb recipes should be blocked: EU
Free Culture: Lawrence Lessig Keynote from OSCON 2002 - 08/15/2002
The future of HTML, Part 1: WHATWG
EU says internet could fall apart
Summary Of The World: Googlezon And The Newsmasters EPIC
Open Source/Free Software Movement
Stallman: If you want freedom don't follow Linus Torvalds
Free as in Freedom
Richard Stallman's Crusade for Free Software
Web 2.0 (Wiki, RSS, AJAX, Social Networking)
Facebook's Eroding Privacy Policy: A Timeline
The Machine is Us/ing Us (Final Version)
Could Twitter become the ultimate buzz tracker?
The Ethics of Web 2.0: YouTube vs. Flickr, Revver, Eyespot, blip.tv, and even Google
A personal NON server wiki using XHTML, CSS and Javascript
AJAX Web Applications
NYtimes - Web Tools Blaze Trail To The Past
Google Labs Mirror (Demo of AJAX)
Why Ajax Sucks (Most of the Time)
Video Distribution Platform Aiming to Kill TV
Art & Design
The Laws of Simplicity - John MaedaPaul Graham Essays
Ellen Lupton: Thinking with Type
Building Emergency Response Protocols
University's Emergency Procedure Clause:
Southern Illinois University Carbondale is committed to providing a safe and healthy environment for study and work. Because some health and safety circumstances are beyond our control, we ask that you become familiar with the SIUC Emergency Response Plan and Building Emergency Response Team (BERT) program. Emergency response information is available on posters in buildings on campus, available on BERT's website at www.bert.siu.edu, Department of Public Safety's website www.dps.siu.edu (disaster drop down) and in the Emergency Response Guideline pamphlet. Know how to respond to each type of emergency.
Instructors will provide guidance and direction to students in the classroom in the event of an emergency affecting your location. It is important that you follow these instructions and stay with your instructor during an evacuation or sheltering emergency. The Building Emergency Response Team will provide assistance to your instructor in evacuating the building or sheltering within the facility.
Disabled Students:
Instructors and students in the class will work together as a team to assist disabled students out of the building safely. Disabled students will stay with the instructor and communicate with the instructor what is the safest way to assist them.
Tornado:
During the spring semester we have a Storm Drill.
Pick up your belongings and your instructor will lead you to a safe area of the basement. No one will be allowed to stay upstairs. Stay away from windows. The drill should not last more than 10 minutes. You must stay with your instructor so he/she can take roll calls. Students need to be quiet in the basement as the BERT members are listening to emergency instructions on handheld radios and cannot hear well in the basement.
Fire:
During the fall semester we have a Fire Drill.
Pick up your belongings and your instructor will lead you to either the North or South parking lot depending on what part of the building your class is in. You must stay with your instructor so he/she can take roll calls. As soon as the building is all clear, you will be allowed to return to class.
These drills are to train instructors and the Building Emergency Response Team to get everyone to a safe place during an emergency.
Bomb Threat:
If someone calls in a bomb threat, class will be suspended and students will be asked to pick up their belongings, evacuate the building and leave the premises. Do not leave anything that is yours behind. We will not allow anyone back into the building until the police and bomb squad give us an all clear. DO NOT USE YOUR CELL PHONES. Some bombs are triggered by a cell phone signal.
Shooter in the Building:
When it is safe to leave, move to a safe area far from the building where the shooter is located. If you have any information about the shooter, please contact the police after you return home. If you cannot leave, go into a room, lock the door, turn out the lights, and if possible, cover the glass on the door. Silence all cell phones after you call the police and inform them of your location. Be quiet and wait for the police to arrive. The police are looking for one or more shooters, and they have no way of knowing if the shooter is in the room with you. For that reason, when the police enter the room, no one should have anything in his/her hands and each person MUST raise his/her hands above his/her head.
Earthquake:
In the event of an earthquake you are advised to take cover quickly under heavy furniture or near an interior wall, a corner, to avoid falling debris. Outside the building are trees and power lines and debris from the building itself that you will need to stay away from. In the building, large open areas like auditoriums are the most dangerous. Do not try to escape on a stairway or elevator. Do not hide under a stairway. We do not recommend that you stand in a doorway because the door could shut from the vibrations and crush your fingers trapping you there.
Women's Self-Defense Class:
For interested female students and female faculty and staff, the SIU Public Safety Department sets up free self-defense classes. The SIU Public Safety Department will be teaching this class. They teach a free class in the fall and spring at the Rec Center. In the fall you would register at the Rec Center for the Women's Self-Defense Class or RAD (Rape Aggression Defense) as it is sometimes called. If you have questions about registering for the class, you can send an email to lavong@siu.edu. LaVon is the contact in the Dean's Office in the Communications building that will assist you to try to find the class you need.
