O'Reilly logo

Designing Web Audio & CD-ROM by Dylan Thede, Josh Beggs

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Two easy ways to add sound

To add a simple background sound ( .wav or .mid ) file to your web page, include the tags listed below: BGSOUND or EMBED. These tags are the bare minimum you need to get audio running on a web page. For anything more complex than simple playback or looping, you will need to use a plug-in-based solution such as Flash or RealAudio. The BGSOUND and EMBED tags are browser-specific and are used to ensure playback over both Netscape and Internet Explorer browsers. Internet Explorer reads the BGSOUND tag while Netscape reads the EMBED tag.

Adding a simple background sound

Here is some HTML to add a background sound to your page. The sound will begin playing as soon as the file has downloaded. This can be annoying, so use it judiciously.

<BGSOUND SRC="yoursound.wav">
<EMBED SRC="yoursound.wav" HIDDEN="TRUE" AUTOSTART="TRUE"></EMBED>

If you wish to loop the sound and provide a name for the sound link, use the following code:

<BGSOUND="yoursound.wav" NAME="MySound" HIDDEN="TRUE" LOOP="TRUE" 
    AUTOSTART="TRUE">
<EMBED SRC="yoursound.wav" HIDDEN="TRUE" LOOP="TRUE"
    AUTOSTART="TRUE"></EMBED>

If you want the player console with volume control to be visible during playback, use the following tag (Netscape only):

<EMBED SRC="yoursound.wav" VOLUME="50" WIDTH="144" HEIGHT="60"
    CONTROLS="console"></EMBED>

Not all web sound has to be elaborate or complicated. A simple music loop or navigation button sound effect can enhance your site and make it a more engaging experience for the user. The following two sections discuss sound elements you can add right away, plus the scripts to get you started.

Adding a looping music soundtrack

With a looped soundtrack, you can create the right atmosphere for your site. Consider this tactic from Broderbund: as diehard Myst players awaited the sequel to Riven, the company put up a web site as a teaser. The “Riven Journals” gave users a preview of the upcoming product (or, rather, kept them at bay) while throughout the site a haunting music loop echoed the look and feel of the game to good effect.

To add a simple background sound file to your web page, include this tag:

<BODY BGSOUND="yoursound.wav">

If BGSOUND does not work with Internet Explorer, try this:

<CENTER><EMBED SRC="name.mid" AUTOSTART="TRUE" WIDTH="144" 
    HEIGHT="56" LOOP="5"></CENTER>

You may use a .mid or .wav file as well. Similarly, if you wish to loop the sound, first provide a name for the link, then hide or show the browser’s default player/plug-in, and set the file to autostart playback. You may set those parameters using the following code:

<BGSOUND="yoursound.au" NAME="click" HIDDEN="TRUE" LOOP="FALSE"
    AUTOSTART="TRUE">

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required