Date: Monday, September 29 through October 3, 1997

Objectives: The students will

I. refine their knowledge of HTML, placing special emphasis on using graphics in their pages;

II. become familiar with the graphics program Paint Shop Pro 3.12 (16-bit version).

III. develop original graphics using Paint Shop Pro that they can use on their own web pages.
 
 Warm Up Activity (Anticipatory Set): Reviewing Web Pages
 
A) Return students' web pages in print form.

B) Have students load their current pages from the hard drive. Students should load pages in Netscape as well as HTML Assistant.
 
C) Distribute students' web pages on floppy disk. Have students compare their version with the corrected version they have from the disk. Students can save corrected version to the hard drive.

D) Have students use the checklist for web pages  to determine if their page is ready to be placed on the school web site.

E) Have students save revised versions of their pages to a floppy disk (marked with their filename). Disks must be turned in to the teacher for review and posting.

Main Activity (Instructional Input): Paint Shop Pro: An Introduction

A) Have students open Paint Shop Pro. Have them write the the following elements of the screen shot.

B) Students should move their cursor over the requested feature to find the answer.
 
Examples (Modeling): Creating an Image in PSP

A) Instruct the students to develop one of each of the following web page elements.
 

1) A background image. One their image is done, they must save it to the same subdirectory as the web page file that they want to add it to. Be sure to review and stress this fact frequently.

2) A bullet, line or header graphic. The header would replace the element that now appears between the <h1> and </h1> tags.

Check For Understanding and Guided Practice:  Checking Students' Progress

A) Assist students in developing their images by moving around the room.

B) Students will need help starting the file, getting sizes correct.

C) Have the students perform the following tasks on their images while checking:

1) Cropping the image.
2) Resizing and resampling the image.
3) Color manipulation through gamma correction and brightness/contrast.
4) Increasing Color Depth to 16 million colors.
5) Saving as a GIF or JPG.

D) Assign 20 points for each element added: 20 for background and 20 for other image.

E) Students can draw their own image in Microsoft Paint and save as a .BMP file, then convert the image to GIF using PSP.

Homework (Independent Practice): Developing Web Page Graphics

A) Have students develop one additional graphic for the page they are developing for their department.

B) Students should be allowed to hand draw an image and have it scanned into a GIF. Students can then make needed changes and add to their departmental pages.

C) Inform students that they should work on departmental pages throughout the week and use Paint Shop Pro to add color and illustrations to their pages.
 
Wrap-Up Activity (Closure): Creating a Image with Text and Drop Shadow

A) Have students create an image with some text with a background color for their Departmental Page

B) Have students go to Image, Normal Features, Blur and blur the text.

C) Have students use a foreground color to place the same text over the blurred image. The result is text with a drop shadow.

The result might look like the following:
 

D) Have students use HTML Assistant to place heading on their page.
 
 
Evaluation: The lesson will be evaluated by:

I. the accuracy of student's written responses;

II. student's scores on future tests and quizzes.