XHTML - CCIS1301

Homework 2

This homework is due Due on: 02/10/2012 at 11:59:59pm. Submissions after the due date will recieve 0 points.

Step 1 - Create a web template

From your homework 1 assignment, start with a valid XHTML document. If you didn't have one, you may start with this one:

Valid XHTML document

Create a new file called "template.html". You will use this file as a base point for all future homework and project pages. With this document, create a div for each of the following:

• An overall container div. This will contain all the other divs in your document. This should have an id attribute with the value of "container".
• A header div. This will contain the header of your document (corporate logo, etc). This should have an id attribute with the value of "header".
• A navigation div. This will contain all your site navigation. This should have an id attribute with the value of "nav".
• A footer div. This will contain footer information. This should have an id attribute with the value of "footer".
• A Content div which will contain all your page content. This should have an id attribute with the value of "content".

Step 2 - In your header, add an image.

Go out to google and find an image to use in your header. This should be a "business" logo. If you want, you can also create one using paint (Start->Programs->Accessories->Paint). Your Image should not be any larger than 468 x 90 pixels.

Step 3 - Create a navigation menu

Using proper ul / li element nesting, add a navigation menu to your navigation div. This should contain links to the following:

• Home
• Page 1
• Page 2
• Contact
• About Us

Step 4 - Create your footer

In your footer div, add three links for the following:

• Privacy Policy
• Terms of Service
• Contact

Also add text for a phone number.

Step 5 - Lorum Ipsum

Go to lipsum.org and copy 5 paragraphs of text into your main content div. Make sure to use the appropriate tags.

Step 6 - Creating a Contact Page

Using the template you just created, create a new file called "contact.html". This will be your contact page. This contact page should include the following:

• An image of the company. (Search google for an image of a building). The image should be no larger than 250 x 250 px.
• Driving Directions to your address. (Make something up). Use proper ol / li tags to give step by step instructions.
• Your company address (must include street address, city, state and zip code along with phone number)
• An email link to your company email address.

Requirements

You will be graded on the following:

• Valid XHTML1.1 markup: 10 points
• Use of the following tags: 15 points
  • div tags
  • hx and br tags
  • address tags
  • list tags
  • anchor tags
• Proper meta and title tags. (description, keywords and author are required): 5 points.

Extra Credit

For an additional 5 points, include a google or yahoo map to a real address on your page.