Teaching / Courses / Creating Web Documents

Information and Syllabus

Creating Web Documents MAT/NME 2730.46


Instructor: Robert Spahr
Contact: robert.spahr@purchase.edu & rob@robertspahr.com AIM: rospahr
Office Hours: TBD & by appt.

Course Syllabus Location: http://www.robertspahr.com/cwd/
New Media Blog: http://newmedia.purchase.edu/

Required Text:

Castro, Elizabeth. HTML, XHTML, and CSS, Sixth Edition (Visual Quickstart Guide). Peachpit Press

 

Further 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 revolutionizing the way the world communicates. In this course, we will investigate how the Internet works, and the tools and techniques used for creating web documents. Topics include: HTML & XHTML authoring, Cascading Style Sheets, scripting languages, data retrieval, and incorporating sound, video, and images into web pages. We will also explore issues of web design and usability, as well as the legal and ethical responsibilities of being a consumer and producer of web content. There will be regular reading assignments, written responses and group discussions relevant to the class.

Syllabus:

Sep 08
Introductions, The Internet, Basic Markup, HTML

Sep 15
XHTML Basics
Reading: Jeff Tyson: How Internet Infrastructure Works
Thought Questions
Project #1 Due

Sep 22
Tables & CSS Basics
Reading: Vannevar Bush: As We May Think, July 1945
Thought Questions

Sep 29
Graphic Issues & Inline Images
Reading:
Luigi Russolo: The Art of Noises, July 1, 1913. (Listen to Intonarumori)
F.T. Marinetti, et al: The Futurist Cinema, November 15, 1916.
Thought Questions
Proposal for Project #2 Due


Suggested further reading:
Futurism (art)
Intonarumori

Oct 06
Validatiors, Browser Testing, & Open Source/Free Software
Reading:
Richard Stallman: The GNU Manifesto, March 1985
Lawrence Lessig: The Internet Under Siege, November 1, 2001
Thought Questions

Oct 13
Usability, Search Engines, Tables & Multimedia
Reading:
Jakob Nielsen: How Users Read on the Web, October 1997.
Christopher Locke: Cluetrain Manifesto: Chapter 1, 1999, revised 2001
(No thought questions this week)

Oct 20
Midterm Exam
Sample Midterm Exam

Oct 27
Project #2 Due
Student Presentations of Project #2

Nov 03
Advanced Layout Using CSS and Tables
CSS Layout (positioning float left)
CSS Layout (absolute positioning 2 column)
CSS Layout (absolute positioning 2 column float)
CSS Bulleted List Navigation

Nov 10
Javascript
Javascript Examples

Nov 17
Forms, CGI, Client vs. Server

Nov 24
Frames
Reading: Paul Graham: Taste For Makers, February 2002
(No thought questions this week)

Dec 01
Current Trends, Social Media, Web 2.0, Privacy, Public/Private Key Encryption
Reading: Tim O'Reilly: What Is Web 2.0, September 2005.
Thought Questions

RSS 2.0 Specification
Sample RSS Feed (right-click and save as, then open in a text editor)

Dec 08
Project #3 Due

Dec 15
Final Exam
Sample Final Exam

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:   Building a Web Site

You will build a website with a minimum of 5 pages. The layout of the site should be created using tables, formating should utilize CSS. Carefully consider the design and navigation with future site growth in mind. The final site will be uploaded to an online web server, as well as burned to a CD-rom. Include all source materials, notes, sketches and documentation on the CD in a folder labeled "source."

Issues to consider:
Who is the audience? What color palette? Warm colors? Cool colors? What is the visual structure of the page? What is the visual structure of the site? Organic motifs? Geometric motifs? How will the viewer navigate the web site? One homepage to enter the site? Multiple entries? How will the site expand over time?

Choose the type of site you will build from the following:

Photo Album Site
Possibilities include chronological organization, Organized by holiday, Color palette of sepia or black & white.

Travel/Vacation Site
Possibilities include chronological organization, organized by location, favorite hotels and sights.

Book/CD/Music Collection Site
Possibilities include photos of cd/book covers, wish list linking to online stores, reviews of your favorites.

Artist Portfolio Site
Possibilities include visual artist, musician, writer, chronology, subject matter, media.

Instructional Hobby Site
Possibilities include hobby site with how to's, reviews of materials and suppliers, step by step photos.

Company Brochure Site
Possibilities include about us, products/catalogs, contact us

Project 3:   Expanding a Web Site

Building upon the web site you created in the second project, you will now change the overall look and feel by changing the CSS. You will also add at least 5 new pages to the site. You must include either a sound file, a multimedia file, or an animated gif as well as at least one example of javascript and one form.

Some issues to now consider:
Will the structure of your navigation need to be changed?
How does adding new pages affect the navigation?
How does changing the look and feel alter the overall user experience?
Are you able to reuse or alter your templates when you add new pages?

The final site will be uploaded to an online web server, as well as burned to a CD-rom. Include all source materials, notes, sketches and documentation on the CD in a folder labeled "source."

Evaluation:

Your final grade will be determined by the following:

Attendence to all classes is expected. You are allowed up to TWO unexcused absences. Each absence beyond this threshold will result in a letter grade deduction from your final grade.

All assignments and projects are due at the beginning of class. All reading responses should be submitted at the beginning of class, typed, and no longer than one page in length.

Late reading responses will not be accepted. Late projects will result in a letter grade deduction.

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 Glossary


Technical Skills

Setting Type on the Web to a Baseline Grid

The Elements of Typographic Style Applied to the Web

HTML Advanced Tutorial

CSS Basics

Zen Garden - The Beauty of CSS Design

CSS How-to

Web Page Design for Designers: Typography

W3Schools

Image Map for Detailed Information

Hackers and Painters

useit.com: Jakob Nielsen's Website

IE8 Version Targeting causes quite a stir


Controlling the Network & Intellectual Property

Youtube video: Net Neutrality

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

History of the World Wide Web

The End of the Internet?

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

The Origins of Linux [Video]

Stallman: If you want freedom don't follow Linus Torvalds

Free as in Freedom
Richard Stallman's Crusade for Free Software

Open Source Definition


Web 2.0 (Wiki, RSS, AJAX, Social Networking)

Could Twitter become the ultimate buzz tracker?

The Ethics of Web 2.0: YouTube vs. Flickr, Revver, Eyespot, blip.tv, and even Google

What Is Wiki

A personal NON server wiki using XHTML, CSS and Javascript

What is RSS?

The MySpace Generation

AJAX Web Applications
NYtimes - Web Tools Blaze Trail To The Past

Adaptive Path - AJAX

Google Labs Mirror (Demo of AJAX)

Why Ajax Sucks (Most of the Time)

Google Maps (Demo of AJAX)

Video Distribution Platform Aiming to Kill TV


Art & Design Glossary

Art & Design Glossary (HTML)
Art and Design Glossary (PDF)