WIT 2003

Images

Images are used on most web pages to make the page more attractive or interesting. There are several different types of image files, but the two most common are GIF and JPEG. Remember, you can also use images as links.

Inserting an Image on Your Web Page

1. Place the cursor where you would like your image to appear
2. Click the image button on the toolbar or open the Insert menu and choose Image.
3. You will see the image properties box:
4. You can type the location and filename of the image file, or click Choose File to search for the image if it is located on a floppy disk or on the desktop
5. Add simple text in the Alternate text field for browsers that are reading text only and to show when an image is loading (the alternate text should describe the image). **Choose Don't use alternate text if you wish to skip this step
6. Press OK

Tip: Netscape Composer prefers to have web pages saved or published before inserting images.

Tip: To quickly insert an image: drag and drop it onto your page (you need to have two screens open to do this)

Tip: To insert a line break after images in a paragraph, choose Break Below Images from the Insert menu

Editing Image Properties

Once an image has been placed on your page you can alter the image's height, width, spacing and text alignment

• Double-click the actual image or click on the image icon on the toolbar to bring up the Images Properties dialog box

Click on the Dimensions tab:

• If you select "custom size" you can alter the width and height of your image. It is possible to change these measurements using pixels or percentages. **Note: altering the image will not affect the original image file, only the one inserted on the page
• If you decide to custom size your image, it is a good idea to keep the "constrain" option checked. This maintains the image's aspect ratio, so the image doesn't look distorted. If you keep this box checked, it is only necessary to change the width or height, not both
• After changing your image, if you change your mind, simply click Actual Size and your picture will be restored to the original dimensions

Click on the Appearance tab:

• You can specify the amount of spacing you would like around an image; between the image and text. You may place a solid black border around the image and specify its width in pixels. If you would like no border, place a 0 in the border field
• If your image is placed next to text, pull down the Align Text to Image box to see your options:

Click on the Link tab:

• If you want your image to be a link, you can place the URL or select an anchor for the image in the text field. Click here for the page on links

Click OK to confirm all changes

Activities:

Time to practice! Grab one of the images below. Insert it on a Composer page and practice making changes to it. Also, save the image you select on your desktop or floppy disk to practice opening an image from the "choose file" option.

In order to save the image, click on the image, then right click the mouse. Click on "Save Image"

Note: Mac users can get the same menu with a Control-Click or a press & hold over an image

Need some graphics?

• http://www.teacherfiles.com/clip_art.htm
• http://www.teachnet.com/how-to/clipart/
• http://school.discovery.com/clipart/

Click here to proceed to Tables