jqjacobs.net/web

Multimedia

Multimedia, a combination of media in a single document, including: text, graphics, animation, audio and video.

Mime Types  |  Plug-ins  |  Using Multimedia  |  Multimedia Glossary  |  Useful Links

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.

Plug-ins and Helper Applications.

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.

<EMBED SRC=sound.wav AUTOSTART=true LOOP=6 CONTROLS=smallconsole WIDTH=144 HEIGHT=15 ALIGN=right>

Click the Play Button. <EMBED SRC=sound.wav CONTROLS=playbutton WIDTH=37 HEIGHT=22 ALIGN=left HSPACE=10>

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.

<BGSOUND SRC=music.wav LOOP=infinite>

When adding internal sound for Netscape browsers use AUTOSTART=true without controls.

<P><EMBED SRC=music.aif AUTOSTART=true LOOP=10>

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.

<A HREF="sound.aif"><IMG SRC=speaker.gif WIDTH=52 HEIGHT=73>Listen to this</A>

or <A HREF="play.ram">Listen to this.</A>

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.

<A HREF="sound.ram">Listen to this</A>.

Embedding RealMedia Files in Your Page:

<P><EMBED SRC="listen.rpm" TYPE="audio/x-pn-realaudio-plugin" HEIGHT=60  WIDTH=275 CONSOLE="label" CONTROLS="ControlPanel,StatusBar">.

Control types and their sizes:

  • ControlPanel,StatusBar 60, 275
  • ControlPanel,InfoVolumePanel 105, 275
  • ControlPanel 40, 275
  • playButton 25, 35
  • StopButton 25, 35
  • All 125, 275

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.

<A HREF="film.mov"><IMG SRC="movie.gif" WIDTH=50 HEIGHT=50>3.14 Mb QuickTime Movie</A>

<EMBED SRC="film_clip.avi" WIDTH=200 HEIGHT=100 AUTOSTART=true>.

Multimedia glossary:

  • AIFF - a Macintosh audio format.
  • AU - an audio file format for UNIX systems. AU is SUN Microsystem's proprietary format. Probably the most commonly used sound format on the Web.
  • AVI - Audio/Video Interleaved - a video file format. Video quality good, but files tend to be large. Windows format for saving video with sound.
  • Bitmap Graphics - images in pixels, a patterned series of dots. One of the most commonly compatible types of graphic formats. Bitmap file formats include: IMB, DIB, GIF, MTX, PCX, TIF, TGA, BMP, WPG, JPG, CUR and CO.
  • DCR - a Shockwave audio format used in Shockwave movies. Requires the Shockwave plug-in.
  • DIB - Device Independent Bitmap) - a Windows graphics file format.
  • EPS - Encapsulated Postscript - graphics file format used in desktop publishing applications, including PageMaker.
  • FLC - An animation file format.
  • FLI - Animation file format.
  • GIF - Graphics Interchange Format - an common web image format. Compression file format for graphics requiring a specific decoder to view.
  • Helper Applications - programs to view multimedia files that your web browser cannot display/play.  Files must be downloaded before it will be displayed/played.
  • Hypermedia - "media with links to text, sounds, graphics, movies and/or animations.
  • JPEG -  Joint Photographic Experts Group - a common compressed, graphics file format. The two major types of jpegs are progressive, or interleaved, and standard.
  • LA, LAM, LMA - These are Netscape's streaming audio formats and are automatically handled bt generation 4 browsers.
  • MID, MIDI - Musical Instrument Digital Interface - an electronic music audio file format. A global software and hardware standard that allows musical instruments and synthesizers to be controlled from a computer program. Older browsers may require a plug-in.
  • MOD, RMF - The Beatnik audio file format requiring the Beatnik plug-in.
  • MOV, the Macintosh format for saving video with sound. Requires the QuickTime plug-in. MOV real-time video and multimedia data format was developed by Apple Computer. QuickTime files can include text, sound and video.
  • MP3 - a CD-quality audio file format.
  • MPG, MPEG - Motion Picture Experts Group - the public domain, non-proprietary movie format, a quality video file format with relatively small file size.
  • PICT - A graphic file format that can be viewed on Macintosh and PC. Most graphic programs can view a PICT file.
  • Plug-ins - programs to view multimedia files that your web browser cannot display/play.  Plug-ins allow you to view the file without downloading first.
  • QuickTime - A video file format created by Apple Computer. QuickTime requires Apple software for video and audio compression and decompression for Apple Macintosh and Windows computers. QuickTime movies are at present small (1/8 to 1/4 screen) and less than  full-motion (15 frames per second).
  • RAM, RPM - RealAudio file format used for sound and video. Requires the RealAdio or RealPlayer plug-in.
  • RIFF- Resource Interchange File Format - file format for storing sound and graphics so they can be played on different computer platforms
  • Shockwave - an add-in to MacroMedia Director, creates highly-compressed interactive animations and movies.
  • TIFF - Tagged Image File Format - a graphic image file format. Suitable for 24 bit color pictures. Good compression. Not proprietary.
  • Vector Graphics, objects which can be separately manipulated. The graphic parts are geometrically calculated, hence resizable without distortion. Vector graphic file formats include: AutoCAD DXF, CBM, EPS, HGL, PIC, DRW, WMF and WPG.
  • WAV - the Windows audio file format.
  • x-aiff - Apple's Audio Interchange File Format. Well supported on the Macintosh and on Silicon Graphics.
  • XBM - X-Bitmap - n uncompressed black and white image format.
  • XPM - X-Pixelmap - an uncompressed color image format.
  • x-sgi-movie - created by Silicon Graphics for use with X-Windows.
  • x-msvideo - Microsoft's proprietary movie format.
  • x-wav - format that Microsoft uses for sounds.

If you don't find it here try the Whatis glossary or, for multimedia and general computing terms, CNET's glossary.

Useful Links:

Plug-ins:


jqjacobs.net
CLASSES
PHOTO STOCK
WEB DESIGN
ART
Archaeology
CONTACT