|
Goal for today
Learn about some techniques for controlling how images are displayed.
Learn how to use image editing software with FrontPage.
Note about copyright
When you use pre-existing materials that have been created by someone
else you need to consider whether such use is legal and ethical.
The primary legal issue is whether a use of a given resource is
allowed within United States copyright law. The law gives educators
certain privileges not extended to the general public; these privileges
are known as the "Fair Use Doctrine" and provide certain
exemptions to copyright restrictions. However, since the copyright
law was last given a major revision in 1976, long before the development
of the World Wide Web, there are some gray areas in which the law's
application to new media is not entirely clear.
It is important to consider the moral or ethical issues raised
in such use. Since teachers are, by their nature, serving as examples
to their students, they should be careful to serve as good examples
that students would do well to emulate. An important principle to
follow is: "always give credit where credit is due." Even
if a web site gives explicit permission for you to use something
you find on that site, or even if the resources are explicitly in
the public domain, it is always good practice to give notice of
where you found it and to give thanks to those who made it available
to you.
This information was taken from chapter 4 of Curriculum Webs
by Craig A. Cunningham and Marty Billingsley. Please refer to your
copy of Curriculum Webs for more information about copyright
laws.
Back to the top.
How to copy an image from the Web:
- Right click on the image (or, on a Mac, control-click or hold
down mouse button)
- Pop-up menu includes "Save picture as...." Choose
that.
- "Save as..". dialog box opens; browse to the correct
folder (if you're going to use the image in a FrontPage web page,
put the image in the img or images folder of your Web
- make sure image has appropriate extension (.jpg or .gif). Usually
you can just let the computer determine the right extension.
- REMEMBER where you put it.
- TRY THESE INSTRUCTIONS ON THIS IMAGE:
(NOTE: this image has two "hot spots." Can you find them?)
Once you have an image you want to put into a page,
- Use Insert | Picture...| From File or click the Image icon
in the Insert Bar.
- Browse to the image (do you remember where you put it?), click
OK
- image is inserted at cursor
- To resize the display of an image, click on the
image and drag one of the corner handles that appears. If you want
to make an image "fat" or "skinny," drag one of the handles on a side,
top, or bottom.
- NOTE: When you alter the display size of an image, you don't actually
change the size of the image; only its display. To change the actual
size of the image, you'll have to "edit" it in an image
or photo editor such as Microsoft Photo Editor, Photoshop, Paint Shop Pro, or Paint.
Back to the top.
Once you've placed an image into your page, there are a couple of
ways that you can get information about the image's size and how it
affects the loading time of the page.
Open a new file and save it as "imagetest.htm." Right now
the page should be empty.
Look at the status bar of the page editing window. (This is the bar
at the bottom right of the window.) It should look something like this:

This tells you that the current (empty) page will take
0.1 seconds to be downloaded by a modem at
56 KB per second.
Now, insert this small image into your web page:
This image is much less than 1K in size. When you add it into your
web page, it adds an insignificant amount of size and time to the
page loading. The status bar hasn't changed.
However, if you add in this image:

the status bar changes to
.
As you build your web pages, think about the overall
size of your page and try to keep the page under about 30 seconds
or, for a long page with lots of images, no more than 120 seconds.
(The current page should take about 86 seconds at 28.8 Kb/sec or about
20 seconds through a T-1 line as on the U of C campus.)
Back to the top.
Using images as links
Images can be linked to other images or pages.
Simply click on an image after you have placed it in your page.
Then use Insert Hyperlink
and make the
picture link.
A lot of web designers use small images, or icons, to indicate links
to different areas of your web site. You can find lots of icons to
use for this purpose at
http://www.iconbazaar.com.
Back to the top.
Image maps
FrontPage allows you easily to create image maps, with different
links for different sections of the picture, and behaviors assigned
to these areas.
Activity:
For example, say you want to use a picture of two people and you
want to create a page about each person. By clicking on the person,
you want the user to be able to access information about that person.
Let's use this picture for the exercise. (This is Craig Cunningham
and daughter Rowan Cunningham). Notice what happens when you point
your mouse on the face of one or the other. The cursor turns into a
pointing hand, like a link. Click. Voila! it is a link!.
Download the picture to your images Folder.
Now insert the picture into a new file.
Let's say we want to link Craig's face to a page called craig.htm
and Rowan's face to a page called rowan.htm. Create these new files.
For now, just put descriptive comments in these two files, such as
"This file will contain information about Craig" and "This
file will contain information about Rowan." Save and close these
two files.
If the picture toolbar isn't visible, use View | Toolbars|
Pictures. Click on the picture.
"Hotspots" are entered using these tools:

The shapes are used to create the hotspots. The left one
makes rectangles and squares; the middle one makes ellipses and
circles, the one on the right makes irregular shapes. The arrow
pointing to the blue rectangle allows hotspots to be visible on the
picture.
Choose the circular hotspot tool. Click on the center of Craig's
face and drag out to make a circle. When you let go, the Insert
Hyperlink dialog box appears, and you can choose the file to link to.
Repeat on Rowan's face. Once the hotspots are drawn, the can be
dragged or resized.
Back to the top.
Using Tables to arrange pictures on a page
You can use a table to place a photo and its caption, thus:
 |
Craig and Cheryl
were delighted to welcome Thomas Liam Cunningham to their family
on June 5, 2001! |
Back to the top.
|