Music Files

When my daughter, "Andrea" first asked me to create a website where she could post her music, as well as her music playlist, I had no idea what I was getting into when I said, "Okay, I'll do it". As familiar as I am with the creation of websites, which I have done over the course of 12 years, both for pleasure and work, I never fully recognized how fast technology changes; and like it or not, you need to "get onboard", or you will be left behind. Just so you know, some of the overall goals of this article is to share with readers not only how the music was made, but to also explain in every day terms some of the technical aspects of creating music files while using various software programs. We also wanted to be able to share specific code for putting music audio files on websites, while keeping accessibility guidelines in mind.

Music Creation Process

The software Andrea used to create her music "Elood" and "Ominuous dancefloor" was "Garageband" and "Reason" which are applications available for the Mac Operating System. According to her, anyone who can operate a computer should be able to create a very simple song with either of these applications. "Garageband" allows you to turn your MAC into a musical instrument. Just plug a USB music keyboard into your Mac and you get instant access to over 100 realistic software instruments - pianos, strings, drums, guitars, and horns - everything from bass to woodwinds. Just create a new track, choose your instrument, and play.

Garageband has a loop library, which allows you to drag loops onto the computer and align them correctly to match the tempo of each track you use. Not only does Garageband allow you to play various instruments and create tracks, it now has a feature which allows users to buy pre-recorded lessons for various musical instruments. Reason on the other hand, according to her, requires more advanced musical software skills. Reason is a popular music software program developed by Swedish software developers "Propellerhead Software". It emulates a rack of hardware synthesizers, samplers, signal processors, sequencers and mixers, all of which can be freely interconnected in an arbitrary manner. Reason can be used either as a complete virtual music studio, or as a collection of virtual instruments to be played live or used with other sequencing software. Both Garageband and Reason can generate export files such as .aif or .wav unless otherwise selected. Both .wav and .aif files are high quality formats while .aac and .mp3 are compressed formats that lower the quality of files which renders the music dynamics and stereo images, but are smaller and easier to upload onto the web.

How the .m4a Files were created

Once she created the .aif or .wav files from Garageband and Reason, she exported them into Itunes. Once they were in her Itunes library she was able to convert the .aif files to .aac files (.mp4). According to her, it is a very simple procedure for anyone who is familiar with Itunes and Mac software features. The songs "Elood" and "Ominuous dancefloor" are in .m4a format which is actually the audio layer (non-video) of Mpeg - 4 movies. According to popular opinion .m4a format is slated to become the new standard for audio file compression. This format is also known as Apple Lossless, Apple Lossless Encode, or ALE. It is a new codec designed to provide lossless encoding in less storage space. Codec is a device or computer program capable of encoding and/or decoding a Digital data stream or signal. Both compressor-decompressor or coder-decoder are another way of defining Codec. Lossless data is used in many applications. It is used in the popular Zip file format and in Unix tool Gzip. Lossless data compression is a class of data compression algorithms that allows the exact original data to be constructed from the compressed data. The term lossless is in contrast to lossy data compression, which only allows an approximation of the original data to be reconstructed, in exchange for better compression rates.

Clarification for MPEG - 4 Files

MPEG-4 files with audio and video generally use the standard .mp4 extension. Audio-only MPEG-4 files generally have a .m4a extension. The .m4a extension is especially true of non-protected content. However, as would be expected, software capable of audio/video playback should recognize files with either .m4a or .mp4 file extensions as there is no file format difference between the two. The common but non-standard use of the extensions .m4a and .m4v is due to the popularity of Apple's IPOD, IPHONE, and Itunes store. Without modifications Nintendo's DSI and SONY's PSP can also play .m4a.

The needed software to play these music files are RealPlayer 11 or QuickTime for Apple's Mac operating systems, and Windows Media Player 10 for Windows XP and earlier versions. Windows Media Player 11 is able to play these music files for Windows XP and Windows Vista operating systems.

Adding Music to Website

To have music play only when a link is clicked on, use the following code:

To have music start automatically when the web page loads, place the following code in the <head> section of your web document. With this code your visitor has no choice to hear it or not and there is no option to turn it off. You need both html codes below to automatically load for Internet Explorer and Netscape.

To Embed music on your website with a shut off button

You can embed music into your page so it starts automatically when someone views your page and have a small image where your visitor can turn it off.

Place the following html music code where you want the button to appear on your page.

To Embed music with console

Instead of the button, you can have a small console with on and off switches on your page such as the one below.

Some of the Parameters you can use for Music Files are:

Some ways to ensure your music/audio files meet Accessibility Guidelines

Adding music to websites, is not that hard, the hard part is when you try to make it accessible. At the very minimum you must provide a link where the user can download the music player.

See below for Examples:

Download Music Players Free

RealPlayer 11 (Mac OS)
QuickTime (Mac OS)
Windows Media Player 10,11 (Windows OS)

The code would be:

<p>Download Music Player Free</p>
<ul>
<li><a href="http://www.real.com/realplayer?rppr=rnwk" mce_href="http://www.real.com/realplayer?rppr=rnwk">RealPlayer 11 (Mac OS)</a></li>
<li><a href="http:// www.apple.com/quicktime/download ">QuickTime (Mac OS)</a></li>
<li><a href="http://www.microsoft.com/windows/windowsmedia/download/AllDownloads
aspx?displang=en&qstechnology=">Windows Media Player 10, 11 (Windows OS)</a>
</li>
</ul>

To have background music play when web page loads and also be accessible you would add the following in the head of the html document

<script type="text/javascript">
function play() {
embed = document.createElement("embed");
embed.setAttribute("src", "yourmusicfile.m4a");
embed.setAttribute("hidden", true);
embed.setAttribute("autostart", true);
embed.setAttribute("loop", false);
document.body.appendChild(embed);
}
</script>

You also have the option of putting the various attributes you want, i.e., hidden= true or false, loop=true or false, etc.

The following would be added after </head>