HTML Sound Exercise16 January 2005 – BSc 1 Web Development

Read the document about Sound and HTML from the S drive. It can be found at

S:\Classes\Una Dooney\BSc Web 1\Course Work\Practical\web (if I get time it will also be on my website so you can check there)

Differentiate between the concepts of embedding and linking sounds in web pages.

Now create the following 2 web pages placing them and any associated files in a folder called Soundtest on your H drives. I am going to mark this exercise as part of your continuous assessment (5%)so take care that you do it well and have it completed before Wednesday next.

Page 1
  1. Create the page below using Comic Sans MS
  2. Use a background image
  3. Use a table and center it to place text in middle of screen 70% of screen width
  4. Use 2 sizes of text
  5. Save with the name ‘silence.htm’
  6. The link on the page goes to a file named ‘sounds.htm’ which you will create next

Page 2
  1. Create a second web page as shown below and call it ‘sounds.htm’
  2. The George Michael music should play as soon as the page loads
  3. Use a table 60% of screen width and the same background as for the first page
  4. You will find the graphics you need on S – they are ‘silence.gif’,’ piano.gif’ and ‘real_controls.jpg’
  5. Lay the text out as you see below using H2 for the main heading and H3 for the sub-headings with the remaining text size normal
  6. Use lists to lay out text as shown
  7. Use horizontal rules to divide the text into readable chunks as shown
  8. Keep to the layout shown below for all text and graphics (in so far as is possible but line endings do NOT need to match!)
  9. Link the 4 music files as instructed in the text of the page (page contains the instructions also!!)
  10. Link this page back to ‘silence.htm’ as shown at the end of the page
  11. Make sure that all files needed for these 2 pages are in the soundtest folder on your H drive when you are finished as I will be marking them (5%)

Sound in my Web Pages

With this page some George Michael music begins to play as soon as the page is loaded in the browser.

A sound which plays when the page is loaded is embedded in the page.

This is done with the HTML tag shown here

EMBED SRC="soundfilename.***"

A sound which you can choose to play if you wish is linked to the page.

This is done with the HTML anchor tag

A HREF="soundfilename.***" and this one has a closing tag

It can be very annoying to have sound playing in the background all the time so it is important to give the viewer an option to turn it off! To turn off the background sound on this page we will simply go to another page called 'silent.htm" by clicking on this strange little stop the music icon which will bring you to another web page that has no background music.

You can allow the viewer to control the sound with the Media Player Controls displayed on your screen - that is if they are displayed! You can opt to have them visible or hidden from view. If they are hidden the viewer cannot turn off the music except by leaving the web page. The default media player launches when the music starts and could be Windows Media Player, Real Player or Quicktime etc depending on what is installed on your computer. It is a good idea to give a choice to your web page visitor.

Here are the Real Player controls as they might appear on your screen

You will now link to the 4 sound files numbered 1-4 following the instructions listed below:

  • The first piece of music should have the media player hidden
  • The second piece of music should show the media player controls in the same window
  • The third piece of music should launch the media player in a new window using the "target" attribute
  • The fourth piece of music should be arranged to loop or play continuously while the page is loaded

Here are the sound files

  1. Listen to Billi Jean by Michael Jackson
  2. How about Thriller also by Michael Jackson
  3. Maybe you prefer Robbie Williams?
  4. A little bit of classical music with Beethoven instead

Now if you want blissful silence go back to the first page

HTML Sound ExercisePage 1BSc1 Web Development for Una Dooney