|
Only two types of image files can be used on webpages--
GIF or JPEG.
GIF - Graphical Interface Format
(developed by CompuServe)
Clipart-type images-- flat pictures in clear colors with crisp lines.
A series of GIF images compiled to show movement is an Animated
GIF. |
JPEG - Joint Photographic Experts Group
Photograph-type pictures with complex gradations of color and shaded
lines.
Filesize is usually larger than GIF and loads more slowly. |
BMP or PICT or TIFF images cannot be used.
Many copyright-free graphics are available online to use on webpages. (Click "Webmastering & Technology" link on Barupa's homepage.)
Here are some to use for this tutorial. Save into your My Webpages folder and then proceed.
To insert an image, place the cursor on your page where you want the image to display.
-
On the Composer toolbar, click the Image
button--
it's the one with little shapes.
The Image Properties window opens.
-
Click Choose File button. Another window
opens.
-
Navigate to your My Webpages
folder.
a
-
Highlight a Filename.
The image filename displays in the Image Location field; a small display of the image appears in the Image Preview field.
If you don't like it, click Choose File and find a different one.
- Before closing the window, enter a brief description of the image in the Alternative Text field.
If you just click OK, a message prompts you to provide alternative text.)
a
- When finished, click OK
to close Image Properties window. Image appears on webpage.
To move image, click on it to highlight. Click-hold to drag image to another
spot, then release mouse.
NOTE: Animated GIFs may not show movement in
Composer.
Use Preview tab at bottom of Composer window to see how page displays in Navigator
browser.
If your animated image still doesn't move, use the Browse button (ship wheel)
on the toolbar to open a new browser window. Close browser window (click X) when done viewing.
Additional Image Properties
To display Image Properties window, highlight image and click Image button or right-click and choose Image Properties on menu.
Click the Appearance tab.
Add Space around image to set it apart
from text.
-
Images look better with 5 - 10 pixels of blank
space around them especially to separate them from surrounding text.
-
Put numbers for Top
& Bottom spacing and/or
Left & Right spacing.
Add Border to image,
-
In box next to Border
put number 1 - 10 and click OK.
(Color of border is default text color of page.)-
Remove border by entering zero.
Alignment menu positions text relative to image.
-
Type text next to your image and experiment with the 3 vertical placement buttons and 2 buttons for left or right wrapping of text. No
center wrapping.
- Alignment button on formatting toolbar sets
horizontal placement of image if separated from text, but results are odd next to text: will not wrap text around image.
When finished, click OK to close Image
Properties window.
Click Image button for each new image to place on page.
Images are not part of page. They are separate files.
To understand this better, see what you've
really created...
|
|