Page Menu

WebQuest:	Overview Process Page
Web Resources:	Screen Capture and Cropping Transparent GIF Images Information Footer Assignment Summary

Overview

This week you will focus on the process page of your WebQuest, and look at some additional topics in web page design. As we move forward with the WebQuest, continue to focus back on your overall problem. Make sure that the students are required to do the same so that your WebQuest remains a Problem-Based Learning activity.

The topics in web design include screen capture and cropping, and transparent images. You will also need to include your e-mail contact information and the date of the last update on your pages, which can both be done in HTML, but you could also use JavaScript or even a Java applet to add some dynamic elements to your web pages.

Process Page

Your students will look to the process page of your WebQuest to help them organize their work. You will again want to be careful as you compose the process page. The process page can turn an otherwise good Problem-Based Learning activity into a glorified web based worksheet. You may wish to look at some additional WebQuest examples to help you design your student process page. The description given in the WebQuest Templates also gives you suggestions on what to include in the process page.

Screen Capture and Cropping

Spend some time this week enhancing your web pages with additional graphics. Try using screen shots to capture graphics (MAC, PC) and cropping them to meet your needs. You can quickly capture images right off your screen, even images that are actually a combination of individual components such as graphics and text. You can use screen shots to capture application program controls such as buttons and icons as shown below.

Buttons	Icons

Transparent GIF Images

You may wish to modify some of your graphics with transparent backgrounds. This will allow the web page backgrounds or table backgrounds to show through. The cell background color was set to red in the table cells below. Notice how the graphic with the transparent background lets the cell background show through.

GIF Graphic with White Background	GIF Graphic with Transparent Background
Cell background set to red	Cell background set to red

Most of the graphic editing program that can save files in the GIF format will also allow you to select one color to be considered transparent. You can also do transparent GIF images in Claris Home Page.

Information Footer

A few additional web page elements will allow you to add a information footer to the bottom of your web pages. The footer will list your contact information in the form of a "mailto" link to automate the sending of e-mail. It is also important to give the date when the document was last updated.

Assignment Summary

1. Add additional graphics, a "mailto:" contact link, and the date of the last update to your web pages. Update your WebQuest template and upload it to the class web site.
2. Post a brief description and reflection on your experiences this week in the discussion area. Did you find it difficult to write the process page and keep the WebQuest problem based? Were the new web page design topics helpful? Interesting?