AIM

Assignment 2: the CCC

Due: Week 5 (2/28)

This means that the Assignment must be done, and it must be linked from the appropriate Portfolio page.

Objective

You will create an HTML/CSS site that strategically combines text and images in a way that will become curious, challenging, and/or compelling (the CCC) for an audience. Certainly, this could be done with any image-sharing systems available to us now, but by creating your own site you will control the entire page environment—the background, composition, color palette, typographical scheme—which will also enhance the CCC factor.

Structure

Your site will need 3 pages to showcase 3 of your own images (graphic work, photos, scanned drawings, etc). You will use an external CSS stylesheet to control presentation.

Each page must have the following:

1. Small thumbnail images to serve as a complete navigation to all pages of the assignment.

2. A large showcased image.

3. Text to accompany the large image.

Images

All images need to be properly formatted in Photoshop/Illustrator, and not oversized images that are resized with the width/height attributes in HTML. You can consult inobscuro.com/tutorials/read/35 to review the “Save for Web” console in Photoshop.

I suggest creating thumbnails are limited to 75-125 pixels in either direction.

For full-sized images, 500-700 pixels in either direction is pretty good.

Feel free to be inventive in designing your thumbnail images. They do not have to be exact replicas of your larger images. You can crop them or manipulate them in accordance with your design plan.

Any background imagery MUST be your own. You cannot download anyone else's material for this assignment. This includes materials with open licenses.

Writing

Each page must have at least 1 paragraph of text. You are permitted to use text from another source, but you MUST credit the source, and create a link to the source if it is online.

(over)

Consistency vs. contrast

Having a site that is consistent in color scheme, composition, typography, tone, etc. is the norm. Your navigational thumbnails do need to be present on each page. Other than that, you are welcome to change color schemes, typographical styles, compositional layout, mood and tone from page to page.

Consistency is helpful in knitting together separate web-page environments. Contrast can be useful in demonstrating how conflicting feelings or perspectives have their rightful place together in the same situation or experience.

HTML code quality

I'll be checking for this, so consult the guidelines at ecbrown.org/aim/html_quality_checklist.htm.

Handy links

• The <img> tag: w3schools.com/html/html_images.asp

• To float an image to the left or right of your text with CSS: tizag.com/cssT/float.php

• More on floats: css.maxdesign.com.au/floatutorial

Uploading your Assignment and updating your Class Portfolio

Your Assignment 2 will be a separate website from your Class Portfolio site. It should evetually be copied to its own folder inside of your Pub folder, and then you will make the following adjustments to the Assignment 2 page of your portfolio:

1. A brief description of the assignment (1-2 sentences).

2. A functional link to the index page of your assignment. For example:

   <a href=”assign2/index.html”>Go to my Assignment 2</a>

3. A screenshot image (this is optional)

Your Assignment 2 website shouldn't make any mention of the AIM class, or have a link back to your portfolio. Let the assignment be a self-enclosed work of art/design, without any academic clutter.

What I'm looking for when grading this

a. Functional relative links

b. Functional CSS

c. HMTL code quality

d. An interesting combination of images, text and page environment.