Adding sound into a web page
|Mp3, Music and Audio||Price|
|eMusic.com - Get 25 FREE MP3s! Choose from over 1.7 Million songs! Works on any MP3 player, including the iPod®!||Free Trial|
|RealPlayer Rhapsody - Unrestricted access to the entire 3,000,000+ song with complete music jukebox software||Free Trial|
|Riptopia.com - Convert your music CD's to digital files for your iPod or Media Center||$0.99|
There are a lot of cool features in today’s music players, and then there’s something called quality, sometimes. Hopefully, the recommendations from Tips-Tricks.com will help you make a well guided choice.
There are two tags for adding sound to your document, Internet Explorer 3.0's <BGSOUND> tag and Netscape's <EMBED> tag. The <BGSOUND> play the background sound from your page. That is when visitor visit your page, the sound will automatically play. Netscape's <EMBED> tag is slightly different, you can use its attribute to select playing sound when the page is loaded or give the users an option to click whether they would like to hear the sound. The sound console will appear in their page like this. (Sound console will appear below, if you're using Netscape)
Listen to Groovy
Listen to Jazzy
You are exciting to know now how to do it, right? In this example, I use midi file because it give a high quality sound. I will tell you about other format later on this page.
Here is how to use an
<EMBED SRC=your_file.mid AUTOSTART=true WIDTH=144 HEIGHT=60 LOOP=1>
AUTOSTART=true means automatically play sound when document is loaded. This way, the sound will play as a background sound. You can also set the value to false. The sound will play when the "play" button is clicked.
LOOP=n This tells browser how many times to play sound.
n could be an integer, true, or false. Setting LOOP=true, browser will continue playing your sound until the stop button on the console is clicked.
HEIGHT This is how the sound control (console) will be displayed. Setting them as the given numbers, browsers will display a full console. Setting the
height=2, the console will not displayed by the browsers. Other values that too small will cause the browsers
display uncompleted image. You might also hide it by placing
HIDDEN=true like this:
<EMBED SRC=your_file.mid AUTOSTART=true HIDDEN=true LOOP=1>
It's a good idea to give an alternative to people who using browsers that do not support the embedded sound. Here is what I did on this page:
<embed src="bgsound.mid" hidden="true" autostart="true"
<noembed>Your browser doesn't support EMBED, but you can still listen to the background sound of this page by<a href="bgsound.mid"> clicking here.</a></noembed>
Browsers that do not support
EMBED will display the link inside
Here is how to use
<BGSOUND SRC=your_file.mid LOOP=1>
LOOP can be specified as any positive number, infinite, or -1 which equals infinite.
Now, I would like to tell you something.
The differences of two browsers brought headaches to us. I would like to correct what I described here in last version of this page. You'd better use both
<BGSOUND> tags to make sure that visitors get background sound.
Internet Explorer does not support
<EMBED> tag directly, but it does support plugins that installed by Netscape. The users of Internet Explorer 3.0 or higher will hear the sound from
<EMBED> if they also have Netscape 3.0 installed in their machine. In this case, If there are both tags in the documents, Explorer take
<BGSOUND> tag active but will report the error of cannot playing sound that resides in the
<EMBED> tag. This is a disadvantage of putting both tags together.
|Web Site Builder||Price|
Web site builders come in different flavors and at different prices. We have collected a list of favorites for you, but of course your personal choice will be dictated by your specific needs.
The error tag will be something like:
Anyway, these boxes are not a big deal, users can click "OK" to process to the next step. I recommend using both tags to make sure that your visitors will surely hear background sound. If you're planning for giving the option for users to click from the sound console to hear sound, you only have one alternative -- using
Tips for people who installed Netscape 4.0 on the machine that have Internet Explorer installed:
Netscape 4.0 will disable your plugins installed by its previous version. If you have IE installed in your system, IE will no longer be able to play midi file (in case that IE shared plugins with Netscape). You'd better back up the plugins previously installed by Netscape 3.0 and copy them back to plugins directory. If you have IE installed, you can use those files in IE's plugins directory.
What file formats can I include in my pages?
<EMBED> tag plays audio files in WAV, AIFF, AU, and MIDI formats.
- MIDI (.mid) format give you a high quality of digital sound.
- WAV (.wav) format was developed for used with Microsoft's Window. You can record .wav using Windows. The sound quality is not as good as MIDI, but the file is smaller.
- AU (.au) was developed by Sun. The sound quality is poor, but the file is quite small, used for recording short speech.
- AIFF (.aiff) was developed by Apple for music and high quality sound.
The most popular is MIDI for music and WAV for short message. If you own a PC running Windows, you are ready to plug a microphone and start recording.
There are many sources to get MIDI. I would recommend you go to XG Song Library. This site has many great MIDI songs developed by people at Yamaha Corp., Japan.
If you are seriously to put sound on your page, or you're maybe thinking about developing music site. Here are the tools and the place to visit.
- RealAudio - RealAudio plays sound before the total file completely loaded. So, it's fast, but the speed compensates for the moderate sound quality. If you want to put a sample of song on your web pages, or even audio broadcasting, RealAudio is a very popular tool.
- Cakewalk Pro Audio 6.0- Professional MIDI editing
- Liquifier Pro- Provides a professional mastering environment to optimally prepare audio for Internet.