Web Project I

This work is licensed under a Creative Commons License.

Web Project I

Define a new site...call it Web_Project_1
Create an images folder within the site
Create an index.htm page. You need to do the following for your index page.
1. Use one of the linear gradients below as your background image
2. Use the hexadecimal number in the cell above the gradient as your background color
3. Insert a table and use it as a layout tool
  1. Align the table center
  2. Create a color scheme ...start by using one of the vertical linear gradient bars below. You will need to download one of the bars into your the images folder of your site.
  3. Fill the cells of the table with a color so that it is compatible with your page background image. Your goal is to create a home page similar to the image below (note: this image is a Design mode view and so the table padding and spaces show.)
  4. Above the table create a title and format it H1
  5. Under the title create the following: Home | Red | White | Blue | Black | Orange
Create five more pages and name them: Red.htm, White.htm, Blue.htm, Black.htm, and Orange.htm
1. Set the back ground color of each of the pages above to its respective name...or shades thereof.
Go back to your index.htm page and link each menu item: Home | Red | White | Blue | Black | Orange to its respective page.
Copy and paste this menu bar to the area represented by the black column of the index.htm page. Align it to: vertical=top, horizontal=center. Format the links so that they are stacked and single spaced between each item.
Copy and paste this menu below the table and center it.
For every page you need to do the following:
1. In Page Properties set:

BG color to the name of the page
Set the font to a Sans Serif font
Set the font size
Give every page a Title...just name it the color of the page.
Set the link colors. Since the pages have different contrasts then you need to set the link colors of each...what links?
These links should be on all pages: Home | Red | White | Blue | Black | Orange and they should be functional links.

Insert at least one image on your home page along with some text and format the image accordingly.
Spell Check your site.
Clean Up XHTML
Apply Source Formatting
Preview and test all links

o,g

Fig 1: Design view of what your home page layout should look like.

Linear Gradient Backgrounds

Save one of these into the Images folder of your site and use it as the BG image--repeat-x. You should use the color cell on top of the vertical bar to set your background color.

Top