Lesson 7 -- Printer Friendly Version

INSTRUCTIONS:

To print this lesson exactly as it appears on your screen, wait a minute or two for the entire page to load. The download should not be considered complete until you see the copyright notice at the bottom of the page. Once the document is ready to print, simply click your browser's File menu and choose Print.
To save a text-only version of this lesson, click your browser's File menu and choose Save As. Select a disk drive and folder to receive the file, and change the name of the file to less7.htm To view the file while you are offline, just go to the drive and folder you selected when you saved the file and double-click the file named less7.htm. Your browser will start and you will have access to the file.
If you use the Microsoft Internet Explorer browser and the Microsoft Outlook mail program, you can e-mail a text-only version of this file to yourself. To do so, click the File menu, choose Send, and then select Page by e-mail.

IMPORTANT: This version of your lesson is for saving or printing only. All links and images have been disabled to decrease download time and help you avoid printer difficulties.

Chapter 1

Both Netscape Navigator 3.0 (or better) and the Microsoft Internet Explorer 3.01 (or better) offer full support for audio on a web page. However, there are two caveats:
1. In order to hear sound, people who visit an audio-enhanced web page must either have a sound driver for their internal speaker or a sound card (such as Creative Labs' SoundBlaster) and a pair of external speakers.

2. The sound file must be saved in one of these three audio formats:

WAV - wav files are very popular in the Windows environment. Some newer Macs will support WAV files as well. All it takes to create a WAV file is the Windows sound recorder (in the 'Accessories' program group) and a microphone. WAV files offer CD-quality sound, but tend to have fairly large file sizes. This type of file is usually used to add sound effects, short snippets of dialogue, or brief music samples to a web page.

AU - AU files work with virtually any type of computer- -Windows machines, Macs, and UNIX boxes can all play AU files. AU files also have fairly small file sizes, so they download quickly. Unfortunately, the quality of AU files is fairly poor. AU files are usually used with spoken word samples 1 minute or longer.

MIDI - Musical Instrument Digital Interface files are musical compositions created with a synthesizer, sequencer, or rhythm machine that has been attached to a personal computer. MIDI file sizes are usually very small, but sound machine-generated. If you'd like more information on producing MIDI files, visit Harmony Central at

http://www.harmony-central.com/MIDI/

or Charles Belov's Cross-Browser background music tips page at

http://www.cabelov.com/midi/midi.shtml

Chapter 2

A fourth audio format called 'Streaming Audio' is also widely used on the Web, even though both Netscape Navigator and the Microsoft Internet Explorer do not yet support that format. Streaming audio files offer slightly better audio quality than AU files, but they play audio with very little delay. This is because the listener does not wait for the entire audio file to be downloaded before they can hear it.
With streaming audio, you wait a few seconds for the first part of the audio file to be downloaded. The audio starts to play right away no matter how large the audio file size may be. Play continues WHILE the rest of the file is downloaded, and proceeds to completion.

Streaming audio files offer a big advantage over all other audio formats. MIDI, WAV and AU files all have to be downloaded in their entirety before they will play. If you're just waiting for a short 30-40K MIDI, WAV, or AU sound file, you'll only have to wait a minute or so to hear it. But if you want to hear a large 1.8 MB music sample in any audio format other than streaming audio, you might have to wait a half hour or more for the file to be downloaded before you can hear it!

With streaming audio, the file would start playing almost immediately!

If you place a streaming audio file on a web page, people will not be able to listen to your file unless they download and install a plug-in program specially designed to handle streaming audio. There are two such programs in use today. The market leader is a product called 'RealPlayer.' You can download a free demonstration version of this product from:

http://www.real.com/

If you have the RealPlayer installed, you can listen to a working example of streaming audio. Just go to broadcast.com at the following address:

http://www.broadcast.com/

Netscape has announced its intention to incorporate the RealPlayer product in future versions of their Navigator browser. Microsoft will be inserting their own streaming audio player in future versions of the Internet Explorer. As of this writing, the Microsoft player is supposed to be compatible with the RealPlayer product.

Unfortunately, you cannot create streaming audio files unless:

1. You purchase a product called 'RealPublisher' from:

http://www.real.com/

2. Your web hosting service gives you permission to deliver streaming audio from
their server (not all servers have this capability).

However, it is very easy to deliver WAV, AU, and MIDI files over the web. Most (but not all) browsers will recognize these three audio file formats.

This lesson will concentrate on WAV, AU and MIDI files.

Chapter 3

You shouldn't have any trouble finding sources of free audio files on the web. All you have to do is go to your favorite search engine and look for "wav files" or "midi files."
Here are a few interesting sites I found:

Standard MIDI files on the net
http://www.aitech.ac.jp/~ckelly/SMF.html

John Roache's Classic Ragtime MIDI Files
http://members.aol.com/johnroache/private/classic.html

Sound FX Page
http://www.vionline.com/sound.html

Wav Central
http://wavcentral.com/effects.htm

Each of these sites have links to audio files. Click the link, and if you have the necessary hardware and software, the sound file will be downloaded and played for you.

If you decide you'd like to keep the sound file, point your mouse at the link and click your right mouse button (Mac users, hold down the mouse button). A menu will pop up, listing (among other things) an option to save the sound file targeted by the link. Click the 'Save' option and place the file on the same drive and in the same folder as your HTML files.

Be careful to avoid downloading files that may be copyrighted, especially with music. While you won't have to worry about Beethoven or Vivaldi or other artists whose works have slipped into the public domain, you should avoid using works of more recent vintage. Read the pages containing the sound files carefully! Make sure you meet all conditions for use. Using a copyrighted sound file on your web page without written permission is a violation of Federal law and could subject you to a lawsuit and criminal penalties.

Chapter 4

If you want people to be able to listen to audio from a web page, I recommend creating a link to the audio file.
People who want to listen to your sound file can click the link. Those who don't have the needed equipment or don't want to wait for the file to download can ignore the link. Everybody's happy!

Building a link to an audio file is very similar to creating a link to a web page.

You simply use the <A> tag to create the link. Suppose you'd like to link to an audio file named 'monolog.wav.'

All you have to do is make sure the audio file is sitting on the same drive and in the same folder as your HTML file. Then, just insert the following tags anywhere in the <BODY> of your HTML file:
 <A HREF="monolog.wav">Listen</A> to the author.
The tags above will turn the word 'Listen' into a link. When a visitor who uses Netscape Navigator 3.0 (or greater) or Microsoft Internet Explorer 3.0 (or greater) clicks on the word 'Listen,' the browser's audio player will pop up and play the sound file named 'monolog.wav'

You can also create links to MIDI files and AU files in the same fashion. Just substitute the audio file's name for 'monolog.wav' in the example above.

Chapter 5

It is possible to serenade visitors to your web page with background music. Although this may at first seem like a wonderful idea, do exercise some caution before proceeding.
First of all, don't loop your sound file so it repeats over and over again. Let it play once and stop. Most people regard looping audio as an irritant.

Initially, it's somewhat cool--an unexpected surprise. But then the song repeats itself again. And again. It isn't long before it gets tiresome. Ask yourself: would you want to listen to the same short tune play itself over and over again? Or would you want to run screaming from the room by the third rep?

Another reason not to use background sounds: people who don't have sound cards may see an error message when their browser tries to load your sound-filled page. In some cases, background sound files have been known to crash certain browsers.

If you decide that you absolutely must use a background sound, stick with MIDI files for your background audio.

Although WAV files have vastly superior quality, the file sizes can get immense pretty quickly. A 15 second WAV file might reach a megabyte or two in size. It would probably take so long to download that most people will have left your page before they even got a chance to hear the file.

A 30 to 45 second MIDI file, on the other hand, might only be 20 to 30 kilobytes in size. Such a file would download as quickly as the images on your page.

Due to differences between the two leading browsers, those of you who want to use background audio will need to insert two different tags into your HTML file.

-Background Audio and Netscape Navigator-

The Netscape Navigator version 3.0 (or greater) uses the EMBED tag for background sound. This tag can have four parameters:

-src This parameter is used to specify the name of the audio file. It can be a MIDI file (recommended), a WAV file, or an AU file.

-hidden When the Netscape Navigator needs to play an audio file, it fires up a program known as the 'Netscape Audio Player.' The Netscape Audio Player comes with a stop button that can be used to stop the music and a play button that can be used to restart it. Setting the 'hidden' parameter to 'false' will make the Netscape Audio Player a visible entity on your web page.

If you'd rather not clutter up your page with the Player and its controls, set this parameter to 'true.'

-autostart This parameter must be set to 'true' if you want the music to start automatically. If you set the value to 'false,' the music will not play unless the visitor clicks the 'play' button on the Netscape Audio player. Be sure not to hide the Netscape Audio Player if you're going to set this to false. I recommend setting the autostart parameter to true.

-loop This parameter allows you to indicate whether you'd like the audio clip to play once and then stop (loop="false") or to repeat the song over and over again (loop="true"). As I mentioned before, I recommend you set this parameter to 'false.'

Here's an example. Suppose you'd like a MIDI file named 'bach.mid' to play automatically when somebody visits your web page. You don't want the Netscape audio player to be visible, and you want the song to play once and stop.

To accomplish all of the above, make sure the sound file is saved in the same drive and directory as your web page. Then, simply insert the following tag anywhere in the <BODY> of your HTML file:
 <embed src="bach.mid" hidden="true"  autostart="true" loop="false">
-Background Audio and Internet Explorer-

Unfortunately, some versions of the Microsoft Internet Explorer may not play music in response to the <embed> tag. Instead, some versions of the Internet Explorer require that you use a BGSOUND tag. This tag has two parameters:

-src This parameter is used to specify the name of the audio file. It can be a MIDI file (recommended), a WAV file, or an .au file.

-loop This parameter allows you to indicate whether you'd like the audio clip to play once and then stop (loop="1") or to repeat the song over and over again (loop="infinite"). I recommend you set this parameter to '1' (that's the number 'one') so the sound doesn't repeat.

For example, suppose you want a MIDI file named 'bach.mid' to play automatically when somebody visits your web page. You want the file to play once and stop.

To accomplish this, make sure the sound file is saved in the same drive and directory as your web page. Then, simply insert the following tag anywhere in the <BODY> of your HTML file:
 <bgsound src="bach.mid" LOOP="1">
-Background Audio in Both Browsers-

Although the Netscape Navigator is the most popular browser in use today, a fairly sizeable percentage of websurfers do use the Internet Explorer.

Therefore, if you want as many people as possible to hear your background sound, you will need to incorporate both the EMBED tag (for Netscape users) AND the BGSOUND tag (for Internet Explorer users) into your HTML file.

Netscape will ignore the <bgsound> tag and respond to the EMBED tag.

Internet Explorer will ignore the <embed> tag and respond to the <bgsound> tag.

If you use both tags, both browsers will generate sound.

Note: a bug in version 3.0 of the Internet Explorer causes it to display a brief error message when it encounters both <embed> and <bgsound> tags on ONE web page. The error message does not seem to interfere with Internet Explorer's ability to play sound specified in <bgsound>, however. There are no similar problems with the Netscape Navigator or the current version of Internet Explorer.

For example, if you'd like to play a sound file named 'bach.mid' on a web page that will be viewed with both the Netscape Navigator and the Microsoft Internet Explorer, you should include the following in the BODY of your HTML:
 <embed src="bach.mid" hidden="true"  autostart="true" loop="false">   
<bgsound src="bach.mid" LOOP="1">

Chapter 6

-Quiz 7-
When you feel you have a grasp on all of the concepts taught within this lesson, I would like you to take a short, multiple choice quiz. To get to the quiz, click on 'Quizzes' on the menu bar. When the form comes up, input your last name, e-mail address, and password, and make sure you have 'Quiz 7' selected. Good luck!

-Assignment E-

Click here to preview the page that we'll be creating in this assignment. Click on the 'Assignments' link at the top of this page. When the 'Assignments' page appears, click fill out the form with your name, e-mail address, and password, and click on Assignment E. Then, click on the 'Submit' button. A form will appear with numbered text boxes. Fill in each line of code exactly as specified below. When you're typing a tag that contains multiple parameters, please include the parameters in the order specified in the directions below. When you're done, click on the 'Validate' button and your assignment will be validated for accuracy.

Line 1 - Type a tag that opens up your HTML document.

Line 2 - Type a tag that starts the BODY portion of your HTML document.

Line 3 - Type a tag that will create a center aligned paragraph.

Line 4 - Type the <FONT> tag. Include parameters so that the size of the font is set to "5" and so that the color of the font is set to "#000066."

Line 5 - Type the following text:

Click on the whistle

Line 6 - Close the <FONT> tag.

Line 7 - Type a tag that will insert a line break into your HTML document.

Line 8 - Type a tag that will create a link to the file 'whistle.wav.'

Line 9 - Type a tag that will insert the image 'whistle.gif.' The image should have no border.

Line 10 - Close the tag used to create the link to the file 'whistle.wav.'

Line 11 - Type a tag that will close your paragraph.

Line 12 - Type a tag that will close the BODY portion of your page.

Line 13 - Type a tag that will close your HTML document.

Remember to click on the 'Validate' button after you've typed in all 13 lines.

IMPORTANT: This version of your lesson is for saving or printing only. All links and images have been disabled to decrease download time and help you avoid printer difficulties. Do NOT attempt to click any of the links on this page.