View Cart | License | Blog | Contact
Web site music - how to get mp3, WAV or MIDI music to play on your web site

Option 1: Embed the music file.

The simple and basic way to put music on a web site is to simply put the following into the HTML code of your web site:

<EMBED SRC="your_sound_file" HIDDEN=true AUTOSTART=true>
<NOEMBED><BGSOUND SRC="your_sound_file"></NOEMBED>

Where your_sound_file is the name of your WAV, MP3, or MIDI file.

The first line, the one that begins with EMBED, is the one that will be read by most web browsers. So in most cases, your visitors' web browser will see the EMBED line, react to it, and then ignore the NOEMBED line.

A few web browsers (very few now) do not support the EMBED command, which is why the second line is added. The second line, beginning with NOEMBED, is an optional extra that will kick in if the web site is read by a browser that does not support the EMBED feature.

That means that even if you drop the second line out and only include the first line, the music will still work for about 95% of your visitors.

Before you do this however, it's probably a good idea to change the bit-rate of the mp3 file. Mp3 is a file format that lets you choose your own balance between sound quality and file size. The smaller you want to make your sound file, the lower you have to put the sound quality.


When you purchase an mp3 file from us, you get it in a bit-rate of 192 kbps (kilo-bytes per second) bit-rate. This represents perfect CD-quality audio, but the file is pretty big. And because the file is big, there is a lot of data that has to be transferred over the internet before your web site visitors will start to hear the music. And when the music starts to play, it may break up, stutter, and start-stop, simply because there is such a large amount of data that has to keep transferring from your web site to your visitor's computer, and when the data isn't flowing fast enough the sound will break up.

So -- before you put the music on your web site, it's a good idea to lower this bit-rate to something like 32 kbps or maybe 56 kbps. That will drastically reduce the size of the file, but it will also lower the sound quality. At 56 kbps the sound quality will be similar to the previews on our web site (we use 56 kbps mp3-encoding for all our previews), and at 32 kbps sound quality will be lower, but still pretty acceptable.

We can help you with changing the bit-rate of the sound files for you. We have advanced tools that allows us to do this fast -- it literally only takes us a minute to change the bit-rate of multiple sound files, and we are happy to do this for our customers, free of charge. Just place your order as normal, and then ask us to change the bit-rate to whatever you want (32 kbps is usually okay for web site use).

Should you wish to play around with the sound files yourself and change the bit-rate of your mp3 files, you need a sound editing tool, such as the free Audacity or similar.


Option 2: Use Flash.

Another way to put music on your web site is to use the Flash program from Macromedia. This is what we use for the "previews" of our music here on Shockwave-Sound. This procedure is more complicated, but it has it's clear advantages.

In our previews here at Shockwave-Sound, you'll notice that the music starts playing almost immediately. The reasons are (1) Flash compresses the music, so that there is less data to transfer from the server to the visitor's browser, and (2) The music can start playing as soon as some of it has been loaded into the visitor's browser, and the music will start to play from the beginning, whilst the rest of the music is still loading.

The actual procedure of inserting sound and music into a Flash presentation is very well documented in Flash's built-in help documentation. There is a chapter there called "Working with sound" and I recommend you read it.

One important aspect of working with music in Flash is to know the difference between a sound "event" and a sound "stream". To put it simply, an "event" has to download the whole sound to the visitor's browser before any sound is played. A "stream" only loads the beginning of the sound, then it starts to play whilst the rest of it is still loading. So for background music, "stream" is the best solution.


Another important aspect about using music in Flash is to select the best compression level. While working with your Flash, go to "File, Publish Settings" and check the "Audio stream" setting. Here you can set the level of compression used on the music. Harder compression means smaller file, shorter loading time, but lower sound quality. Softer compression gives you higher sound quality, but more data has to be streamed from your server to the visitor's browser, so if the visitor has a slow connection, the sound may stutter and break up - or take a long time before it starts to play. This is a trade-off between sound quality and speed/reliability of the delivery.

Personally I recommend a setting of "MP3, 32 kbps, stereo". It may be tempting to go with a higher kbps ratio and use mono to save space - but I recommend you use stereo. Mono is perfectly okay for button sounds etc., but for music I definitely recommend stereo, even if it means you have to go to a lower kbps ratio. Stereo delivery of music is very important to the total impression to the human ears and brain. Never deliver music in mono.

Other articles you may find useful:
Asset Management: How to keep track of sound clips using metadata and cataloguing. Three ways to build a sound library: Record sounds yourself, or find another way. Timeline of classical composers: Get an overview of the lives and times of classical music maestros. Depth and space in the mix, part 1: How to use reverb, pre-delay, EQ and delay to make your mix better. Depth and space in the mix, part 2: Further tips on improving the sound of your productions. Maximizing composer agreements: How you as a composer for games and other media can get the best out of the contract.
Writing music for games, part 1: Video games composer Kole on some issues to keep in mind. Writing music for games, part 2: Kole dissects another video game music project. Writing music for games, part 3: Finding a way to compose music for Facebook games and stay within the boundaries. Writing music for games, part 4: How to make the most of what little resources you have available.   Music Production hardware and software tips, part 1: Important issues you need to consider when selecting your tools, computer, CPU, RAM, software etc.
Ideas for creating unique musical colours: Tips to try to make it sound and feel 'different' Choosing the right classical music, part 1: We recommend 10 pieces of bombastic, powerful, awe inspiring classical music. Choosing the right classical music, part 2: In this part we recommend 10 beautiful, soft, heavenly and emotional classical music tracks      



[Switch to Classic Navigation]