Module 3: Building
Sample Sites
Contents
Overview
1
Lab 3.1: Creating a Web Site for an Art
Institute
2
Lab 3.2: Creating a Web Site for a Publishing
House
6
Information in this document is subject to change without notice. The names of companies,
products, people, characters, and/or data mentioned herein are fictitious and are in no way intended
to represent any real individual, company, product, or event, unless otherwise noted. Complying
with all applicable copyright laws is the responsibility of the user. No part of this document may
be reproduced or transmitted in any form or by any means, electronic or mechanical, for any
purpose, without the express written permission of Microsoft Corporation. If, however, your only
means of access is electronic, permission to print one copy is hereby granted.
Microsoft may have patents, patent applications, trademarks, copyrights, or other intellectual
property rights covering subject matter in this document. Except as expressly provided in any
written license agreement from Microsoft, the furnishing of this document does not give you any
license to these patents, trademarks, copyrights, or other intellectual property.
2000 Microsoft Corporation. All rights reserved.
Microsoft, BackOffice, FrontPage, Internet Explorer, MS-DOS, Notepad, and Windows 2000 are
either registered trademarks or trademarks of Microsoft Corporation in the U.S.A. and/or other
countries
The names of companies, products, people, characters, and/or data mentioned herein are fictitious
and are in no way intended to represent any real individual, company, product, or event, unless
otherwise noted.
Other product and company names mentioned herein may be the trademarks of their respective
owners.
Development Lead: Sonia Pande (NIIT)
Instructional Designers: Sangeeta Nair, Vijayalakshmi Narayanaswamy; Shruti Jain, Geetnjali
Arora, (NIIT)
Technical Contributors: Scott Swigart (3 Leaf Solutions, LLC); Gary Gumbiner (Great Barrier
Technologies, Inc.)
Program Managers: Steve Merrill
Graphic Artist: Scott Serna (Creative Assets)
Editing Manager: Lynette Skinner
Editor: Reid Bannecker (S&T Onsite)
Copy Editor: Reid Bannecker (S&T Onsite)
Production Manager: Miracle Davis
Production Coordinator: Jenny Boe
Production Tools Specialist: Julie Challenger
Production Support: Susie Bayers (Online Training Solutions, Inc.)
Test Manager: Sid Benavente
Courseware Testing: Eric Myers
Creative Director, Media/Sim Services: David Mahlmann
Web Development Lead: Lisa Pease
CD Build Specialist: Jenny Boe
Online Support: Debbi Conger
Manufacturing Manager: Rick Terek
Operations Coordinator: John Williams
Manufacturing Support: Laura King; Kathy Hershey
Lead Product Manager, Release Management: Bo Galford
Lead Product Manager, Internet Services: Hilary Vandal
Group Manager, Courseware Infrastructure: David Bramble
General Manager: Robert Stewart
Module 3: Building Sample Sites
iii
Instructor Notes
Presentation:
10 Minutes
Lab:
50 Minutes
This module provides students with two scenarios for building sample datadriven Web sites. Divide the students into two groups (Instructor can also
choose not to divide the class into groups), and let each group choose a scenario
based on which, they will build a Web site. A group that finishes a scenario in
the stipulated time can take the other scenario. Students can also devise their
own scenarios and develop a Web site for the scenario.
After completing this module, students will be able to design and create a Web
site for a given scenario.
Materials and Preparation
This section provides you with the required materials and preparation tasks that
are needed to teach this module.
Required Materials
To teach this module, you need the following materials:
!
Microsoft PowerPoint file 1932A_03.ppt
!
Module 3, “Building Sample Sites”
!
Lab 3.1, “Creating a Web Site for an Art Institute”
!
Lab 3.2, “Creating a Web Site for a Publishing House”
Preparation Tasks
To prepare for this module, you should:
!
Read all of the materials for this module.
!
Complete the labs.
!
Prepare pointers for students to help them create a solution.
iv
Module 3: Building Sample Sites
Module Strategy
Use the following strategy to present this module:
!
Lab 3.1, “Creating a Web Site for an Art Institute”
For this scenario, guide the students to create a data-driven Web site for an
art institute. The Web site should be designed such that the home page
consists of the institute’s profile, and below the profile, there are two links:
• List of Courses
• Registration.
Clicking the first link should show the names of all the courses. This page
should have a link on course names. When a course name is clicked, a
second page should open displaying the course details, such as the course
fee, contact information of the lecturer, and duration of the course. The
second link should contain a registration form that the users can fill to
register for a particular course. The form fields should include name,
address, telephone, and the email address of the users and the courses that
they are registering for. Students can either use Form Page Wizard for
creating the form or create it manually. When a user submits the registration
form, the particulars of the user should be stored in a database maintained
by the institute. Students can include images and other text to enhance the
look and feel of the site.
!
Lab 3.2, “Creating a Web Site for a Publishing House”
For this scenario, guide the students to create a data-driven Web site for a
publishing house, containing the following pages:
• A home page
• A customer registration form
• A list of books published by Lucerne
• An order form
• An asp for updating customer data
The home page should contain three links. The first link should display a
registration form. When a user submits the registration form, the particulars
of the user should be stored in a database maintained by the publishing
house. The second link should display a list of books published at Lucerne.
Each book title should be a hyperlink to an order form that should be
displayed when a user clicks on a book title.
The Website should also allow provide users with the option to make
changes to their data, such as address and phone number. Students can
enhance the look and feel of the Web site by adding images
Module 3: Building Sample Sites
# Overview
Slide Objective
To provide an overview of
the module topics and
objectives.
!
Lab 3.1: Creating a Web Site for an Art Institute
Lead-in
!
Lab 3.2: Creating a Web Site for a Publishing House
In this module, you will
choose a scenario and build
a Web site for the chosen
scenario.
This module consists of the following two projects in the form of labs, each of
which presents a scenario for a prospective Web site:
!
Designing and creating a Web site for an art institute.
!
Designing and creating a Web site for a publishing house.
The scenarios are designed to give you an opportunity to apply the concepts
you have learned in this course. You can pick any one of the preceding
scenarios to build a Web site, or you can devise your own scenario — an
assignment at work, for example — and work on that instead.
After completing this module, you will be able to design and build a Web site
implementing the concepts you have learned in this course.
1
2
Module 3: Building Sample Sites
Lab 3.1: Creating a Web Site for an Art Institute
Slide Objective
To introduce the lab.
Lead-in
In this lab, you will create a
Web Site for an art institute.
Objectives
Explain the lab objectives.
To create a data-driven Web
site for an art institute.
After completing this lab, you will be able to:
!
Create a Web site that retrieves data from a database.
!
Create a registration form.
!
Add data to a database.
Scenario
The Institute of Art runs skills development courses for arts professional and
students. The institute wants to launch a Web site to provide information about
the courses that it offers and to allow users to register for a course. You will
create a Web site for the institute, which contains a home page. The home page
should show the institute’s profile and contain links to two other pages that
display:
1. A list of available courses.
2. A registration form for the students.
Clicking the first link should show the list of available courses. On this page,
create a hyperlink on the course names. When a user clicks on a course name,
another page should open displaying the course details, such as the fees, the
lecturer, contact information for the lecturer, and the duration of the course. The
second link should contain a registration form that the users can fill in to apply
for a particular course. This form should include name, address, telephone, and
the e-mail address of the user and the course that the user is applying for. When
a user submits the registration form, the data is stored in a database maintained
by the institute.
Module 3: Building Sample Sites
Building this site will entail the following four main steps:
!
Creating the home page.
!
Creating the list of courses.
!
Creating the course details page.
!
Creating the registration form.
3
4
Module 3: Building Sample Sites
Creating the Home Page for Institute of Art
! Create a home page
!
Create the home page for the Institute of Art.
The home page for the site will display the following text as the profile of
the institute:
The Institute of Art assures the highest standard of presentation and content.
We are continually developing a range of courses to meet the professional
and creative needs of the community. All courses are taught by experienced
professionals with a commitment to quality education. Quality materials are
always used and in most cases included in the cost of the course.
Our courses have been designed for:
•
•
Aspiring designers and artists who would like to get into college and
need the help of a specialized training.
•
!
Professional artists, teachers, and lecturers who would like to expand
their knowledge and skills.
Individuals with no background in art but with an interest in
developing their creative skills.
Create the following links on the page:
•
List of Courses
•
Registration
Creating the List of Courses
! Create a list of courses
• Use <install folder>\Labs\Lab03.1\Starter\ArtInst.mdb.
• Display the Course name field from the Courses table.
Creating the Course Details Page
! Create a course details page displaying detailed information on a course
• Use <install folder>\Labs\Lab03.1\Starter\ArtInst.mdb.
• Display the following fields from the Courses table.
Course Id, Course Name, Duration, Course Commencement Date, Lecturer,
E-mail-Lecturer, and Course Fees.
Module 3: Building Sample Sites
5
Creating the Registration Form for Institute of Art
! Create a registration form
• Create the registration form for Institute of Art. The form should contain the
following fields: First Name, Last Name, Phone, E-mail, Credit Card
Number, Expiry Date, Course ID, and Course Commencement Date, and a
Submit button.
• Use <install folder>\Labs\Lab03.1\Starter\ArtInst.mdb.
6
Module 3: Building Sample Sites
Lab 3.2: Creating a Web Site for a Publishing House
Slide Objective
To introduce the lab.
Lead-in
In this lab, you will create a
Web Site for a publishing
house.
Explain the lab objectives.
To create a data-driven Web
site for a publishing house.
Objectives
After completing this lab, you will be able to:
!
Create a Web site that retrieves data from a database.
!
Create a registration form.
!
Create an order form.
!
Update data in a database.
Scenario
Lucerne Publishing is a publishing house that specializes in reference books
and textbooks for IT professionals. The publishing house wants to launch its
Web site, which would allow users to order books online. Create a Web site for
the publishing house containing the following pages:
1. A home page
2. A customer registration form
3. A list of books published by Lucerne
4. An order form
5. An asp for updating customer data.
The home page should contain three links. The first link should display a
registration form. When a user submits the registration form, the particulars of
the user should be stored in a database maintained by the publishing house. The
second link should display a list of books published at Lucerne. Each book title
should be a hyperlink to an order form that should be displayed when a user
clicks on a book title.
The Web site should also provide users with the option to make changes to their
data, such as address and phone number.
Module 3: Building Sample Sites
The process will contain the following main four steps:
!
Creating the registration form.
!
Creating the list of books.
!
Creating an order form.
!
Creating the asp for updating customer data.
7
8
Module 3: Building Sample Sites
Creating the Registration Form
! Create a registration form
• Create the registration form for Lucerne Publishing. The form should
contain the following fields: First Name, Last Name, Phone, E-mail,
Address, City, State, Zip Code, Country, and Password and a Submit button.
• Use the <install folder>\Labs\Lab03.2\Starter\Lucerne.mdb.
Creating the List of Books
! Create a list of books
• Display the Book Id, Book Title, Author, and Price fields from the Books
table in the database.
Creating the Order Form
! Create an order form
• Create the order form for Lucerne Publishing House. The form should
contain the following fields Order Id, Book Id, Customer Id, Credit Card
Number, Expiry Date, No_of_Units, and Total_Amount and a Submit
button. The form details should be stored in the Order table of the database.
Creating the ASP for Updating Customer Data
! Create an asp for updating customer data
• Create an asp that lets users modify their records in the database.
• Display the First Name, Last Name, Phone, E-mail, Address, City, State,
Zip Code, and Country from the Customer table. The password specified
during the registration should be verified for authenticating the user’s
identity, before he or she can submit the changes to the database.