HTML and CSS To Fruition

To complete this assignment, create a Web page that accomplishes the following:

• Utilizes html, title, head, body, a, ul/ol, li, img, p, em, table, and an assortment of other HTML elements.
• Links to multiple CSS files that cascade to mark up the HTML so that the content is aesthetically appealing and laid out in an intelligent manner.
• Utilizes inline CSS to selectively override styles certain styles in the linked CSS files.
• Carefully maintains a strict division of CSS for presentation and HTML for content.
• Uses copious comments in the CSS and HTML to indicate what is going on in each.
• Validates on the W3C HTML validator found here: http://validator.w3.org.
• Validates on the W3C CSS validator found here: http://jigsaw.w3.org/css-validator/.

Once complete and valid, please send a link to your assignment to mlissner@ischool.berkeley.edu.

For extra credit, complete the above, then investigate one of the following CSS frameworks:

• Blueprint CSS
• YAML
• 960 Grid System

Use that to create a second version of the above site that has sophisticated formatting such as alignment to a grid or multicolumn layout. Send two links to mlissner@ischool.berkeley.edu: One for the standard assignment, and one for the extra credit version.

• Firebug is indispensable for Web programming. You will want to familiarize yourself with it as soon as possible if you have not already (http://getfirebug.com). Check out Firebug Lite as well for use with other browsers (http://getfirebug.com/lite.html). Another useful add-on is the Web Developer Toolbar (https://addons.mozilla.org/en-US/firefox/addon/60).
• You may find the HTML and CSS examples at w3schools.com to be useful: http://www.w3schools.com/html/html_examples.asp.
• You will need to find a Web space to host your assignment. You are welcome to host your assignments on your own server, or, if you prefer, you may use the iSchool server. There are instructions here (login required): https://www.ischool.berkeley.edu/intranet/computing/how-to/sftp. SSH is also an easy way to transfer files to the server, if you are familiar with that tool.
• The CSS Zen Garden is an interesting place to learn about the power of CSS: http://csszengarden.com.