Working with Multimedia

One of the most popular and useful features of the Web is the ability to transfer information through the use of sound and video. In creating pages that feature these elements, you should consider several factors, not the least of which is bandwidth. Large sound and video files present trouble for users with low bandwidth connections. You should also consider the type of operating system your user may have installed on their computer.

Multimedia can be added to a Web page in one of two ways: external media or inline media. With external media the sound or video file is accessed through a hyperlink. The advantage of using an external file is that users can choose whether or not to listen or view the clip. This is useful in situations where the user has a low bandwidth connection. Inline media clips are placed into the page itself as an embedded object. With embedded objects, the multimedia clip loads with the page in the browser. If the user has a low bandwidth connection, this could be a long wait.

Sound

Several different competing sound formats are in use on the Web. WAVE or WAV files are the most commonly used formats because of the dominance of the Windows operating system and the fact that support for WAVE files is built into Windows. If your users are working on Macintoshes, you should consider AIFF and SND files. RealAudio sound files are also popular on the Web because the format enables the sound to play as it is being downloaded, rather than wait for the entire thing to load. To play RealAudio files, your browser must have the RealAudio player installed.

There are many sound files available for your use if you do not have the capability to create your own. Just use a search engine to find them.

To use sound clips as external media, just link to the sound file using the <a href> tag as was explained in the hyperlink assignment.  We recorded Josh in class.

Hear Josh say hello.
<a href="josh.wav">

To place the sound clip directly into your page, use the <embed> tag. The full tag with attributes looks link this:

<embed src="sound.wav" width="150" height="150">

Click on the play button (triangle) below to hear my message.

 

To make your files start automatically use the attribute of AUTOSTART="true" or autostart="false" if you want the viewer to have to click on the play button.

To make your sound files play as a background sound, set the values of width and height to 0 and the value of autostart to true. This starts the sound automatically after loading, but no image appears on the page because the width and height are set to "0".

If you have a microphone connected to your computer, you may create your own sound file. Click on Start/Programs/Accessories/Entertainment/Sound Recorder & click on the red button to begin recording your message.

Video

Video on the Web typically appears in one of three formats: AVI, MPEG, or QuickTime. QuickTime might be the format that is best supported by a variety of systems. Even though it was created for Macintosh systems, there is also QuickTime players available for other operating systems like QuickTime for Windows. Few video players for AVI files are available for anything besides Windows. However, support for these files is built into Windows and no extra players are needed. Video player for MPEG files are also available for all operating systems, but MPEG files are not as prevalent as the other two types. It is not a bad idea to give your users a choice by presenting your video in at least two types.

You can place your video in the same ways as for sound files listed above.

Tips For Using Media

  • Avoid embedding large files on your Web pages if the page will be accessed by users with slow internet connections. Use hyperlinks instead.
  • Always indicate the size of the media clip when creating a hyperlink to it, so that your users know how large the file is before committing to retrieving it.
  • Provide different media formats to your users.
  • Test your media clips on different browsers and browser versions.

(There is not a multimedia assignment this week)