BASIC HTML 101

Overall HTML format: Graphics

The majority of graphical web browsers in use today can only view .gif and .jpg files without launching helper applications. If you ask your viewers to obtain a different helper application, you will shut out a large portion of your target audience.

Because of the amount of time they take to load, graphic files can detract from the usefulness of your page. Minimizing file size should be considered when incorporating graphics in your page. Loading time depends on the size of the file, not the size of the picture.

Compare the size of your file in .gif or .jpg format and select the smallest file size providing the best picture size and quality on the screen.

The format for the HTML code to insert an image in an HTML document is:

<IMG SRC=URL WIDTH=n HEIGHT=n ALT=string BORDER=n ALIGN=left|right|top|middle|bottom HSPACE=n VSPACE=n USEMAP=URL ISMAP>

For example, use:

<img src="smile.gif" width="15" height="15" alt="Smiley Face">

to insert this Smiley Face:

Note: if the image filename contains a space, then the IMG tag must be URL encoded with %20:

<img src="smile%20face.gif" width="15" height="15" alt="Smiley Face">

in order to insert this Smiley Face:

• Click the Right-Mouse-Button and select "View Image (smile%20face.gif)" and notice the URL.

Note: see here for more information on the IMG tag.

Picking between .gif and .jpg:

Use .gif with solid colors and sharp contrasts or lines between solid color areas. .gif is best used with cartoons, clip art, text diagrams and charts.
Use .jpg (or jpeg) with photographic quality, continuous blends of color ranges. .jpg tends to blur sharp edges or contrasts.

Topics for further exploration include:

inline images

transparent gifs

adjustable quality of jpgs

animation and vrml

dithering

If you just gotta have a book, you might consider Lynda Weismann's book, Designing Web Graphics: How to Prepare Images and Media for the Web. Indianapolis, Indiana, New Riders Publishing, 1996; check out her website at http://www.lynda.com.

Graphic Software

LView Pro is a very good graphic manipulation package for Windows available via the web, with versions for Windows 95 and Win 3.1

BASIC HTML 101

Tables

Page provided by

's Monterey Office.

This page is maintained by RUSSELL HOLDER and does not represent any views or policies of and is not affiliated in any way with my employer.

Last update: 03APR98 0644HRS RAZ

Russell@dra.com