Advanced HTML BCS 500 Seneca College, Newnham Campus, Toronto, Canada

Detailed Course Outline SECTION sound

BCS 500 page explaining Group Assignment, and Practical Assignment
 http://www.witiger.com/senecacollege/BCS500/assignments500.htm
.
 

Plug-ins...

. In order to see the wide diversity of images and sound available on the WWW in 2001, it is necessary to obtain particular plug-ins [also called Browser Extensions] because Netscape and Internet Explorer (the two most popular browsers) are not always installed in a way that allows you to see 95% of all the images, and hear all the audio, on pages you might visit. WTGR .  A plug-in, sometimes called a browser extension, enhances the ability of the browser to see and read content (images and text) on the displayed page, which your browser might not normally be able to see with the standard installation. Most plug-ins are developed by third party vendors who create plug-ins and make them available through various web sites.   go to this page and look around .  Apple QuickTime Adobe Acrobat Reader Macromedia Flash Player  Shockwave by Macromedia RealPlayer

.

Chpt 15 Sound Files   The text has a very good explanation of sound and sound files so you are STRONGLY encourage to read all of chapter 15.

the official mp3 site http://www.mp3.com/  and mp3 FAQ Understand that adding sound to your web site is a relatively new feature of sites since most people accessing the web have had speakers on their PCs less than 2 years. Furthermore, the use of sound is a bit complicated because Netscape and Microsoft have adopted different ways of playing sound that differ from each other. There are two basic types of sound files 1. recorded 2. synthesized All audio data can be categorized into three characteristics - read page 448 in the text for more info   1. sampling rate in samples per second "The sampling rate of a sound is the number of times that a sound is divided up, measured, and recorded. The smaller and more numerous the samples per second, the closer the digital sound comes to recreating the natural experience of sound." 2. number of bits used to record each sample "The bit rate determines how "fine" or "granular" the sound is being recorded. Typically, most sound formats are recorded at eaither 8 bits or 16 bits". Remember, more bits means more memory so a high sampling will require more storage space. 3. number of channels of sound "A single channel of sound is used for mono sound, and two channels is used for stereo".   Netscape Internet Explorer "Ever since the release of Netscape Navigator 3.0, sound is played through a built-in plug-in called Live-Audio. Netscape's Live-Audio can play the following sound file formats" page 450 Microsoft also did a built-in audio player so anybody using I.E. 3.0 or higher can also hear sound recordings ending in the following formats. page 450 .wav .wav .au .au .mid .mid .midi .midi .aiff .aiff .aif .aif   .aifc   .snd

.

Music

Some  popular sounds liked by BCS 500 in 1999 and 2000   Ricky M Stir it up     Sweet Home Alabama

.
 

Adding Sound to your page

Sound Assignment           10%  You are required to add sound to your web page Sound = music .wav file .midi file special effects .wav file .midi file and any other sound producing effect that you can learn how to include - example - .mp3 file You are also welcome to add in moving images such as a .mpeg file You may have these sounds on existing pages, or all on a single page - just as long as the teacher can find where you put it. You can also try to produce an effect where sound is produced when a page first opens (Caution: DO NOT spend all your time hunting for kewl midi files, and then end up with no time to figure out how to put them on your page)

.
 

MIDI is the acronym for Musical Instrument Digital Interface MIDI was introduced in 1983. For more detailed intro to MIDIs, read the explanation page on midi.com's site at  www.midi.com/questions/introtomidi.asp Midi files are some of the first kind of files people add to their page when they are first starting to experiment with adding sounds. They are easy to find, and do not require any fancy plug ins since most basic computers come with the necessary simple players to handle playing the file. You can put .midi files on a page with the url, like this example: Chuck Mangione playing trumpet  www.witiger.com/music/feelgood.midi   or you can link them to an image, like this getdown.midi Kool and the Gang

.
 

There are many many places to get .midi files on the internet. Some websites have huge collections organized into different categories. To the right, are some big sites used by witiger.

Television show theme songs organized in alphabetical order by the name of the show  anothertime.com/TheMall/Arcade/tv1.html

Comparing .MIDI files to other formats

check this

getdown.midi	Kool and the Gang
here is the same song again, only in the Real Player file version getdown3.ra	Kool and the Gang

 This midi file and the ra file came from   http://izan.simplenet.com/hitpar1-50.htm

Comparing .MIDI files to other formats

check this

miamivicetheme.midi	www.witiger.com/music/miamivice.midi
here is the same song again, only in the .wav version miamivicetheme.wav	www.witiger.com/music/miamivic2e.wav

 .
 

This is a good source for midi files, located by Reena Singh in the BCS 500 class, Nov 2001

When you click on the Real Player link, this is what happens (below)

The Real Player control box will pop up in the screen and allow you to adjust volume in the song, as well as replaying, or fast forward.

If you do not have the Real Player plugin on your computer, you can get it.
 

.

The Real Player format has a great web site at  http://www.realplayer.com/ you can download their most current version, Real Player 8 The full version of Real Player 8 costs US$30 or, you can visit a site with Real Player Videos  http://www.music.com/music/videos/artists/Genesis Once you have Real Player, you can listen to live radio on the web  http://realguide.real.com/tuner/

.
 

Witiger's favs

Patrick Hernandez, Born to be alive  www.witiger.com/music/borntobe.ra Kool and the Gang, Celebration  www.witiger.com/music/celebration.ra Isaac Hayes, Shaft  www.witiger.com/music/shaft.ra The Soul City  Symphony www.witiger.com/music/thehustle.ra

.

www.mp3.com

With the popularity of downloading mp3's just before the court orders Napster to shut down [March 2001] many students will undoubtably be interested in knowing how to add .mp3 files to their site. Essentially the process is similar to adding an image or .midi file 1. you find a reasonably short .mp3 file     (if the file is too big it will take too long to load for the listener) 2. FTP it to your site 3. create a link on your page    example:  www.witiger.com/music/GarthBrooksAHBAssoc.mp3 4. when the person clicks on this link, it will automatically download to theri computer (which may take some time) 5. as soon as the download is complete it will automatically play in the sound player on your machine - if you have RealPlayer, it will open within Real Player If you have several .mp3 songs which you really like, you can put them all on one page and your friends can download them from your site - sort of like your own homemade "Napster"

.
 

Internet Explorer   Music loading as the page loads   Internet Explorer

One of the things people like to do is add music on to a page so that it loads when the person visits the page for the first time. There are many examples of this on the Internet, one example is a page that lists many midis. Go to  http://members.aol.com/SheBoop75/DiscoMidi.html and you will hear the music begin as the page loads <bgsound src="ymca.mid">   Page 451, Text Background Sound Attributes SRC = filename.wav, or filename.midi LOOP = number, specifies the number of times it repeats DELAY= number, the number of second before playing VOLUME = number% CAUTION: when you place this tag on the page DO NOT put it at the top of the page since it will delay the page loading. Keith Schengili-Roberts says the best thing to do is put it at the bottom of the code on the page so the viewer can see the image and text load, without having to be delayed waiting for the sound. NOTE: <BGSOUND> tag ONLY works with Internet Explorer if you want sound to be on your page for Netscape browsers also, you have to use the <EMBED> tag

.
 

Netscape   Music loading as the page loads   Netscape

One of the things people like to do is add music on to a page so that it loads when the person visits the page for the first time. There are many examples of this on the Internet, one example is a page that lists many midis. Go to  http://members.aol.com/SheBoop75/DiscoMidi.html and you will hear the music begin as the page loads The person who did this page uses both the  <bgsound src="ymca.mid"> tag  for I.E.+ <EMBED> tag for Netscape   Page 453, Text <EMBED> Attributes SRC = filename.wav, or filename.midi WIDTH = 100, mean how wide the control box will be HEIGHT = 100 , means how high the control box will be LOOP = number, specifies the number of times it repeats AUTOSTART=TRUE, TRUE means it will play automatically when the page loads DELAY= number, the number of second before playing VOLUME = number% NOTE: <EMBED> tag ONLY works with Netscape

.
 

Getting Sound to Co-Exist with Internet Explorer and Netscape Go to  http://members.aol.com/SheBoop75/DiscoMidi.html and you will hear the music begin as the page loads The person who did this page used the following code to make it work in both browsers <EMBED src="ymca.mid" width=4 height=4 autostart=true volume="75%" loop="2"> for Netscape <bgsound src="ymca.mid"> for Internet Explorer   Page 461, Text You can take the same file, a .wav, or .mid file, and by using the <bgsound> tag + a line for the <EMBED> tag you can allow for the music to be heard by people whether they are browsing your page with Internet Explorer or Netscape

.
 

Music on the page

The command for this <EMBED src="ymca.mid" width=4 height=4 autostart=true volume="75%" loop="2"> attributes you can change include  the height and width of the little player box volume loop - means how many time you want it to play before stopping

.

Movies

In addition to adding sound to your web site you can also add moving images, that is to say .mpeg files and other formats to allow people to see short video clips  www.music.com/music/audiovideo/soundtracks_index.html click here to see a movie preview (the Groove)  http://208.184.229.151/music/groove_themovie_128k.asf

. .
BCS 500 page explaining
Group Assignment, and Practical Assignment
 http://www.witiger.com/senecacollege/BCS500/assignments500.htm

.
 to go back to main menu
 www.witiger.com/senecacollege/BCS500.htm