Due Date: Wednesday February 7, 2007 by 10:00 PM (week 5)

As mentioned in Homework_3C, you will be using your Home page to experiment with various styling concepts and techniques that we cover each week. This week you will re-style your original Home page using various font and text settings.

Submission instructions are at the end of this document.

This homework assignment assumes that you followed the initial instructions for Homework 1 and then separated the markup from the external style sheet in Homework 3C. You should now have a home.html document and a separate homeOriginal.css file in the root of your class directory. These documents should be valid XHTML and CSS code and look similar to the illustration in the original instructions.

We will continue to add to, edit and change the Home page styling throughout the term.

Getting Set Up

• Create a backup of your existing home.html file so you have something to revert to if necessary.
• Create a copy of your homeOriginal.css file and name it home_4.css.
  
  Save this document at the same directory level as home.html. (The directory location can make a difference when using the Web Developer toolbar.)
• Alter the CSS link in the head of home.html so that it now attaches to home_4.css.
  
  We will keep homeOriginal.css as our 'master' css file and will be making copies of it many more times throughout the term so that we can experiment with a new set of CSS techniques each week.

Week 4 Experimentation

The Home Page Project takes a different approach to learning CSS. You have a good deal of stylistic freedom when interpreting the instructions. The more you explore and experiment, the more you will learn.

Of course if something doesn't make sense or you get stuck, post your questions in the forum.

• Do not alter the HTML Home page file except to add new link(s) for homework assignments or to change the filename of the linked style sheet. All code for the Week 4 Home page assignment will be contained in a file named home_4.css.
• As you work through this assignment, create a CSS comment at the top of the style sheet: /* */ Write down what you did to satisfy each of the directives below. Any homework submitted without this documentation will garner heavy penalty!
• Find ways to apply the following CSS directives to your Home page. Be as creative as you like!

1. Set the body tag with a readable font family and percentage size.
2. Create CSS rules that set color and font sizes - using ems - for the following elements:
   
   
   • H1 through H6 (based on the H tags actually used in the HTML markup)
   • OL
   • P
   • A links in the header and footer; purposely use inherited values to determine the size of these links
   • A links in the document content area (make these different in some way from the links in the header/footer
3. Use a font variant in an appropriate and tasteful way.
4. Use letter spacing in an appropriate and tasteful way.

Submitting this Assignment

• Remember to write comments at the top of the CSS file outlining what you did!
• Upload (and test) your home.html and home_4.css files (and any required images) to your web space on the CTIS web server.