| This page was
created to help you understand images as the relate to the WWW. It includes
explanation of various graphic formats suitable for web use, as well as
simple steps to including images on your own web pages.
GIF:
Which stands
for Graphic Interchange Format is a compressed graphic format first used
on-line by CompuServe. This format uses a form of compression and usually
takes up less space and transfers quickly. The limitations are the amount
of colors that can be used. Unlike the JPG files which can support 16.7million
true colors the GIF only supports 256. There are two versions of GIF: 87a
and 89a. Both can be interlaced or non interlaced. When an images saved
as interlaced it is saved by making four passes instead of one. These graphics
appear on the net as the complete image first in low resolution, gradually
improving until the entire image is loaded and displayed. Non-interlaced
images appear in bands from top to bottom. 89a will support transparencies,
while 87a will not.
JPG or JPEG:
This is another
compression format frequently found on the net. Is a file compression format.
The letters are abbreviation which stands for Joint Pictures Experts Group.
The method of compression involves getting rid of information it doesn't
think important therefore you sometimes get an image that is not as high
a resolution as when it was created.
BMP:
This format
allows for 256 colors and while this format used in may Windows application
including Desktop Wallpaper, the file sizes make it unsuitable for webpages.
Special Note
for Backgrounds: If you're making your own images to be used as backgrounds
on your web pages, and you want to save them in the GIF format, be sure
to save them as non interlaced. While interlaced can be useful in viewing
graphics before they have been totally sent, they also take longer to load.
When used as a background, you want a fast load, to insure your viewers
can get on with reading the text on your page. All the decorative backgrounds
on this site have been saved as non interlaced.
How to copy
an image from a web page to your own computer:
Point your mouse
directly over the image you want to copy and hit your right mouse button,
when the drop down menu appears, select save as. This will open up a another
window so you can choose the directory you want to save the image to.
Placing
an image on your web page is very easy. The command to do this is:
<img
scr="path and name of the image you want to use.gif">
Example:
<IMG SRC="csdgraph.gif" ALT="CS Designs Logo" height=58 width=238> has
placed the following image on this page. Remember that in order for this
to work, you must make sure that you have given the proper path for where
your image may be found.
Making
an image a link:
The
following code will create a link
<A
Href="This is where you put the path to the page or site you want to go
to when the image is clicked"><img scr="This is where you place the
path and the name of the image you want to display and make linkable"></a>
Example:<A
href="http://welcome.to/csdesigns"><IMG SRC="csdgraph.gif" ALT="Link
to CS Designs height=58 width=238></a> will give you the following:
Height and
Width Dimensions:
Always be sure
to include the Height and Width dimensions of your graphics in your HTML
code, as this will make your page load faster, than if your browser has
to figure this out. The Height and Width dimensions, are the size your
image will appear on your page. While you can change the way an image looks,
by specifying different dimensions than, that of the original image, I
do not recommend it as it tends to deteriorate the quality of the images
and brings out the jags in transparent images. Since I have taken great
pains to ensure that the size and resolution of the final image will enhance
your pages instead of detract from them, I also do not appreciate finding
them stretched and mangled on someone's web site. Please keep this in mind
when using my work on your pages.
The Alt Command:
You should always
add the Alt="" for your images. It is an alternate description incase the
images on your page are not available. It is an aid for visitors to your
site that do not have a graphics enabled browsers, instead of an image
they see a short description of what it should be. The ALT may be the only
thing that tells someone the difference between a simple decorative image
or an image that also happens to be a link.
Important
Note for AOL users.
If you are building
a site on AOL and are using a AOL browser to copy and save images to your
hard drive, turn off the "Use Compressed Graphics" option. under your Preference
menu. If you do not, the images will be saved in a AOL proprietary format
and may appear as broken images to anyone visiting your site with a browser
other than the AOL browser.
ANIMATION:
|
Animation is
created by putting several different pictures together in sequence. The
result is one moving picture. Once you've created your graphics there are
programs that will make your files in to one moving one. You can be as
simple or elaborate as you want. You can find a list of programs to help
you create, view and catalogue your own images and animation's on my Resource
Page.
If you are
using WebTV, and need assistance, uploading images, you will find a
few useful Transloader links on my Resource Page listed above. |
|