World Wide Web 1 @ CCNY

Course Description

This course is designed to give students the ability to create well-coded, well-designed web pages. As designers, programmers, and artists we have the ability to alter the world in meaningful ways. With this ability comes the responsibility to create work that is intelligent, accessible, and hopefully, beautiful. In order to meet this task you will learn how to work with some of the foundational technologies of the web while considering deeper theoretical issues that surround those technologies.

Course Outcomes

By the end of the course students will be able:

Student Responsibilities

Method of Evaluation

The grade you receive will be based on class participation, attendance,exercises, a midterm, and a final project. Attendance is required for every class and 3 absences = a failing grade. If you must miss a class then please speak to me prior to being absent. Late work will not be accepted without penalty. 1 week late = a subtraction of 2 letter grades. More than a week = a failing grade.

Class Etiquette

When I am presenting the class lecture I ask that students refrain from texting, checking their email, etc. I will not do those things when you are speaking and I ask for the same courtesy. This same respect should be extended to your fellow classmates. If someone is being disrespectful during critique they will receive a 0 for the day.

Plagiarism will not be tolerated and will result in a faliure in the course. Please see CUNY's policy on academic integrity.

Description of Exercises

Exercise 1:

For the first exercise you should:

To capture a screeshot:
On a PC press Alt + Print Screen together. This will copy an image of the active window to your clipboard. Paste the image from the clipboard onto a new file in a graphics application such as Paint or Photoshop. On a Mac press Shift Command 4, then space to turn the cursor into a camera. Next click on the browser window. This will save an image of the window to the Desktop.

Exercise 2:

For this exercise you will translate a real space into a website. Find a location that is not your house, your apartment, or City College. Make a drawing that maps how the different areas of that space connect to one another. Describe something about the various areas. Make your descriptions interesting, but also short and to the point.

Now, recreate that space in HTML. Each area of the actual location should have its own page and those pages should be able to connect, via a hyperlink, to other pages. The way that the pages connect to one another should be constrained by the same limitations that you would experience in the "real" space. Only those spaces that actually connect to one another in real life can connect to each other in the HTML version.

Exercise 3:

For your third exercise, tighten up Exercise 2 so that it validates as XHTML Strict or XHTML Transitional.

Midterm:

Choose at least two paragraphs from any text. The text can be a book, an advertisement, a screenplay, etc. Take that same piece of text and present it four different ways using CSS. Use changes in fonts, font-sizes, color, background-image, textures, line-spacing, etc. Experiment with juxtapositions that are contradictory between the form and the content, for example a sleek design with awkward writing. Try creating a design that expresses the content as accurately as you can. You should have this started by next class and you should bring what you have to that class.

Exercise 4:

Create a portrait of a person, place or thing. Do not use images of the actual subject. This midterm is a conceptual problem as much as it is a design problem. How can you communicate something about your chosen subject though things other than its image?

Final:

Open project.

Schedule of Classes

Class In Class Work Due
Class 1 8/30 Internet History & Intro to HTML. Resources. NA
Class 2 9/6 Linking, more tags, proper nesting, inline & block elements. HFHTML chapters 1-3. First Exercise due.
Class 3 9/13 Linking, more tags, proper nesting, inline & block elements continued. Setting up your environment. Have Exercise 2 started and bring it to class so that you can work on it.
Class 4 9/20 Directory structure, FTP, and image formats. Information Architecture intro. View second exercise. HFHTML chapters 4-5. Second exercise due.
Class 5 9/27 Using the w3 validator. HFHTML chapters 6-7. Third exercise due.
Class 6 10/4 Intro to CSS. In class development. Nothing due.
Class 7 10/11 CSS continued, color and typography on the web.
View examples of artists working with text e.g., Concrete Poetry, Conceptual Art, Net.Art, Collage.		 HFHTML chapters 8-10
Class 8 10/18 In class development of Midterm. Work on Midterm.
Class 9 10/25 Midterm Critique Midterm due.
Class 10 11/1 In class development of Exercise 4. Work on Exercise 4. HFHTML chapters 11-12.
Class 11 11/8 Examine Exercise 4. Exercise 4 is due.
Class 12 11/15 Excerpt from The Design of Everyday Things by Donald Norman. Final proposal due.
Class 13 11/29 Gestalt theory & Interface Design. To be determined.
Class 14 12/6 In class development of final project. Work on final!
Class 15 12/20 Final Critique Final