|Multimedia, a combination of media in a single document,
including: text, graphics, animation, audio and video.
The World Wide web is capable of using most forms of media in combination. The addition of graphics, movies, sound and animation has transformed the Web. Use of media on the web depends on digitization, the process of converting media to a series of numbers. The size of media files is still a factor in their effective use. New technology is making dynamic multimedia more accessible to those without the latest state-of-the-art computers. Data compression is used for almost every image, sound and video file on the Web. However, media files remain very large, or are getting even larger. Sound files a few seconds in play length can be several hundred kilobytes in size, and a few seconds of a movie displayed in a small window will be even larger. Screen-filling high quality video cannot be displayed in real time, but voice, animation, music and images can be delivered over a 56K modem.
Bandwidth is a measure of the amount of data that can be sent through an electronic connection. Modems transferring data over a phone line can transfer 56 kilobits per second. A DSL connection and a cable modem can transfer up to 512 kilobits per second. T1 lines have a 1.5 megabit per second bandwidth and an Ethernet connection will have up to 100 megabits. Because the vast majority of Internet subscribers are using modems, it is important to create media that is both compact in size and of sufficient quality.
Mime Types. In order for a browser to know what to do with a file you need to use the proper file extension. The sytem of standardized file extensions is called Multipurpose Internet Mail Extensions, or MIME. When your browser receives data of type "text/html", the most common MIME type, with the extension .htm or .html, your browser knows to interpret the incoming data as HTML. MIME provides the mechanism for transferring non-text data to your browser. A MIME type is an expression consisting of a pair of elements delimited by a slash ("/"). The first element describes the type of data, such as application, audio, image, text, and video. The second element describes the format, such as gif, jpeg, mpeg, quicktime, html, and plain. MIME types include "audio/basic", "audio/x-wav", "text/plain", "image/jpeg", "video/mpeg", "video/quicktime", "image/png", "image/gif", "video/mpeg", "text/css", and "audio/basic", to name a few of the most common examples. A current list of registered MIME types is available online.
The type attribute specifies the content type for the data. Content types are case-insensitive. This attribute is optional but recommended when data is specified since it allows the user agent to avoid loading information for unsupported content types. Samples of the type attribute can be seen in the code following in this page.
Web browsers are capable of downloading almost any type of file (text, sound, video, etc.). A hyperlink can point at a data file other than those which the browser can interpret. To display many of these files other programs are needed. There are two broad categories of programs used to play or display file types not handled directly by the browser, plug-ins and external helper applications. Plug-ins are programs which extend the built-in capabilities of your Web browser. Helper applications are stand-alone programs on the Web client computer which can be used in conjunction with the browser. When a browser encounters a sound, image, or video file, it utilizes a plug-in if one is available. If not, it will launch a helper application to handle the file.
Some plug-ins and helper applications are shareware or freeware. See the links at the bottom of this page to download the most common of these. To use a helper application, you need a hyperlink to a file type not supported by the browser and the browser must be configured to find the software needed to interpret the file. You can configure the browser, directing which program to use for a particular file type. Helper applications allow you to extend the browser in any way that you see fit. For example, in Netscape Communicator the Applications Preferences dialog box is used to add applications or reconfigure which application will be used to handle which MIME type. The following graphic, from a Macintosh computer running Communicator 4.7, illustrates part of the Applications Preferences dialog box. As can be seen in the graphic, on my computer MPEG files are handled by a helper application, Quick Time.
You can specify a MIME type as the property of a type attribute of a link or embedded element. The type attribute is optional but recommended when data is specified since it allows the user agent to avoid loading information for unsupported content types. Examples of use of the type attribute can be seen in the samples of code following below.
Using multimedia files in Web pages. Media can be delivered in one of two ways, inline or externally. Inline media is embedded in the page. External media is accessed using a hyperlink. External media has the advantage of allowing page users with slow connections to decide if they want to download the file.
An embedded object is any object that can be run or viewed from a browser, including sound, video, images, and programs. To use an embedded object the browser must either handle the file type or have an appropriate plug-in to handle it. In the case of an embedded sound file the controls will be displayed in the Web page by the plug-in. The page author should always consider the fact that some clients will not have the necessary plug-ins, or may not wish to download and install them. Some clients may not have sound capability on their computers.
Embedding Sound Files. The <embed> tag does not create a new line. Use a <p> or <br> tag as needed. Here are two examples of code embeding sound files, followed by descriptions of the tag attributes. Note also that important browser specific support variations are discussed after the attributes. Use both methods to embed a background sound.
CONTROLS= determines how a sound control appears. The options include console, form, smallconsole, playbutton, pausebutton, stopbutton, volumelever. The use of a control requires size specification, width= and height=, and can include other attributes of images such as align= and hspace=.
AUTOSTART=true attribute starts the sound
when the page is opened. Use =false to specify
that the sound does not play when the page is opened.
LOOP=6 determined that the file will repeat six times. Use LOOP=true to allow the sound to play until the page viewer clicks the stop button if so provided.
Not all browsers support the same tags. Embedding a background sound file for Internet Explorer can be accomplished with the <bgsound> tag, which supports only .wav, .au, and MIDI files.
When adding internal sound for Netscape browsers use AUTOSTART=true without controls.
Linking Sound Files. Placing a link to a sound is accomplished using the same tag as a link to another Web page. If no appropriate plug-in or helper application is available the browser will offer the user the opportunity to download the file. In the first example both the image and text act as links.
RealMedia Files. Linking to a RealMedia metafile (a text file listing the absolute path to one or more RealMedia files) is better supported by browsers than embedding the sound in the page. Use the .ram extension for linking and the .rpm extension when embedding. If you list more than one file they will play successively.
Embedding RealMedia Files in Your Page:
Control types and their sizes:
Use NUMLOOP= to specify the number of times the file plays and LOOP=true to allow the sound infinite loops. Use SHUFFLE to play multiple files in a random sequence. Use NOLABELS=true to hide words in the plug-in.
Video Files. When linking to an external video use the correct file suffixes: .qt or .mov for QuickTime, .avi for AVI files, and .mpg or .mpeg for MPEG's.: The first example links using both a gif image and text. The second example embeds a video. Image attributes can be used for imbedded videos. This tag also supports Shockwave movies.