Determine what pages will be necessary for the site based on the provided document.

 

  • index.html;
  • about.html;
  • contact.html;
  • staff.html;
  • rates.html;
  • CIS363A_W2_LabA_graphic.gif; and
  • lab2.css. (unless you do not use external CSS files)

    Word or Visio Storyboard Diagram document

 

Deliverable Points
Word or Visio document with storyboard 5
Completed website based on project specifications 25
Correct External CSS file that attaches to each page 10
Total 40

 

 

Lab Steps

 

Step 1: Storyboard The Site

 

  • Review the MS Word document downloaded from the scenario and summary above.
  • Determine what pages will be necessary for the site based on the provided document.
  • Create a storyboard to show those pages as they relate to each other.

 

Step 2: Establish A Basic Structure Of An HTML 5 Document

 

  • Create a new folder named W2Lab in the site root.
  • Create and save your CSS file in the W2Lab folder.
  • Save the file as index.htm in the W2Lab folder.

 

Step 3: Prepare The Resources

 

  • Download this graphic and save it in your W2Lab folder.
  • Place the image to serve as the logo on your HTML 5 page.
    • In the Alt value box, type Rainbow Daycare Logo.
  • Save the file.

 

Step 4: Create Links

 

  • Create four links representing a simple navigation menu.
    • Link one—change to About Us
    • Link two—change to Our Staff
    • Link three—change to Contact Us
    • Link four—change to Our Rates
  • Establish the links as necessary:
    • About Us → about.html
    • Our Staff → staff.html
    • Contact Us → contact.html
    • Our Rates → rates.html
  • Save the file.

 

Step 5: Add Static Information

 

  • Add descriptions below the navigation menu as paragraphs describing the nature of the links.
  • Save the file.

 

Step 6: Create And Test The Other Pages

 

  • Save the index.html file as about.html.
  • Test your web pages using the browser of your choice.

 

Step 7: Populate The Pages

 

  • The data document is arranged by page. Change the Heading 1 for each page to an appropriate title for that content, and use the content supplied for that page.
  • Here is the formatting suggestion for each page.
    • Index—Use a paragraph.
    • About—Use paragraphs, with a bullet list for activities.
    • Staff—Use a bullet list, indented for each group.
    • Contact—These are labels and values separated by colons, line breaks for phone, e-mail, and address. Place the promotion statement in a paragraph at the bottom and style appropriately.
    • Rates—This is a three-column table. Age, hours, and rates are the column headers.

 

Step 8: Prep For Turn-In

 

  • Save all files. Locate the W2Lab folder in Windows Explorer and select it.
  • Right-click and select Send To and choose compressed file.

Rename the file Lastname_w2Lab.zip, where Lastname is your last name.

Type of paper Academic level Subject area
Number of pages Paper urgency Cost per page:
 Total: