Beacon Lesson Plan Library

Can You Picture This?

Joel Beck


The students create a Web page using an appropriate picture format, which they determine by analyzing size and download time.


Applies a variety of technical skills to industry specific projects.


-Computer for each student and teacher
-Projection device connected to teacher's computer
-Picture of class (or other picture) saved as jpeg, gif, and bmp formats
-Internet access or pictures stored on students' computers to use on a Web page
-Notepad Computer Program (Web authoring program)


1. Take a class picture, if you have a digital camera, or other picture that is of interest to the class.
2. Download picture into your computer and convert to jpeg, gif, and bmp formats.
3. Compute picture sizes and download times using a 56k modem.
4. If you do not have access to the Internet, load at least 10 pictures on student computers in different formats for them to create a Web page.


*This lesson presumes that previous lessons have taught students how to create Web pages using Notepad to create HTML, how to incorporate graphics, how to download graphics from the Internet, and how to utilize search engines to find graphics and information.

1. Create the same picture in jpeg, gif, and bitmap format and show the 3 pictures to students.
SUGGESTION: Use a class photo. Use Web safe colors so the photos in the different formats look the same.

2. Ask students to indicate the difference between the pictures in what they are seeing. (There are no visible differences.)

3. Right click on properties for each picture and have the students write down the information for picture size in bytes.

4. Explain the differences in formats to the students.
* Gif: 8 bit, 256 colors, compressed format
* Jpeg: 24 bit, 16 million plus colors, compressed format
* Bmp: 24 bit, 16 million plus, no compression

5. Explain that compression is a mathematical formula used to squeeze bits together so they take up less space. So when you save a picture that uses compression it is saved in a smaller space and when it is opened it comes up to the original size. It's like a sponge being squeezed into the palm of your hand. When you open your hand, the sponge goes back to the original size.

6. Have students get into groups and discuss why and when they would use the different formats.

7. Review modem speed with students and then ask them to compute how long it will take to download each of the pictures displayed. Have students work this out at their desks, then have some come to the board and show how they arrived at download times. Give students an example:

If you have a picture that is 448,000 bits, and your modem speed is 56k or 56,000 bits per second, you would get a download time of 8 seconds. (You divided your picture size by modem speed.)

8. Have students go out to the Internet and download a picture in each format (jpeg, gif, bmp) for use on a Web page they will be creating. Have them save the picture to their disk or desktop. Make sure they give relevant names to the pictures when saving. NOTE: Students must also write down the Web address of where the picture was found. (See Assessments)

9. Have students create a Web page that includes the 3 pictures previously downloaded from the Internet. Indicate to the students that they must select a jpeg, gif, and bmp format.

10. Students create an information chart for each picture telling reasons for use or nonuse on a Web page. Each chart should also include size, format, and download time for each picture. This chart will be used as a formative assessment with feedback given to the students.


EVIDENCE: Use completed charts to assess students' ability to evaluate picture types for use on a Web page.

-Reasoning for format use or nonuse is logical and appropriate.
-Mathematical computation for download times for pictures selected is correct.
-Format is correctly identified.
-Size is correctly stated.

-All three formats are included.
-Chart appropriately displays correct information for picture types, size, and download times.
-Written argument for use is appropriate for picture selected.

-Student chart shows all picture formats.
-Download times are mostly accurate.
-Sizes are mostly correct.
-Written argument for use is somewhat appropriate for picture selected.

-Student chart does not show all picture formats.
-Download times are not accurate.
-Sizes are not correct.
-Written argument for use is not appropriate for picture selected.

NOTE: Teacher must check each Website against the student chart in order to properly assess the project.

Web Links

To find pictures on the Internet use a search engine such as Google

For help in picture format tutorials

Additional information on picture formats
Web Graphics Overview from webmonkey

Return to the Beacon Lesson Plan Library.