Assignment # 2b

This assignment is the second step in your project, the Oracle Java Certification Form student project. This assignment will create an XHTML Strict version of the HTML page, using a CSS style sheet. You should download the entire Web page to your computer so that you do not need to repeat the process as you develop the revised site. Also, there are no guarantees that the site will be on-line towards the end of the semester.

Reference Material

You may find the following CSS reference material helpful in completing this assignment:

• CSS Tutorial
• WDG CSS Reference
• W3C CSS Reference
• W3C Learning CSS Page
• CSS Property table
• Translations from HTML to CSS
• Tidy Gui
• W3C HTML Validator
• WDG Validator
• W3C CSS Validator
• XHTML Specification

Learning Goals

• Develop hands-on experience with CSS.
• Understand how to produce valid HTML Strict.
• Develop the submit page for Project#1.

Project

The result of Assignment 2 is a valid HTML page that will be used as the form submit page for your project. You can complete this assignment in one of two ways, either by creating the page from scratch (reverse engineering it) or by starting with the Oracle page and then modifying it until it is valid. The second approach is probably the best, but if you are highly skilled at creating Web pages, you might find the first approach easier.

If you take the second approach, the assignment consists of 2 parts (a and b). In part a, you will correct the HTML page so that it is valid according to XHTML Transitional. In part b, you will add an additional CSS style sheet so that the page is valid according to XHTML Strict.

If you already know something about CSS and XML, you will likely find that doing Assignment 2 in one part makes it easier by immediately constructing the XHTML Strict version. If you do these together, be sure to let me know when you submit assignment 2b so that you receive credit for all 2 assignments.

Part b - XHTML Strict validation

Further modify the HTML of the Web page (Assignment 2a) so that

• It is in compliance with XHTML Strict
• It uses an external style sheet for all styling information
• No styling information is provided in tags that use style attributes

Submit the assignment by sending your assigned TA a zip file including the completed HTML page and the style sheet (.css file). Be sure to include the URL of the original page in your e-mail.

Hints:

• Be sure to change the DOCTYPE tag to identify the html page as being consistent with XHTML Strict.
• Use the Tidy program or another program (e.g., Dreamweaver) to make a first conversion to CSS (available in Tidy GUI).
• Use the reference material in the HTML Validator to check the correct HTML syntax. You may find that the WDG validator is more helpful because of the links in the error messages to HTML tutorial information.
• If your HTML has errors, you may find that different validators show different error messages. This is to be expected, but if your HTML is correct, all validators should show that there are no errors.
• For help in converting specific HTML tags to the proper CSS syntax, consult a very helpful Web page prepared by the CSS Pointers Group.
• If you used an automatic converter, they sometimes replace tag-based html styling with a style attribute in the same tag. Since this does not use all the power of css, you should replace these style attributes with references (i.e., class attributes in the tag) to your style sheet.
• First include the style information in a style tag within the document.
• After the style tag is working, move the style sheet to a separate file, replacing it with a style reference (using a LINK tag).
• The Tidy program will create a number of HTML classes (c1, c2, etc.). Modify these so that you have a minimum number of HTML classes. Note that this is the most difficult part of the assignment. To do this correctly, you need to understand the styling intent of the page designer, and abstract that intent to the proper number of classes.
• You will see that there are already style sheets referenced in the Oracle document. You can have multiple style sheets in a document, with the later ones overriding the earlier ones. So, one option is to use the existing style sheet, but make sure that your style sheet occurs after the Sun CSS links in the document. This way you can override easily. Another approach is to start with the Oracle style sheet, and then improve it. Both approaches are fine, but the second is more difficult.