Online Graphics

Introduction

File Formats

Inserting Images

Inserting Audio

Editing Images

Activities

Suggested Sites

Teaching Guide

  

Graphics

Activities

The following are some activities and on-line tutorials that are designed to guide the participant in inserting various types of graphics into the web site. 

I. Activities

    Find a graphic and save it to the desktop

This is from Netscape's tutorial on Navigator,  Saving an image

There are a couple of images on this page.  You might want to practice with them.

  "1. Position the mouse pointer over the image you want to save. 

  2. (Windows and Unix) Click the right mouse button. 

        (Mac OS) Hold down the mouse button.

  3. (Windows) Choose Save Image As. 

        (Mac OS and Unix) Choose Save this Image as.

  4. Choose the location on your hard disk where you want to save the image.

  5. (Windows and Mac OS) Click Save. 

        (Unix) Click OK."
 
 

    Insert an image into your page.

This is from Netscape's tutorial on how to insert a graphic into your page. 

Working with Images

You may want to insert the images you saved in the activity above into a blank Composer page.

Inserting an image in your document

"Follow these steps to insert an image file located on your hard disk into the document you're
editing: 

  1. Click where you want the image to appear in your document.

  2. From the Insert menu, choose Image, or click the Image button in the Composition toolbar.

  3. (Windows and Mac OS) Click Choose File to locate the image file on your hard disk.

        (Unix) Click Browse to locate the image file on your hard disk.

        An image is actually a separate file that does not "live" in your Composer
        document; the image file can be located on your hard disk or on a
        remote computer.

  4. (Windows and Mac OS) Select the file and click Open. 

        (Unix) Click OK.

  5. Choose the options you want. 

  6. Click OK." 
 

    Inserting a background image.

Use one of your saved images as a background for your blank page.

From Netscape Composer Help Files: Setting Page Colors and Backgrounds

The Colors and Background part of the Page Properties dialog box lets you set a background color or image for your page..

To set colors and backgrounds, open the Format menu and choose Page Colors and Properties. 

In the Page Properties dialog box, click the Colors and  Background tab. 

Click the checkbox to use an image as the page background. Type the name of an image file. If you're not sure of the filename or file location, click Choose File to find the image file on your hard disk or  network.

Background images are tiled and override background color.

Note:  You can also use an image for the background of a table.  In the Format menu, choose Table Properties, then choose the table tab, which has a  checkbox at the bottom for choosing a image file to use as a background.
 
 

    Manipulate images.


Again from the Working with Images section of Netscape Tutorial.  Try this with your inserted images from the above activities.

"Composer places the image at the insertion point location. To change the image's properties, double-click the image.  (Windows) If you paste or drag a BMP (Windows bitmap) image into your document,  Composer converts it to JPEG format. You can convert to other formats, such as the popular GIF format, by using the appropriate plug-in. 

Resizing an image (Windows only)

1. Position the pointer over the image's highlighted border so that the pointer changes to a double-arrow shape.

2. Drag the border to resize the image. 

Moving an image to a new location (Windows only)

Drag the image and drop it at the new location. 
 
 

    Add Sounds to your Page

"You can save sound files you may find on the web by right clicking (or holding down  the mouse button if using a Mac) over a sound link until the popup menu appears, and choose "Save This Link As." You can then insert your audio file into your web page using a web editor. The file can be linked in the same way as you would if you were linking to another page except link to the audio file (*.au)."  {from Adding Sound to Web Pages )

Example:  This is a link to a drum sound, a WAV file. I had to save it according to the directions above.  In Composer, the process I used too create the link was: I had to highlite the words drum sound, and then, in the menu above,click on link (the one with the picture of the chain link).  I then had to click the choose file button, browse to the file location, change the file format type from html to wav so I could see the file name in the file window,  and then select the file. You may want to add this or another sound to your page.

II. On-line graphics tutorials
There are several tutorials that can be found on the web which help with different types of graphics.  The tutorials that are selected depend upon the kind of help that one needs with graphics. 
 

For an entire list of general graphics tutorials and lessons go to: 
graphicssoft.about.com


 
The contents of the Web Institute Web Site, including the On-Line Curriculum, Web Tank, and Session Notes, are Copyright 1999-2000, Graham School of General Studies, University of Chicago. No one may print, copy, or otherwise reproduce these materials without the express written permission of the Director of Education Programs at the Graham School. All rights reserved.

The chapters from Curriculum Webs: A Practical Guide to Weaving the Web into Teaching and Learning are Copyright 1999-2000, Craig A. Cunningham and Marty Billingsley. No one may print, copy, or otherwise reproduce these materials without the express written permission of the authors. All rights reserved.