COMP1710 : Laboratory 9 : Sound inclusion and modification of a template

Version 1.0

1. Objectives

To practice the inclusion of some sound within a web page, then to apply that knowledge to the modification of a Galerie's template.


2. Tasks

2.0 Task 0 : Usual preparation

As usual now, create a directory named LABn_Uxxxxxxx  where you will put today's work. Include an index.html file that will link directly or indirectly to all the html pages you will create. There should be a link to that page in all the pages you will create. There should be your name and a mailto link to your email at the bottom of all your pages.

Important : you should make sure to include a special page named source.html or log.html with the list of media you used in your lab, with the type of modification you have done. Please read the rule about borrowing data in the context of COMP1710 labs and assignment

2.1 Task1 : Include a sound in a web page

Basically, including a sound in a web page is the same as including a video. You may inline it by coupling an embed/object set of tags (the double tag being due to backward compatibility transition) or just by providing a link towards a sound file. Sound files may be in the form of QuickTime files (.mov), .mid, .mp3, .m4a (mpeg aac) or other less respectful of open standards ...

mp3 is widely used as it used to propose one of the best compression/quality ratio.
.m4a (aac) is better quality and come from MPEG world too (open standard used by Apple to build the iPod/iTunes concept) :
"AAC (Advanced Audio Coding) is not a MPEG layer, although it is based on a psycho-acoustic model. Sometimes referred to as MP4, AAC provides significantly better quality at lower bit-rates than MP3. AAC was developed under MPEG-2 and also exists under MPEG-4"
. mid stand for MIDI and is the music score, so it is highly compressed, but the music has to be synthesised on the client side.
Quicktime is just an encapsulation and could manage the sound in any of the previous formats.
Ogg Vorbis is a new format to follow : it has been build to be a fully open source standard.

Chose some sound from here, here or somewhere else, but remember to log your sources

Inline that chosen sound into a web page. Make it start automatically. Make the control bar visible to let the user stop the sound if he doesn't want to listen to it.

Tip : you may want to use PAGEotX to produce the code

2.2 Task 2 : Include some CSS in one of Galerie's template


3. Conclusion

From today, you should not have any more question/issue on how to produce an excellent assignment.

4. Extra work

Download Manypage and use it to dress a set of pages, or ask some questions about the assignment (after you are done with this lab !).

5. Summary to get 3 marks for this lab session

This week, you may follow exactly the same process as previous weeks to upload your work, or chose to ftp to liskov to do so.

If there is an issue with partch, you may use iwaki instead.

N.B. : For more information about the uploading and access to partch/iwaki/liskov server, please consult and http://tsg/twiki/bin/view/Documentation/StudentSettingUpWebPages

> scp
   The authenticity of host ' (' can't be established.
   RSA key fingerprint is c8:ad:18:32:da:37:6f:d5:72:ab:c9:8b:8e:e7:f2:59.
   Are you sure you want to continue connecting (yes/no)? yes
   Warning: Permanently added '' (RSA) to the list of known hosts.'s password:  your passwd here                        4% 344KB   13.7KB/s 09:46 ETA                      100% 8404KB   8.7KB/s   16:01                                                                                                                   100% 8404KB   8.7KB/s   16:01    

   >  ssh's password:  your passwd here 

partch:~> cd public_html
partch:~/public_html> ls
partch:~/public_html> unzip
   creating: LAB7_U4032266/
   creating: LAB7_U4032266/testweb/
  inflating: LAB7_U4032266/testweb/back.gif  
  inflating: LAB7_U4032266/testweb/background.gif  
  inflating: LAB7_U4032266/testweb/forward.gif  
   creating: LAB7_U4032266/testweb/fullsize/
  inflating: LAB7_U4032266/testweb/fullsize/2004_04_17_10.02.20.jpg