Assignment

The assignment is to use Cascading Style Sheets (CSS) to format webpages. The basic idea is to write:

• a CSS document (external sheet), and
• two HTML documents (web pages), that both use the external style sheet for formatting.

In particular, the first web page (schedule.html), should describe your schedule this semester, including a list of the courses you are taking. The second page (course.html) should expand on one of the courses, describing it in more detail.

You will create an external style sheet (style.css) which will define the style for both of the web pages you have designed. This will give you practice applying CSS to format text, which you will do for all your pages the rest of the semester.

Turning it in

You'll turn this assignment in by uploading your web pages and all the supporting material, i.e. images and external style sheet document, to the cs server. As with the first assignment, don't forget to check that your pages work fine, after you upload them to the server! Remember, if your files don't properly appear on the browser's window, you will receive no credit.

Requirements

Create a folder called hw2, in the protected folder, which is a subfolder of your public_html folder, on the CS server. Your .html and .css documents should be uploaded in the hw2 folder. Create a sub-folder, named images, in your hw2 folder. All your image files (e.g. .jpg and .gif) should go in the images folder.

Your two web pages must be called schedule.html and course.html.Your external style sheet will be named style.css. Don't forget that you must name and organize folders and files exactly as listed above for full credit!

You must include comments at the top of each document (HTML and CSS), stating the name of the file, the name of the author and the date it was created (as you did for assignment 1).

In addition, we will be looking for the following specifics in this assignment:

Web Pages

1. A descriptive title for the web pages.
2. A common header on each of your two web pages (you will define the style of that header in your external style sheet). This could be any one of the headers <H1> ... <H6>, but you must use it on both web pages.
3. A hyperlink from the first page to the second. Also a hyperlink from the second page back to the first. These links should use a relative URL.
4. One hyperlink from the second page to a external web site, but related to the course in some way. This must be an absolute URL.
5. Add at least one image, to each of the web pages, using images in the images folder you created.
6. Choose some other tag, such as EM, STRONG, P, BLOCKQUOTE, or even SPAN or DIV. Use the tag at least once on each of the html documents. You will customize that tag in your external style sheet.

External Style Sheet

1. the style of a header tag you have used on your two web pages
2. the background color, and the font family, size, and color for the text in the body of the web pages
3. the style of the tag in item 6 above.

Optional (Extra Credit)

Use a document-level or inline style for some tag on one of your web pages. The tag should not be among those you have used in the external style sheet though, to avoid conflicts.

Coding Style

Please note that your HTML code and CSS code must be neat, clear, and commented. Make sure to view your pages at least in Safari on a Mac, and IE on a Windows machine. Everything should work properly in both combinations above.

Due Date/Time

After you have uploaded and viewed your assignment from the server to verify that you uploaded your files correctly, you are done. The final upload to the server is how you submit your assignment — we view it directly from there, in order to grade it. When you type the URL to access your assignment page, remember that your hw2 folder is uploaded to your protected folder! So to view the schedule.html file for example, type this into your browser's location bar:

http://cs.wellesley.edu/~youracct/protected/hw2/schedule.html

Remember that assignments may not be turned in late. Check the syllabus for the exact date and time that the assignment is due. Also, remember that you should not modify turned in work after the due time has passed, so that when we grade it it's not timestamped late.