Digital Design for the Arts and Humanities website

Digital Design homepageDaily Readings for Digitial Design courseDigital Design Course syllabusE-Mail Digital Design StudentsTechnology, Arts, and Media Program homepageSewall Academic Program homepageCU-Boulder homepage

Putting Streaming Audio and Music
on the Web


Assignment: Start working on your image website.
The Image website is due on Saturday, March 25.

Assignment:  (Do after Class)

1. Download and install Windows Media Encoder

2. Practice using Windows Media Encoder to convert
some of your favorite MP3 files into streaming audio files. Remember, you can select the quality and size of your streaming audio files in Media Encoder.

3. Using the HTML code below, practice embedding some of these streaming audio files into one of your webpages.

4. Go to one of your favorite streaming music pages on
the web and look at the source code for this page.  Can you tell how they embedded audio files into their webpage?

1. Use Easy CDA Extractor or whatever CD ripper you normally use to convert CD music files to wave, mp3,
or wma files.

2. Using Musics Files Demo CD to illustrate
different versions of the same music files.

3. Use Audacity to edit mp3 sound files for playing
on the web. To get Audacity to save your sound files
as MP3s, you need to also download Lame MP3
. When you first use Audacity to save as an
MP3 file, it will ask you where the " lame_enc.dll"
is saved. Save this file in the same Program folder
as your Audacity program.

4. Use blue.mp3 as an example of how to edit an mp3 file with Audacity (See blue.wma as example of
edited sound file)

4. Examples of sound files edited in Audacity and
then converted to "wma"-- windows media audio-- files.

  1. 20 second MP3 version of sound file
  2. 20 second wma version of sound file
  3. 20 second lower quality version of wma sound file.

2.Use Windows Media Encoder to create streaming audio and video files.

3. You can put either put ".wma" sound files on your webpages or ".mp3" sound files on your webpages. For PCs, I suggest you use Windows Media Encoder and create small ".wma" files to put on your pages.

4. Because Windows Media Player is the default music
player for Windows' PCs, using ".wma" sound files is
the best solution to putting sound on your webpage.

5. You don't want to have your sound files on your webpages open up a separate music player program, because you want the reader to stay on your webpage, not go to another program.

2. Popular Audio and Video Players for the Web

  1. Windows Media Player 9
  2. RealPlayer 10
  3. QuickTime 6.5
  4. Macromedia Shockwave Player (includes Flash Player)
  5. Winamp

3. Popular Audio Compression Software:

  1. Media Cleaner Pro 5
  2. QuickTime 6.5
  3. CakeWalk Metro and Sonar Software
  4. RealSystem Producer Plus
  5. QuickTime Pro
  6. Cool Edit 2000

4.  There are ways to reduce the size of an audio file so that it will download faster on the web:

  1. Length of the audio clip.  You should keep the audio sample as short as possible.  Use just part
    of a song.

  2. Number of channels.  A mono audio file requires half the disk space of a stereo file and is recommended for web audio.

  3. Bit depth.  Audio files for the web are most often saved at 8-bit instead of 16-bit files.

  4. Sampling rate.  Cutting the sampling rate in half will
    cut the file size in half.  Audio files that are voice-only can be reduced down to 8 Khz.  Music will sound acceptable at 22 Khz

5. Two audio formats for the web: Non-Streaming and Streaming

  1. Nonstreaming Audio files must be downloaded from a web server in their entirety before they can begin playing on your computer.

  2. Streaming Audio files begin playing almost immediately as they are slowly downloaded  from the server.

  3. See Streaming Audio Tools

6. There are 8 common web audio formats

  1. Wav

  2. WMA
  3. MP3
  4. RealAudio
  5. MIDI
  6. AU
  7. RMF
  8. AIFF

7.  On CDs, the audio file is  a cda file.  You can convert long cda files to MP3 files, send them across the
      web, and then reconvert these files to Wav files and
      burn them on a CD.

8. You can't convert a normal CD music file into a
"wma" file.
In order to convert a song on a CD to
a streaming audio file, first convert it into "MP3"
or "WAV" file and then use windows media encoder
to convert the file into a "wma" file.

7. Adding Sound to your webpages on Macs

  1. Use the program Sound Studio for Mac to
    edit and prepare sound files for the web

  2. Go to the Sound Studio page to download
    this program

  3. Instead of using ".wma" files for sound as you
    would on a PC, use ".mp3" files for sound
    on webpages on the Mac.
  4. You can download and install iTunes for Mac
    to have access to other music editing tools.


8.  What is your favorite MP3 software?

  1. MusicMatch Jukebox 6


  3. Sonique Media Player

  4. Liquid Audio Player

9. Good example of Restaurant website with sound

  1. Calypso Cafe

  2. Dixie Kitchen

  3. Code for basic music playing in the background:

    <bgsound src="jazz.wma" loop="1" >

  4. Code for the Calypso Cafe

    <embed src="1lisbon.mp3" width="32"
    height="32" hidden="TRUE" autostart="TRUE" loop="TRUE"></embed>

  5. Nice Image Slideshow advertising the
    Calypso Cafe



Good Web Design Sites
Award-winning Web Designs
Great Web Design Books
Sewall Class Web Designs

| Home Page  | Readings | Syllabus | Web Resources | Top of Page |

Number of Visitors to this site: 
3806      by Chris H. Lewis, Ph.D.

© 2000 by Chris H.  Lewis, Ph.D.
Sewall Academic Program; University of Colorado at Boulder
Created 1 June 2000:  Last Modified: 17 March, 2006

Digital Design Course homepage