Music and sounds

Talk about HTML resources, styles etc.
Post Reply
User avatar
JimBb
Deep Thought
Posts: 1964
Joined: Sun Nov 16, 2003 8:19 pm
Location: Dilbeek, Belgium
Contact:

Music and sounds

Post by JimBb » Sun Feb 13, 2005 1:54 pm

There are two ways you can link to a music-file: as a link, or as background music.

In any case you have to upload your music file to your site. What kind of files? Theoretically: anything. In practice...:
  • *.mid: smallest files, fastest loading time, lowest quality
  • *.wav: largest files, slowest loading time, highest quality
  • *.mp3: medium size files, medium load time, highest quality
But there's more to it than that: not every webhost allows every kind of file. Since mp3 is often used to illegally transfer copyrighted material, some hosts don't allow this filetype.
And then there is the matter of size. An mp3 file typically is hundreds of KB, up to a few MB. As a link that is okay, but as a background sound the people with dial-up modems will be ready to strangle you. For a background sound a *.mid file is a better choice.

And then the first way of linking to it: just with a regular link:

Code: Select all

<a href="yourfile.mid">Click here to download my latest hit!</a> 
As always, remember that yourfile.mid is not the same as Yourfile.mid or YOURFILE.MID or yourfile.MID, for a webserver they are all different files. The result will be fairly common: Click here to download my latest hit! (the link doesn't work, don't bother clicking it unless you like looking at error messages ;))

But I guess most people are interested in a background sound:

Code: Select all

<embed src="yourfile.mid">
Simple, isn't it? Where do you put this? Anywhere between the <body> and </body> tags, but it's best to put this "low" on your page: that way most of the other stuff will display already before the music file starts downloading. Certainly when using bigger files putting the code near the bottom of your page will make the page seem to load faster than when you put it near the top of the page.

Now let's tweak this a little...

Code: Select all

<embed src="yourfile.mid" width="150" height="60">
This will force the player to at least try to stay within those boundaries. Now this may or may not have much effects, depending on which browser plugin is taking care of midi files (or wav or whatever soundfile you're using). But at least in most cases the player controls will be in a box of 150x60 pixels.

Code: Select all

<embed src="yourfile.mid" width="150" height="60" autostart="true">
This was the goal, wasn't it, to have an automatically starting background sound? If you use "false" your viewers will have to push the "play" button.

Code: Select all

<embed src="yourfile.mid" width="150" height="60" autostart="true" loop="true">
And while we're at it: this code lets your music file loop. Other options for 'loop' can be "false" (meaning it plays once), or a number (meaning it will loop so many times before stopping).

Code: Select all

<embed src="yourfile.mid" width="150" height="60" autostart="true" loop="true" console="smallconsole">
You can control the size of the console (=the buttons of the player), but I have to warn you: not all players properly support this! The values for 'console' can be "console", "smallconsole", "playbutton", "pausebutton", "stopbutton", or "volumelever".

Jut one more thing...: many people find it extremely annoying to end up on a page where there's a background music, while they are listening to a CD or to the radio. And even more annoying when that page decides to not show the console, like in the following code:

Code: Select all

<embed src="yourfile.mid" hidden="true">
Remember that your goal is to attract visitors, not to chase them away.

Jim

Post Reply