CS 101 Assignment 3 Fall 2013

CS 101 Web Construction, Fall 2013, Instructor: Jeffrey Horn ASSIGNMENTS

Assignment 3 "Images and Style Sheet Mechanics"

Handed out: Monday, September 23, 2013
Due: Friday, October 4, 2013 by email (see below, last task, number 10)
Readings from Felke-Morris text: (in addition to Ch.s 1 and 2 of course!) Ch. 3 sections 3.1-3.5, Ch. 4 sections 4.1-4.3.
Goals: Create a static web page with images in various roles. Learn CSS basics by using in-line styles and embedded style sheets.

Details:

Choose your own topic for a web site. Create a web page (.html file) with the following properties.

TASK NUMBER	TASK DESCRIPTION	POINTS
1	Local image (this means the src is the current folder; in other words, the same folder that your html file is in). Example: Note that you MUST put in alternative text (in the "alt" attribute). This text must be a descriptive summary that substitutes for the visual image. But it can be very brief.	5
2	Remote image (src is a URL for a web site, e.g., "http://cs.nmu.edu/~jeffhorn/nmu.gif"). Example: Happy Fat Tuesday! Note that you MUST put in alternative text (in the "alt" attribute). This alt text should acknowledge the entity (e.g., company, government organization) who owns the copyright.	5
3	An animated gif. (local or remote) Example: Note that you MUST put in alternative text (in the "alt" attribute). This alt text should give acknowledge the entity (e.g., company, government organization) who owns the copyright, or, if you have permission to use the image, then just put in something descriptive. Here is a link to some free animated gifs.	4
4	An image that is a link to a remote site.	5
5	An “thumbnail” (size) image that is a link to a larger version of the image in the web page.	5
6	Document types: insert the following doctype definition at the top of your .html file: <!DOCTYPE html>	2
7	CSS: INLINE (using the "style" attribute) Use the "style" attribute with CSS to color some text on your page. Use the "<span>" or "<div>" elements to select the text to color. Use all three different ways of specifying color: color name (e.g., "blue") hexadecimal color value (e.g., "#0000FF") decimal color value (e.g., " rgb(0,0,255)" )	8
8	CSS: EMBEDDED (using the "<style>" element) Use the "<style>" element with CSS to color some text on your page. Basically do the exact same thing as you did in task 7 above. Apply it to different text on your page!	8
9	Good style (indentation and some "main" comments at the top, including name, etc.) in your source file.	4
10	Send me your assignment in a compressed folder, with all files in the folder. Send it to "jhorn@nmu.edu" USE THE FOLLOWING SUBJECT LINE: "CS 101: A3"	4
TOTAL: