Activity Industry Sector
Information & Communication Technologies

Activity Originally Created By: Brooke Ahrens

Image Race

Part of Lesson Plan: Working with Images

Activity Overview / Details

When students walk in have the following displayed:

Mystery Image

Explain that the image was so large only part of it could be displayed and you will need the students to load the image in order to reveal what it is.  Divide the room into 2 halves and assigned each half one of these links.  Post the links were students can easily access them online. Tell students that at the count of 3 they are to click the link. Count to three and have students all click the link.

Image 1: - Note, image 1 is a very large file.
Image 2

Students that click Image 1 will discover that it takes a very long time for the image to load, because of it’s size.  Students who click Image 2 will see almost no delay.

As you wait for students in the first group to have their images load, explain that they have just experienced what happens when web designers use images that are too large.  

Issue 1- the image obscures the page content, making it difficult to view the page, like the piece of bun they saw when they came into the classroom.
Issue 2- images that are 2 large take a very long time to load.  If people have to wait for web pages to load they may become frustrate or leave the page

The focus of the lesson for the day will be adding correctly sized images to web pages using html coding.

Materials / Resource