Click to skip over navigation

Web Design

   

online audio



main menus


help pages


Valid XHTML 1.0!

 

To repeat the warning which appeared on the page about online video; this page describes web design technologies that you won't be able to fully exploit without further investment in actual software, and the tuition needed to use it. But for those that are intending to move into these areas, here are some basic pointers. Don't treat this as anything like a definitive guide.

Why might you want to place audio files on your web site? Well, as described briefly on the page about non-HTML and special links, this can either be garnish, or an integral part of the site. "Garnish" sounds can be things like audible greetings, noises (maybe when you push a button, or as part of some web-based game), or background noises/music. "Integral" sounds are when your site is being specifically designed to present these. An increasingly common example of this is when budding bands use their web site as a "demo tape".

Much of what applies to placing sounds on a web site is the same as for video files - this goes both for the tags and technologies required, and the warnings about their use. Audio files either have to download completely before they're played, or they can be "streamed". Audio files are generally quite large (though see the note about .mid files below). Don't ever force a user to download a very big file automatically, especially when they might not have the relevant plug-in and/or any desire to hear the file in the first place. Anyone who's spent much time in a hold queue on the phone should realise that some endlessly-looping rinky-dink piece of Muzak can make people feel like punching holes in the wall, so be especially careful with things like "background music". If possible, prevent the sound from looping endlessly; only use this for "ambient" sounds (sounds for atmosphere, like the sounds of waves, or other effects like footsteps - these could be quite effective if used appropriately). If giving people the choice to download a music or sound file, always let them know how big the file is in kilo- or mega-bytes.

Incidentally if you want to use a background sound on a page use the attribute, bgsound in the <body> tag. Obviously, this then takes the value of the file name of the sound file. I don't think you can do this yet with style sheets, at least not in ways all browsers recommend; leave it with me...

A common audio file formats is .wav, which used to be the standard Windows sound format. You are now more likely to see the MPEG format, particularly .mp3 files. These have achieved some notoriety recently as the file format most directly implicated in the court cases over Napster, the "music-swapping" site that has effectively been closed down by recording companies worried about copyright violations. (The new "Napster" is nothing to do with peer-to-peer and everything to do with siphoning more and more profits into already bloated corporations.) This should make you remember that many sound files are someone's "intellectual property", so be careful what you actually put on your site. There are some sites which offer sounds and effects for free, however, on the same basis as for background images or icons; try putting "Sound Effects" into Google.

It's worth mentioning the MIDI file format (extension .mid), however. The MIDI format was designed for synthesisers, and rather than "digitising" sounds in the way of CDs, it passes instructions to synthesiser software in a completely different manner. You can't, therefore, replicate voices or other "organic" sounds, but you could probably manage most of Kraftwerk's back catalogue using MIDIs, and any other bleeps or boinks you might desire. The big advantage of MIDI files is that they are considerably smaller than other formats; up to 1,000 times smaller, in fact. A minute of MIDI music can come in as small as 10K, rather than 10Mb for a .wav file.

LINKS

Some links follow for the interested. As usual, no direct endorsement of any of these is implied, and if you choose to hand over any money for a service or product, you do so at your own risk.

Digital Kitchen. Can supply sound effect files.

QuickTime; a piece of freeware to get you started on sound manipulation. Originally for the Mac but now also available for Windows.

MPEG site.

RealNetworks: streaming audio (and video) technology.

Liquid Music: state of the art web audio technology.

Back to the top

Back to the menu of other topics



Material on this site is © Drew Whitworth, 2005 Permission will usually be given to reproduce material from this site for non-commercial purposes, if credit is given. For enquiries, e-mail Drew at andrew [dot] whitworth [at] manchester [dot] ac [dot] uk.