Vol. 1, No. 20
Sound on Your Site

At some point during your fruitful Web-surfing career, you've no doubt stumbled across a Web site offering the tinny, Muzak-esque sounds of Musical Instrument Digital Interface (MIDI) files. MIDI (pronounced "middy") was originally designed as a standard by which synthesizers could talk to each other, as well as to computers. On the Web, it's most commonly used in that familiar musical format — as small, canned files. It is an extremely efficient format, because it's not a recording of all of a song's nuances, which can include surface hiss, guitar feedback, or vocals. Rather, it's a list of notes that are played by the visiting computer's sound card, using its pre-programmed tones (typically innocuous, piano-like sounds).

Sure, the format is cheesy in a certain sense, but it's great if the notes themselves are all you want to get across. And you'll find that the little ditties can become highly addictive once you start seeking them out. There's nothing like hearing a MIDIfied version of a song whose subtleties of tone you once loved. Here's how to get your site to play MIDI songs.

First, of course, you'll need to get a MIDI file. You can create one with music software (a task that's out of the scope of this newsletter), or you can simply find a public-domain file on the Web. The MIDI Search Engine is an excellent place to start. Upload the file, with a .MID extension, to your site. Then you need to call the file from within your page. There are two ways to do this.

The easy, nonintrusive way is to simply link to the file, as you would any other file:

<A HREF="songs/frograin.mid">Frog Rain</A>

The other method is to use the EMBED tag. This enables the song to load and automatically play when the page is loaded. It is used similarly to the IMG tag:

<EMBED SRC="/songs/fatherfigure.mid">

Different browsers, as any good builder knows, behave somewhat differently, but typically a pause/play button, a stop button, and a volume slider will appear, allowing your visitors a more efficient form of relief than would earplugs. The EMBED tag has attributes that can control that toolbar. Height and width attributes set the size of the audio control, while the "hidden" command hides it. This tag will produce a small toolbar:

<EMBED SRC="/songs/fatherfigure.mid" height="10" width="40">

This command will hide the control entirely, making your MIDI an unstoppable force of nature:

<EMBED SRC="/songs/fatherfigure.mid" hidden="true">

For true power (pun intended), you can to add the following attributes as well:

<EMBED SRC="/songs/fatherfigure.mid" hidden="true" autostart="true" loop="true">

These commands cause the song to start automatically, loop indefinitely, and offer no way for the user to stop the music. All the poor, wretched listener can do is kill the volume manually, or leave the page. Think twice before going to this extreme.

In some browsers, the audio toolbar can also be configured with the "controls" attribute. The attribute of "console" (written as: controls="console") will display a normal-sized toolbar, while "smallconsole" will display a much smaller toolbar. A controls value of "playbutton," "pausebutton," "stopbutton," or "volumelever" will display only that particular element, instead of the entire toolbar.

By the way, the EMBED tag also works for other types of sound files, such as AIFF, WAV, and AU, as well as a variety of other multimedia types, many of which require external plug-ins to play. AIFF and WAV files typically have very good sound quality, but take up a great deal of space. You're better off sticking to the charming chiming of MIDIs.

HINTS, POINTERS, AND TIPS 'O THE TRADE:

Please bear in mind that the annoying, repetitive sound that can't be switched off, which you sadistically plastered onto your site, is not going to win you many repeat visitors, unless it's some kind of masochism- oriented or dentistry-simulation site.

MIDI files can sound fairly different from computer to computer, depending on what sound card the computer is using. It's not a bad idea to check out how your file sounds, not just with different browsers, but also on a few different machines, if possible. Of course, if it's a very specific sound you're going for, MIDI may not be the right format for you.

Want a homework assignment? Write a little JavaScript-jukebox script that will play a random MIDI file, chosen from a list, every time a page is visited.

RESOURCES:

Cakewalk

The MIDI Farm

Harmony Central: MIDI Tools and Resources

MIDI Search Engine

Webmonkey: Introduction to MIDI

Handcrafted Archive