This message contains examples of putting images into a web page.

Contents of an Image Tag are:

   <IMG             The opening of an Image Tag
   SRC="file.gif"   The file name of the image
   ALIGN=right      Where in the page the image should align
   WIDTH=50         Width, in pixels, of the image
   HEIGHT=30        Height, in pixels, of the image
   ALT="text"       An Alternate text if image is not visible
   BORDER=no        A hyperlinked image shows no border
   >                The closing of an image tag


Here are some examples:

<IMG SRC="mumble.gif" ALT="Mumble Corporation Logo. ">

<IMG SRC="spacer.gif" ALT="">

<IMG SRC="email-me.gif" ALT="E-Mail Me! ">

<IMG SRC="images/redball.gif" ALT="*">

<IMG SRC="http://CheshireCatalyst.Com/images/notepad.gif" align="right" 
width="114" height="43" alt="This site created with Notepad! ">              

Working from the top down, mumble.gif is an image. The ALT tag tells a
non-graphic user what the image is. If it is not used, then users of Lynx
get [INLINE] in place of every image without an ALT. Well, not EVERY
image. If an image is hyperlinked, then Lynx will tell you [LINK]. Real
informative, eh? 

In the second example, an image has nothing on it. It is used to put a
space between two other images, or for some other reason. If the
non-graphic user is not supposed to know (or care) if there is an image
there, then tell the browser there is nothing to print by using what
programmers call a "null string", that is, two quote marks with nothing
between them. Nothing. Null. The Empty Set. You're telling the
non-graphic browser to SPECIFICALLY put nothing there. And it does. Put 
nothing there. The cursor will not even put an extra <SPACE> character. 
Nothing between the quotes, MEANS nothing! Literally! Got it? Yes, it 
CAN be a tough concept. When you're through with this, we'll move on to 
"Who's on first"! And if you tell me "I Don't Know", you're already on 
Third Base!

Next is my worst Pet Peeve. Graphics with words on them, and no ALT tag 
to tell the non-graphic users what the words are. This is especially done 
with Frames menus, since they think that non-graphic users can't get 
there anyway, but they are forgetting that some people turn graphics off 
to load pages faster, and then load the graphics they think they need or 
want. In the example, the graphic "email-me.gif" contains the words 
"E-mail Me! ". Well, if that's the message you want a user to get, then 
make sure the folks who can't see the words as a graphic, can see the 
words as text! Is that too much to ask? 

Our next example shows the use of a graphic some people use instead of
the "bulleted lists" that a <UL> (unordered list) tag would get you. They
want a small red ball at the begining of each point in their diatribe.
But to a non-graphic user, [INLINE] shows up at the start of every line
instead. 

By using ALT="*", the web designer will get the effect similar to what is
being sought, even for the non-graphic crowd. Also, the SRC statement is
getting the redball.gif file from the images directory. It is becoming
"standard" to have an "images" directory. Without an "index.html"
directory, you can get to the directory, and the server will let you
view all the images you've got there. It can be useful to go in and view
them now and again, and see what you're not using any more, and can delete. 

Another thing you might have noticed was that I left a space after the end
of the text in the ALT tag (where there was some), and the closing quote
mark. This is in case two graphics are placed next to each other. If you
had "E-Mail Me" next to "Return to my Home Page", it could come out looking 
like "E-Mail MeReturn to my Home Page". 

Last, but not least, we're going after every trick in the book with the
last one. We are getting an image from someone else's web site, aligning
the image in the center of the page, giving the page the width & height
dimensions, displaying the words with the words on the image. 

Giving width & height allows the browser to leave space for an image, and 
go on displaying the rest of the page. Otherwise, it has to wait for the 
image to load into the page before dispaying the page to the user. This 
can slow down loading to the point that a user will give up on it, and go 
on to something else. 

You can get the height & width parameters by using Netscape, hitting
CTRL-L and entering the URL of the image. Or you can hit CTRL-O and put
in the path & file name of the image. Netscape will put the height &
width in the Title area of the web page at the top of the screen. I don't
know if a speech synthisizer will get there.