MS FrontPage 2000 Tutorial

 

Inserting Images

To insert an image into your page:

• Click INSERT à PICTURE

OR

• Click the "Insert Image" icon on the standard toolbar.

Then:

• To choose an image from within your FrontPage Web, browse the files in the folders you see there in the Open... screen  until you find the one you want, then highlight the name and click OK.

•     To choose an image from your hard drive, click the icon of a yellow folder with a magnifying glass and browse your hard drive for the image. Highlight the file name and click OK.

•     To grab an image from somewhere on the WWW, click the icon of the globe with the magnifying glass, then find the image you want with your browser, (if it is in a page, right click on the image, then click VIEW IMAGE). Switch back to the FP Editor, and the URL will automatically appear in the URL line. Click OK. The image should appear in the editor.

•     To browse the clipart gallery, click CLIPART… Select the image you want to use by clicking on it once, and then click OK.

Image Properties

To access the Image Properties:

• Right click on the image
• Choose "Image Properties" from the pop-up menu

General tab:

Be sure to fill in some descriptive text in the "Alternative Representations" à "Text:" section. This is what users will see if they do not see the graphic in their browser.

Alternative text for EVERY graphic is required for compliance with Section 508 accessibility guidelines

The "Default Hyperlink" section is used if the graphic will be hyperlinked.

Appearance tab:

• The Alignment setting determines how an image will line up with the text around it. If you align it to "right" or "left", text will wrap around the image -- i.e. if you set alignment to left, text will wrap to the right of the graphic. The other options such as "middle" and "top" control vertical alignment of text next to an image when it is not wrapped.

• Horizontal and Vertical Spacing allow extra space (called "gutters" in print terminology) around an image. When an image is aligned to the left or right, it is a good idea to add 3 to 5 pixels of horizontal space so the text isn't pressed right against the image.

• Border thickness determines if a border appears around a graphic. The default is for a blue border to appear when an image is used as a hyperlink. However, when the image is obviously a link by virtue of looking like a 3-d button, or being a logo for another site, it is a good idea to set the border width to 0 so it doesn't appear.

• The size setting is used when you want to change the size of the image from its default, or natural, value.

CAUTION: resizing a graphic by pulling the handles in FrontPage Editor does not actually resize the file, but rather it forces the browser to recalculate the size of the image as it formats the page. Drastic changes to the size will make the image appear fuzzy or distorted. Additionally, If you start with a very large graphic and resize it to a very small image, your user still has to wait for the whole file to download. It is much better to resize the image in a graphics program such as Image Composer, PhotoShop, Corel Photopaint, PhotoStyler, PaintShop, etc. and save the image as a new file. This will reduce the size of the file and make your page load faster.

There are many older browsers still in circulation, which do not support the image size settings. No matter what values you set for an image size, these older browsers will always display the image as its natural size -- even if that is 2000 pixels wide. This will not endear your site to a user. 

-------- Do Exercise 4 -----

 

Previous | Home | Next

Kate Akers, kate@oseda.missouri.edu Webmaster, University Outreach and Extension Last modified: 08/27/02