 |
|
 |
| Using Images and Sound |  |
|
|
Images
You can enhance your message and your visitor's experience by including "in-line" images. Currently two types of graphics images are used on Web pages, JPEG and GIF. Be sure that the images you intend to use are in one of these formats.
If the visitors to your page are using Win95 operating systems or above, then you can add sound that can be heard when the page is accessed. Background sounds will automatically load and start playing upon accessing the page.
NOTE: The tags listed in the two tables below allow you to add images and/or add sound to your page. The coding for images and for background sounds must be located in the Body of your HTML coded page between <BODY> and </BODY>.
| HTML Tag |
Attributes (options) |
Description |
| IMG |
SRC="filename" |
Specifies an image to be displayed on your page. Images used on web pages are typically in either GIF or JPG format.
|
<IMG SRC="ballprod.gif">
 |
| ALT="text" |
Provides an alternate description of an image for those visitors to your page who either are using a text based browser, or have "load images" off. To see how this works, turn "load images" off now, then reload this page. Notice that the bottom image has no alternate text specified. Recommended for use with all images on your page so that even if a visitor isn't viewing images, they can still get an idea of what the image represents.
|
<IMG SRC="ballprod.gif" ALT="ball">
|
WIDTH=n
HEIGHT=n
|
Specifies the size at which the image is to be drawn on your page. If the image's actual size is different from the HEIGHT and WIDTH you enter, the image will be resized to what you've specified (although possibly distorted).
NOTE: There are two major advantages to specifying HEIGHT and WIDTH for your images. The first is that doing so allows some browsers to reserve space for the image in order to facilitate faster page loading. The second is that if a visitor comes to your page with "load images" off, your page will still be formatted very similarly to what it would look like if "load images" were on. For an example of what I mean, turn "load images" off now, then reload this page. Notice how where the images should be, you'll now see a box that is the same size the image would be if "load images" were on.
|
The same image with different HEIGHT and WIDTHs specified.
|
|
No HEIGHT and WIDTH specified.
|
Actual HEIGHT and WIDTH specified.
|
|
|
Smaller HEIGHT and WIDTH specified.
|
Larger HEIGHT and WIDTH specified.
|
|
BORDER=n
|
Specifies the width of the border to be drawn around an image, where n is the width of the border in pixels. If the image is used as a clickable hyperlink, a border will be drawn around it in the appropriate link color unless BORDER=0 is specified.
NOTE: Although Mosaic does not support putting a BORDER around an image, it does support BORDER=0 on an image used as a hyperlink.
|
<IMG SRC="ballprod.gif" ALT="ball" BORDER=5>
|
Hyperlinked images, one with no BORDER specified, the other with BORDER=0.
|
|
ALIGN="left|right"
|
Glues an image to a margin so that text will flow around it.
|
<IMG SRC="ballprod.gif" ALIGN="left">
This image is aligned left. Text will wrap around the image until it reaches the bottom margin of the image.
|
<IMG SRC="ballprod.gif" ALIGN="right">
This image is aligned right. Text will wrap around the image until it reaches the bottom margin of the image.
|
|
And here's some text between one image aligned left, and one aligned right. The text will continue to display between these two image until it reaches the bottom margin of the longest image.
|
|
VSPACE=n
HSPACE=n
|
Allows you to provide extra spacing around an image, where n represents the width in pixels of the margin. VSPACE controls the margin at the top and bottom of the image, while HSPACE controls left and right margins.
|
| BR |
CLEAR="all|left|right"
|
Used to clear the margins on an image when ALIGN= is used, and allows the next line of text to begin below the image. ALL clears all margins, LEFT clears the left margin, and RIGHT clears the right margin.
|
<BR CLEAR="all">
<BR CLEAR="left">
<BR CLEAR="right">
|
Sounds
Sound Links. You can add sound links on your page for visitors to download, or to play if their browsers are set up with the audio software needed to play the different sound file formats -- .mid, .wav, .aiff, or .au. These links are manually started -- activated by the visitor simply clicking on the link. You can locate these sound links anywhere on your page between <body> and </body>.
The link HTML coding is as follows:
|
<a href="filename.mid, wav, etc">Sound Name</a> |
Both the BGSOUND and EMBED tags can be included on your HTML coded page, however, MS Internet Explorer will display a Debug and Can't Start error messages upon encountering the EMBED tag but the error messages can be cleared, allowing the use of both tags to provide BACKGROUND SOUNDS when your page is viewed.
To add midi and wav files as HTML page background sounds use the tags listed in the table below.
| HTML Tag |
Attributes (options) |
Description |
| BGSOUND |
SRC="filename"
|
Specifies a sound file that is to be played in the background when your page is loaded, and is typically located near the top of your page under the BODY tag.
NOTE: Use this tag for Prodigy Classic and Microsoft's Internet Explorer 3.0 .Works for visitors using Windows 95 and a sound card, and only if they have "load images" on.
Also be aware that some visitors will find the use of background sounds to be annoying, as there is no way to prevent the sound from playing each time the page is visited.
|
| LOOP=n|infinite |
Specifies the number of times the sound is to be repeated. If not specified, the sound plays only once when the page is loaded. When INFINITE is used, the sound will play continuously.
|
This 'basic form' will play a sound one time:
<BGSOUND SRC="mysound.mid">
This line will repeat a sound four times:
<BGSOUND SRC="mysound.mid" LOOP=4>
And this one will play a sound continuously:
<BGSOUND SRC="mysound.mid" LOOP=infinite>
|
| EMBED |
No "VISITOR" SOUND CONTROL
-- Not Recommended
SRC="filename.mid, wav, aiff, or au"
HIDDEN=TRUE
LOOP="n or TRUE"
|
Specifies a sound file that is to be played in the background when your page is loaded, and is typically located near the top of your page under the BODY tag.
HIDDEN=TRUE keeps a "Missing Image" from displaying on the page.
LOOP specifies the number of times the sound is to be repeated. If TRUE is used, the sound will play continuously.
|
For "VISITOR" SOUND CONTROL
-- RECOMMENDED
SRC="filename.mid, wav, aiff, or au"
AUTOSTART="TRUE"
LOOP="n or TRUE"
CONTROLS="SMALLCONSOLE"
HEIGHT="15" WIDTH="144"
|
Specifies a sound file that is to be played in the background when your page is loaded, and is typically located near the top of your page under the BODY tag.
LOOP specifies the number of times the sound is to be repeated. If TRUE is used, the sound will play continuously.
HEIGHT and WIDTH tags specify the size of the CONSOLE display.
|
This line will repeat a sound infinitely:
<EMBED SRC="mysound.mid" HIDDEN=TRUE LOOP="TRUE">
This line will repeat a sound four times, while providing a Start/Stop and Volume control console for the visitor:
<EMBED SRC="mysong.mid" AUTOSTART="TRUE" CONTROLS="SMALLCONSOLE" LOOP="4" HEIGHT="15" WIDTH="144">
|
|
|
