Music Tutorial
Horizontal Bar
Overview:
Music is such a great enhancement for a web site. It ads a lot to a site when viewers have the option to listen to music as they browse your site. We'll run over the two techniques to add background music to your web site in this tutorial. Let's get started, shall we? ...
Horizontal Bar
Background Music: The Basics ~~ Internet Explorer Background Music
Universal Background Music Code ~~ In Summary
Horizontal Bar
The Basics of Background Music:
When it comes to background music on the internet, you're mainly going to be talking about MIDI (Music Instrument Digital Interface) files. You can find these types of music files all over the net by doing a search on a search engine. A lot of MIDI files aren't very high quality, but there are some that are very pleasant. Quality can also depend on your computer system's sound card type, and speaker system. To help you better understand music on the internet, here's a list of basics that should help you out...
  • The majority of background files are indeed MIDI files.
  • WAV files *can* be used in the HTML coding for music, but it's not common at all. This is due to the large amount of time it takes for these puppies to download. WAV files are usually large in size, and when it comes to the net, the smaller the file size is, the faster you get what you want. Therefore, I wouldn't recommend using a WAV file, unless you really want to wait a while for it to download.
  • Real Audio files, as well as other less used music files are also available, but my fav is still MIDI files, because they load very quickly and still have good quality with a good sound card and speaker system.
  • There are actually two types of code you can use to get music to play for you. One will only work on Internet Explorer browsers, while one is universal, meaning it will work on both Netscape and IE, as well as other smaller, less used browsers.
  • While music might be wonderful for *you*, some people dislike it (heaven forbid!). Therefore, it's best that you find a way to let your viewers disable it. If you read on down, you'll find out how you can accomplish this, and keep everyone happy.
Back to Top
Horizontal Bar
Background Music for Internet Explorer Browsers:
This is the first of two techniques to place background music on your web site. Please note that the codes below will only work on Internet Explorer browsers! For some reason, Netscape wasn't programmed to understand what this code means, and instead of nice music, you'll get silence. If you're interested in code that will work with *both* browsers (recommended), cruise on down and you'll find the "Universal Code" for background music. As for IE, here's what you'll need...
Horizontal Bar
The Commands:
<BGSOUND SRC="musicfile.mid">
The above code will add background music to your web site. By default, the music is set to play only one time through. If you wish to have it play indefinitely, or for a certain number of times, use *this* code:
<BGSOUND SRC="musicfile.mid" LOOP="infinite">
That code will play the music file an infinite number of times. If you wanted it to actually play a certain number of times, rather than for infinite, type a number in place of the word "infinite", and it'll play that number of times. It's as simple as that!
Back to Top
Horizontal Bar
Universal Background Music Code:
This is a bit more advanced than the previous code. It play the background music, but it will also place a small control box on your site so that your viewers can turn it off, adjust volume, etc. It's a pretty neat little piece of code here! I'll be explaining this one after I display it so that you know what's going on. If you get confused, e-mail me with what you're having trouble with, and I'll guide you through it if needed. Anyhow, here ya have it! ...
Horizontal Bar
The Commands:
<EMBED BGSOUND SRC="musicfile.mid" CONTROLS="small console" HEIGHT="55" WIDTH="200" AUTOSTART="false" LOOP="true" VOLUME="75%">
The Results:
Back to Top
Horizontal Bar
Note: The code above should all appear on one line. The page isn't wide enough to display the entire code across one line, but it *should* appear that way in your editor. Just so you know...
Horizontal Bar
The Above in Plain English
So, did I officially confuse you with all that stuff? If so, never fear...here's what every bit of that means:
  • <EMBED BGSOUND SRC="musicfile.mid": As you might have already guessed, this starts off the code. That's obvious, but what does it mean? Well, EMBED is a code that originated from the good people at Netscape. This is required for Netscape browsers to read the music code...that's why the code further up was only for Internet Explorer browsers...because it didn't contain the EMBED parameter. Make sense? So, this let's the Netscape browser know that the music file needs to be played. BGSOUND is the parameter that lets *IE* browsers know that it needs to play a music file. Remember from the code up there? This is actually what makes the code universal...because it has *both* Netscape and Internet Explorer commands in it. Cool huh? SRC tells the browser where to go and get the music file.
  • CONTROLS="small console": Tells the browser that it needs to display a "small control console" on the page. The console will include the Play, Pause, and Stop buttons, and *also* may include other buttons such as Fast Forward, Rewind, etc. depending on your default music player.
  • WIDTH="200" HEIGHT="55": This defines how big the console should be. Therefore, you can probably guess that the bigger the numbers are in each, the bigger the console will be. If you would like no console to be displayed at all, set the height and width to "0" and it will display nothing on the page.
  • AUTOSTART="false": This defines whether your music will start playing automatically when the browser loads that part of the page or not. If you were to set it to AUTOSTART="true" it would automatically start playing. If you were to use the height="0" and width="0", then you want to set this to true...Otherwise, there won't be any music, because the viewer will have to physically click the "Play" button if it's set to false. If there's no console, they can't press play, which leads to silence. :( Therefore, set it to true if you choose not to display the console, or if you just decide you want it to automatically play.
  • LOOP="true" VOLUME="75%">: The LOOP parameter tells the browser whether the music is to play continuously, or not. If you were to set it to false, it would play once through and then stop. Leaving it as true will make the music play repeatedly, or until the viewer got tired and hits the Stop button. The VOLUME parameter sets how loud the music will be. It's best to define this in percents. 75 percent is a pretty good setting. You can, of course, set this to whatever you'd like.
Back to Top
Horizontal Bar
In Summary:
Music is a great enhancement for your web site. It's best if you use the console method so that your viewers can turn it off when they feel like it. It'll make them a lot happier than if they can't stop it when they want, know what I mean? With that said, this is the end of the music tutorial!
Back to Top
Horizontal Bar
Back to Home

1