... part of the Web Site of George North -- Back to Site Index to BlackBoard
Webpage Design and Development, CPST-2400-10
Summer 2010

Case Problem - Week 7, Monday, Jun 21
Gresham Children's Choir
Due 11:59 PM, Sunday, Jun 27

Assignment
Key Terms
News

You should already have the Data Files need for this Case Problem. See BlackBoard's Course Materials for more information.



Tutorial 4, Case Problem 4

Gresham Children's Choir

Tutorial 4, Case Problem 4 is presented in your textbook starting on page 268. The instructor for Gresham Children's Choir is working on a Website describing the history of opera. You have been asked to help create a design for the Website. You are provided with text and image files for each composer to be included in the new Website. Use this information to design your Website. You may supplement these files with any other material you think will enhance your site's design.



Before beginning this task:
  1. Read Tutorial 4 in your text book. Tutorial 4 will be much easier if you practice with Case Problems 1, 2, and 3 first -- and you will learn design concepts not covered in Case Problem 4.
  2. You may want to make a new folder on your computer, and on your web site to contain all the files for this project.
  3. Review the content of the text and image files.


To complete this task:
  1. Using provided data files, create a Webpage describing each composer's life and accomplishments. Provide links making it easy to navigate between your Webpages. Link your Website to external websites to enhance the value and design of your site.
  2. Create an external style sheet named gresham.css for your Website. Insert comments in the style sheet file that describe the purpose of the style sheet itself and the purpose of each section of coded styles.
  3. The gresham.css style sheet must contain at minimum:
    1. Styles that use contextual selectors (textbook p201)
    2. Style that uses a pseudo-element and a pseudo-class (textbook p215-222)
    3. Styles that use positioning, either absolute or relative (textbook p227-230)
    4. Style that creates or modifies an ordered or unordered list (textbook p215-222)
    5. Style to create a rollover effect (textbook p215-218)
  4. Another style sheet, named printer.css containing styles for a printed version of your Webpages. Insert needed comments. (textbook p243-250)
  5. Every time you make any changes to your Style Sheets, you should use W3C CSS Validation Service to find errors quickly, making it much easier to make needed corrections.
  6. As you make small changes, use your browser to view your WebPage. Use W3C Markup Validation Service to catch HTML mistakes as you make them.
  7. Use a folder on your computer, and on CPST WebServer to keep your files organized.
  8. Test your Webpages under a variety of browsers.
  9. Test your Webpages to be certain that your external style sheets work as designed. How do you test external style sheets? Good question. One way would be to make changes to a completed style that you know will change the look/design of your webpages. View the pages. Undo the changes you just made. View the pages.


When you are finished:
  1. Use FTP to upload your completed web page to your Tulane CPST WebSite.
  2. Copy the URL of your website's main page and paste it into a new eMail message to George (gnorth@tulane.edu). Subject of this eMail MUST be "Tutorial 4 - Case Problem 4"

untitled
Where is it?