CIS 311 Dr. Soe 2004 1

Multimedia Objects for the Web

CIS 311Dr. Soe

updated November 2009

CIS 311 Dr. Soe 2004 2

Special Demands of Multimedia

Color - what kind? How much?Resolution - 96 dpi maximum you seeSize --

Effects of compression on images & soundsWhat does viewer do while they load?

Are multimedia objects consistent with purpose of site?

Are they distracting? (Animated gifs?)Standards: Compatibility with browsers?

CIS 311 Dr. Soe 2004 3

Special Requirements: Multimedia Production

Interactivity Story line/needs a

script Requires

specialized expertise

Rich Internet Application (RIA) capabilities

Copyright considerations

Legal contracts define how material used & when paid for

CIS 311 Dr. Soe 2004 4

Potential New Uses for Multimedia

Desktop videoconferencing (Connect)Multimedia databases

Travel agenciesReal Estate collections of houses

Multimedia documentationFactory floor how-to demosMaintenance information

Interactive training materialsSoftware Graphic User Interfaces (Flex

)

CIS 311 Dr. Soe 2004 5

Why Use Multimedia on web?

Fast to create & alterCheaper than alternativesEasier to set up interactive sitesMakes concepts easier to

understandMore fun for viewerImpresses others

CIS 311 Dr. Soe 2004 6

Multimedia Objects for Web

Photos Audio Graphics, including TextAnimationVideoClickable MapsAny others?

CIS 311 Dr. Soe 2004 7

Accessibility: Alternative Text for an Image or Label for Other HTML

ObjectsSet alt and title attributes for <img>

tags to text for mouseover/screen reads

Can specify height and width in pixelsDisplaying an image smaller than its

physical size does NOT lower memory requirements

Transparent pixelTransparent pixel for spacing imagesAttributes: border= hspace= vspace=

CIS 311 Dr. Soe 2004 8

External Media

the sound or video file is accessed through a hypertext link.can provide links for low resolution and

higher resolution files

users have a choice as to whether to retrieve the multimedia clip.useful in low-bandwidth connections improves usability of site if user is warned

of sizes of multimedia files before opening them

CIS 311 Dr. Soe 2004 9

Inline and Embedded Media

Inline media clips are placed into the Web page itself as embedded objects.Disadvantage: page loading must wait

until clip is retrieved by the browserintended for users with access to the

Web page using a high-speed connection An embedded media clip works like an

inline image and can be played within the Web page itself.uses object (validatable) or embed (not)

tags

CIS 311 Dr. Soe 2004 10

Web only Displays 96 dpiIn Photoshop, Image>Image Size

Lets you set dpi = 96 (some monitors 72)Can rescale image to physical dimensions

you want it to appear on web but doesn’t change memory requirements there

Smaller actual dimensions less memoryInsert Image in XHTML:

<img src="book.gif" height=30 width=36 alt="book" title=“book” /> [“smart quotes” don't validate]

CIS 311 Dr. Soe 2004 11

Streaming Audio and Video

popular formats streaming media file plays as it downloads

don’t have to wait as long before it plays

different streaming audio and video formats. Audio:

Waveform Audio Format (.wav), MPEG-1 Audio Layer 3 (.mp3) , RealAudio (.ra, .ram)

Video and/or Audio: Audio Video Interleave (.avi), QuickTime

(.qt), Windows Meta File (.wmf)

CIS 311 Dr. Soe 2004 12

Understanding Sound Files

Convert sound from the analog form we hear with our ears to the digital form that is stored in files on our computers.

There are two components to the sound wave: amplitude and frequency.the amplitude is the height of the

sound wave, and it relates to the loudness of the sound

the frequency is the speed at which the sound wave moves, and it relates to the sound pitch

CIS 311 Dr. Soe 2004 13

A Simple Sound Wave

the higher the amplitude, the louder the sound

sounds with high frequency have

higher pitches

CIS 311 Dr. Soe 2004 14

Sampling Rate A sound wave is a continuous function. To convert it to a digital sound format, your

computer must record measurements of the sound at discrete moments in time.each measurement is called a samplethe number of samples taken per second is

called the sampling rate, which is measured in kilohertz (KHz)

the most commonly used sampling rates are 11 KHz, 22 KHz, and 44KHz

HIGHER sampling rates, BIGGER files, more quality

CIS 311 Dr. Soe 2004 15

Approximating a Sound Wave

with Different Sampling RatesThis figure shows a

higher sampling rate means that more samples are taken per second, resulting in a digital sound that more closely matches the analog sound.

The trade-off in increasing the sampling rate is that it increases the size of the sound file.

CIS 311 Dr. Soe 2004 16

Sample Resolution

indicates precision in measuring the sound within each sample.

3 commonly used sample resolution values 8-bit – smallest file size, worst quality16-bit 32-bit – biggest file size, best quality

Have to experiment to find optimal file size with acceptable quality

Sound files get VERY large VERY QUICKLY

CIS 311 Dr. Soe 2004 17

Approximating a Sound Waveat Different Sample Resolutions

increasing the sample resolution creates a digital sound file that represents the analog sound in greater detail but, once again, results in a larger file.

CIS 311 Dr. Soe 2004 18

Channel Size

A final choice -- the number of channels to use.

Choice is between stereo or monaural (mono) sound.

Stereo is a richer sound than mono, but it doubles the size of the sound

file.

CIS 311 Dr. Soe 2004 19

Sampling Rate & Sample Resolutionas Related to Sound Quality 8 KHz, 8-bit mono: Telephone poorest sound qualityLow sampling rate, low sample resolution, monaural

sound

22 KHz, 16-bit stereo: Radio 44 KHz, 16-bit stereo: CD player

CD player provides higher sound quality

48 KHz, 16-bit stereo: DAT (digital audio tape)Highest sampling rate, high sample resolution,

stereo sound, sometimes additional sound channels

CIS 311 Dr. Soe 2004 20

Creating/Modifying Sound Files

Need a sound card, speakers, sound-editing software, & possibly a microphone

Many sound editors available on the Web (Audacity if free, good) that allow you to:modify the sampling rate, sample resolution,

and number of channelsadd special sound effects, remove noise give you the ability to copy and paste sounds

from one sound file to another

CIS 311 Dr. Soe 2004 21

Embedding Sound Files

Sound Files are downloaded & played <a href="frankly.au">insert audio </A><a href="ilikeit.wav">insert .wav

files</A>

Insert background music<bgsound src="frankly.wav">To keep playing, can set loops<bgsound src ="frankly.wav" loop="5">

CIS 311 Dr. Soe 2004 22

Making small audio files

Sampling rate measured in kilohertz (kHz)Affects high-low range of digitized soundSampling rates: 8 kHz, 11 kHz …. 48 kHzHigher sampling rates take more

memoryRead in at higher rateCompress before putting on webListen to how it sounds with various

compression rates

CIS 311 Dr. Soe 2004 23

Sounds/Sound Editing Sources

Adobe Audition formerly CoolEdit http://www.adobe.com/products/audition/

Shareware Music Machine http://www.hitsquad.com/smm/

Prof. Grasmick's Sound Editing Web Site http://www.csupomona.edu/~dmgrasmick/computer/

CIS 311 Dr. Soe 2004 24

Sound File formats -law - Unix -older format .au AIFF - Audio Interchange File Format: Apple .aif WMF – Windows Media Format .wmf WAV - Microsoft & IBM .wav MPEG - high quality requires browser plugin .mpg MPEG3 – very popular .mp3 MIDI=Musical Instrument Digital Interface - requires midi plugin—music algorithm is saved & replayed on synthesizer

in the client computer .mid

RealAudio - streaming audio - requires plugin .rm

See Prof Grasnik’s Web Site on Sound http://www.csupomona.edu/~dmgrasmick/computer/index.html

CIS 311 Dr. Soe 2004 25

MP3 Format

Very popular for music version of MPEG format that compresses

audio files with minor impact on sound quality uses an open standard.

allows greater innovation from developers creating MP3-related software

no security features-- easier for users to share MP3 files & attach them to e-mail messages.

MP3 is readily available in portable music players and car stereos.

Users can convert their MP3 files into WAV format files and burn them onto CDs.

CIS 311 Dr. Soe 2004 26

MIDI (Musical Instrument Digital Interface)

standard for synthesizers and sound cardsPC synthesizer produces sound file based on its

configurationlimited to music and cannot be used for general

sounds, such as speech. reduces sound to a series of values that

describe pitch, length, volume of each note.MIDI is a widely supported standard.files much smaller than other sound formats. http://www.csupomona.edu/~dmgrasmick/

sound/audio.html

CIS 311 Dr. Soe 2004 27

Linking to a Sound File Increase usability--include information

about file format and size with the link. When browser encounters a link to an

external file, it checks to see if there is a program installed to handle the file.these programs are called helper applications,

because they help the browser interpret and present the file

if the browser can not display the file, it might display an error message and prompt the user to download one from the Web

CIS 311 Dr. Soe 2004 28

Embedding a Sound File

A sound clip is one example of an embedded object.

An embedded object is any media clip, file, program, or other object that can be run or viewed from within the Web page.

To use embedded objects, the browser must support them and must have access to the appropriate plug-in applications.

CIS 311 Dr. Soe 2004 29

Syntax of the <embed> Tag<embed src="URL" width="value" height="value" align="value" autostart="startvalue">

URL is the filename and location of the embedded object

height and width attributes define the size of the embedded object on the Web page

align attribute defines how text wraps around the embedded clip

autostart attribute is used to determine whether or not the browser starts the embedded clip automatically when the Web page is loaded

CIS 311 Dr. Soe 2004 30

Embedding audio file

Audio embedded on page with controls Controls display if defined size is

adequate:<embed src="audio/roos_bodymindspirit.mp3" width="441" height="14">

</embed>

CIS 311 Dr. Soe 2004 31

Using the <bgsound> Tag IE 3.0 introduced bgsound tag syntax of the <bgsound> tag is:

<bgsound src="URL" balance="value" loop="value" volume="value">

URL is the filename and location of the sound filebalance attribute defines how the sound should

be balanced between the computer’s left and right speakers

loop attribute defines how many times the sound clip is played in the background

volume attribute indicates the volume of the background sound

CIS 311 Dr. Soe 2004 32

Using the <bgsound> Tag

The <bgsound> tag should be used with caution. Background sound displays no control or

object on a Web page.A user cannot stop the background sound from

playing, pause it, or rewind it.The <bgsound> tag is not supported by Netscape.

To insert a background sound clip with Netscape, use the following HTML tag:<embed src="file" width="0" height="0" autostart="true">

CIS 311 Dr. Soe 2004 33

CSS and Sound

CSS can also control audio content pages designed people with visual

impairments situations where people can’t look at

a screen (e.g., when driving)Aural style sheetsAural and Braille browser

information

CIS 311 Dr. Soe 2004 34

Working with Video Files

Video is popular on the Web. can be exciting and provide lots of

information. Video files are large and difficult to work with. Use a video capture board to record images

from a camcorder, television, or VCR. To create video clips use computer animation

software. Creating a video file can be a time-consuming

process but it can also be fun!

CIS 311 Dr. Soe 2004 35

Rules of Thumb for Graphics

Try to keep file size of entire web page 30K or less

Crop or resize images Use thumbnails of

larger images Don’t put too many

on one page Don’t enlarge

dimensions of graphics unless you reduce dpi

Use gif compression for flat graphics

Use jpg for photos Minimize color range in

your graphics -- can compress with better results

Try different compression levels – choose most compressed that looks ok

Reuse graphics

CIS 311 Dr. Soe 2004 36

Video Editing Software

Adobe Premiere Pro -- $352Premiere Pro for DVD movies -- 30 day trial:

http://www.studica.com/products/product_detail.cfm?productid=58362

iMovie comes with newer Macs Ulead VideoStudio X2 -- $99.99

http://www.ulead.com/

Pinnacle Studio 12 $49.99 ($99.99 more stuff)http://www.pinnaclesys.com/ProductPage_n.asp?

Product_ID=1501&Langue_ID=7

CIS 311 Dr. Soe 2004 37

Frame Rates

A video file contains frames, where each frame represents a single image.

When a video file is played, each frame is shown in sequence, giving the illusion of motion.

The number of frames shown in each unit of time is called the frame rate and is expressed as frames per second (fps).

Working with the frame rate is one way to control the size and quality of a video file.

Another way of controlling the size of the video file is by compressing each frame.

CIS 311 Dr. Soe 2004 38

An Example of Frame Rates

VHS videotape renders video at the speed of 30 fps, which yields large files

Reducing the frame ratereduces number of frames shown each

second

reduces total number of frames in the file

Does not reduce the duration, just shows fewer frames

CIS 311 Dr. Soe 2004 39

What affects Video File Size?

Frames per second Compression: Codecs compression

/decompression) used.Codecs available in your video editor depend

on the video card in you computerSome codecs are better suited to the WebHow much you choose to compress the video

and/or audioType of audio (music more than words)Type of video (more or less movement on

screen) – define how often it needs to be repainted

Dimensions of video (length X width). Color (grayscale smaller) Video resolution.

CIS 311 Dr. Soe 2004 40

Web Video File Formats .MOV Apple QuickTime Movies need QuickTime

Movie plug-in --Widely used for movie previews Microsoft’s Video formats

.AVI no longer supported.WMF new formatASF – Microsoft's streaming format

.SWF –shocked Flash movies, embed MOV .RM – RealMedia MPEG – great compression, no standard MPEG,

requires technology most people don’t have. Streaming media available in most file formats

– starts playing before completely downloads

CIS 311 Dr. Soe 2004 41

Linking to a Video File – let user know how big it is

A sample code for linking to mrim.avi and mrim.mov video files is:<p>Preview a clip from the Mount Rainier Interactive Map.</p>

<blockquote>

<a href="mrim.avi">Summit Flyby (187K – AVI)</a><br>

<a href="mrim.mov>Summit Flyby (215K – QuickTime)</a>

</blockquote>

CIS 311 Dr. Soe 2004 42

Linked vs. Embedded

Linked multimedia content doesn’t show until viewer clicks a link

Embedded content starts playing automatically right after page loads

CIS 311 Dr. Soe 2004 43

Linked movies

<a href="Movies/Export00_288.mov"> <b>28.8k</b> </a> <font size="2">(1.15MB)</font>

<a href="Movies/Export00_56k.mov"><b><br> 56 k</b></a> <font size="2">(2.13MB) </font> <br>

<a href="Movies/Export00_ISDN.mov"> <b>Broadband </b></a><font size="2">(3.69 MB)

CIS 311 Dr. Soe 2004 44

Embedding a Video File: <embed> tag

Specify a source for the embedded video clip with the src attribute.

Specify a size for the clip using the height and width attributes. large enough to display any controls needed to

operate the cliptypically, the size is determined by trial and error

Use the autostart tag to specify whether or not to start the clip when the page is loaded.

CIS 311 Dr. Soe 2004 45

Inserting an Embedded Video Clip

<embed src="final_movie_320_240_wmv_28K.wmv" width="199" height="189"></embed>

CIS 311 Dr. Soe 2004 46

Using the <noembed> Tag The <noembed> tag provides a way to

support older browsers that don’t recognize the <embed> tag.

The general syntax of the <noembed> tag is:<embed [attributes]><noembed>

HTML tags recognized by older browsers</noembed>

Older browsers will run whatever tags are entered between the <noembed> tags.

CIS 311 Dr. Soe 2004 47

Using the dynsrc Attribute The dynsrc attribute identifies video clip

associated with inline image (not valid HTML).

For example, an inline image that was inserted using the following <img> tag:<img src="file" align="right" hspace="5" vspace="1">

Can be replaced using this tag:<img dynsrc="file" src="file" align="right" hspace="5" vspace="1">

Using this "dynamic source" tag allows you to display a GIF and JPEG image as a "preview" of the inline video clip.

CIS 311 Dr. Soe 2004 48

The <img> Tag and dynsrc Attribute

other attributes of the <img> tag that you can use along with the dynsrc attribute. controls attribute to specify whether to include VCR-

like controls beneath the video clip loop attribute to specify the number of times the

video is playedstart attribute to control how the video clip is started

The dynsrc attribute and its associated attributes are supported only by Internet Explorer

supplement HTML code with the <embed> tag to allow other browsers to use the embedded video clip.

CIS 311 Dr. Soe 2004 49

Introducing Java Applets Java computing language was developed to

allow users to run programs from within their Web browsers rather than on the Web server.

Each Java program is called an applet.examples of Java applets are stock market tickers,

games, animations, and other utilities. Unlike JavaScript, a Java applet is not

inserted into your HTML file, but it is an external file that is downloaded and executed by the browser.

The applet itself is displayed as an embedded object on a Web page in an applet window.

CIS 311 Dr. Soe 2004 50

Java Applet Archives on the Web

Applets from Sun

http://java.sun.com/applets/

Gamelan http://www.developer.com/java/ejb/

Java Boutique

http://javaboutique.internet.com/applets/

Java Rating Service

http://www.jars.com/

Yahoo’s list of Java Applets

http://dir.yahoo.com/Computers_and_Internet/Programming_and_Development/Languages/Java/Applets/

CIS 311 Dr. Soe 2004 51

Java AppletTo write your own Java applet, you

need a Java Developer’s Kit (JDK).commercial JDKs provide easy-to-use

graphical tools and menus to help create Java applets quickly and easily.

JDK is similar to JavaScript, however, it is a more complicated, and more powerful language.

CIS 311 Dr. Soe 2004 52

.class File save the source code as a file with the four-

letter extension .java. The file compiled into an executable file

that can run by itself without the JDK. The executable filename has the four-letter

extension .class and is called a .class file.Some Java applets may require several .class

files.A class file can be run only from within a Java

interpreter. In most cases, the Java interpreter is in the Web

browser.

CIS 311 Dr. Soe 2004 53

Working with the <applet>and <param> Tags

The <applet> tag inserted on Web page identifies the .class file used by the applet allows you to specify any parameters required

by the applet. The general syntax of the <applet> tag is:

<applet code="file"><param><param>

. . .<param>

</applet>

CIS 311 Dr. Soe 2004 54

Working with the <applet>and <param> Tags

file is the filename of the Java appletthe <param> tags are used for any

parameters required by the appletThe syntax of the <param> tag is:<param name="text" value="value">name attribute identifies the name of the

parameter required by the appletvalue attribute is the value you’ll give the

parameter

CIS 311 Dr. Soe 2004 55

Attributes of the <applet> Tag

Alt=text Text string that is displayed in place of the applet before the browser finishes loading it

codebase=URL

Location of the .class file, if different from the Web page

code=filename.class

Filename of the .class file

Height=value Height of the embedded applet in pixels

Hspace=value

Horizontal space between embedded applet and surrounding text, in pixels

Name-text Name of the applet

Vspace=value

Vertical space between embedded applet and surrounding text, in pixels

Width-value Width of the embedded applet in pixels

CIS 311 Dr. Soe 2004 56

The codebase Attribute The codebase attribute runs an applet placed in

a different location than the Web page. Placing applets in a central location

allows you to maintain only one copy of each applet, rather than copies for each Web page.

Makes it easier to manage collections of applets. Allows you to run someone else’s Java applet from that

person’s Web server (deprecated).this practice is discouraged and, in some cases, is

a violation of copyright lawswhen using someone else’s Java applet, first

obtain permission and retrieve the .class file before placing on your Web server

CIS 311 Dr. Soe 2004 57

Insert Other HTML Tags and Text

Really old browsers ignore the <applet> and <param> tags and instead display the text specified.

New browsers that support Java applets ignore that text.

Use HTML code to have the browsers display the applet, or if it’s an older browser, the message to upgrade.

CIS 311 Dr. Soe 2004 58

Inserting an Appletand Parameter Values

applet parameters

filename of Java applet

dimensions of Java applet

how to insert an applet and parameter values for weather information.

With the large number of embedded objects and the Java applet, this Web page may take a while to load.

CIS 311 Dr. Soe 2004 59

The Applet in Action

text scrolls vertically

text fades as it leaves the

applet window

If the browser has trouble accessing the applet, check the <applet> and <param> tags for any errors or misspellings.

CIS 311 Dr. Soe 2004 60

Using the Internet Explorer

<marquee> Tag Use the <marquee> tag to create a theatre-style marquee – syntax (not valid HTML).<marquee attributes>Marquee Text</marquee>

Marquee Text is the text that appears in the marquee box

Disadvantages of marqueesonly supported by Internet Explorer.Text displayed in other Browsers Lots of people find marquees disturbing &

distracting

CIS 311 Dr. Soe 2004 61

Attributes of the <marquee> Tag

Attribute Description

begin="value" The time, in seconds, before beginning the marquee. The default is "0".

behavior="type" The text behavior within the container. The default value of "scroll" instructs the text to scroll across the container, "alternate" instructs the text to reverse its direction when it reaches the container's edge, and "slide" instructs the text to stop once it reaches the end of the container.

bgcolor="color" The background color of the container

direction="type" The direction of the text movement. Options are: "left", "right", "down", or "up). The default is "left".

end="value" The time, in seconds, before ending the marquee.

height="value"width="value"

The height and width of the marquee container, in pixels

hspace="value"vspace="value"

The horizontal and vertical space around the marquee container, in pixels

loop="value" The number of times the marquee plays. A value of "0" or "-1" instructs the marquee to play without stopping. The default is "-1".

scrollamount="value" The distance, in pixels, that the text moves each time the marquee is redrawn. The default is "6".

scrolldelay="value" The delay, in milliseconds, between subsequent drawings of the marquee. The default is "85".

CIS 311 Dr. Soe 2004 62

Using the <marquee> Tag To control the appearance & size of the marquee, insert

the following attributes into <marquee> tag:bgcolor="color" width="value" height="value"bgcolor attribute controls the background color of the

marquee boxwidth and height attributes define the dimensions of the

box To control the placement of the marquee with the

surrounding text, use the attributes:hspace="value" vspace="value"hspace and vspace attributes define the amount of

horizontal and vertical space in pixels around the box

CIS 311 Dr. Soe 2004 63

Using the <marquee> Tag To control the behavior of text within the marquee, use the

attributes:Behavior="type" direction="type" loop="value" behavior is either "scroll" (to scroll the text across the box), "slide" (to slide

the text across the box and stop), or "alternate" (to bounce the text back and forth across the box)

direction attribute defines the direction the text moves, is "left" (the default), "right", "down", or "up"

loop attribute determines how often the text moves across the box and is either an integer or "infinite"

To control the speed of the text within marquee, use the attributes:Scrollamount="value" scrolldelay="value" scrollamount is the amount of space, in pixels, that the text moves each

time it advances across the page scrolldelay is the amount of time, in milliseconds, between text advances

CIS 311 Dr. Soe 2004 64

Using the <object> Tagfour types of embedded objects

sound clipsvideo clipsappletsHTML files

CIS 311 Dr. Soe 2004 65

Using the <object> Tag

The general syntax for the <object> tag is:<object data="URL" type="type" classid="URL" codebase="URL"><param parameter name and value><param parameter name and value>. . .Text and tags that are displayed by browsers that don’t support the <object> tag

</object>

CIS 311 Dr. Soe 2004 66

Validatable <object> Tag <embed> tag doesn't validate <div>

      <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="780" height="420">        <param name="movie" value="myContent.swf" />        <!--[if !IE]>-->        <object type="application/x-shockwave-flash" data="myContent.swf" width="780" height="420">        <!--<![endif]-->          <p>Alternative content</p>        <!--[if !IE]>-->        </object>        <!--<![endif]-->      </object>    </div><!--Source-->

CIS 311 Dr. Soe 2004 67

Using the <object> Tagdata attribute is used to indicate the

source of the data for the embedded object

type attribute indicates the type of data to be embedded (enclosed in quotes)

classid attribute identifies the class of object being embedded

codebase attribute indicates the location of the source data, if it differs from the location of the Web page

CIS 311 Dr. Soe 2004 68

Some Attributes of the <object> Tag

CIS 311 Dr. Soe 2004 69

Specifying the Type Value The type attribute is expressed in terms of the

MIME data type. The MIME (Multipurpose Internet Mail

Extension) data type was developed to allow e-mail messages to include nontext objects i.e. sound and video files.

MIME was adapted for use on the WWWif a value is not specified for the type attribute,

Web browser may have difficulty rendering the Web page

if browser doesn’t support MIME data type, it won’t download object from the Web server

CIS 311 Dr. Soe 2004 70

Some Mime Data Types

CIS 311 Dr. Soe 2004 71

Specifying the classid Value

The classid attribute provides information to the browser on how the object is to be implemented on the Web page.

For inline images, sound files, and video files, you don’t need to specify a value for the classid attribute.

For Java applets, the classid attribute takes the place of the data attribute.

The syntax for embedding a Java applet within the <object> tag is:<object classid="java: filename"><param><param>. . .

</object>

CIS 311 Dr. Soe 2004 72

ActiveX ActiveX controls require the classid attribute along

with the <object> tag to use them in a Web page. ActiveX controls can be inserted into a document

with the following classid attribute value:<object classid="clsid:class_identifier"><param><param>. . .

</object>class_identifier is a complex text string that

identifies the ActiveX control for the browser ActiveX controls can add a lot to a Web page. Microsoft supports a large library of controls.

CIS 311 Dr. Soe 2004 73

Nesting <object> Tags The <object> tag can be nested one <object> inside

another.this is useful in situations where you want to give the

browser alternatives for displaying an embedded object Code below provides four options for playing a video clip:

<object data="mrim.mpg" type="video/mpeg"><object data="mrim.mov" type="video/quicktime">

<object data="mrim.avi" type="video/x-msvideo">

<img src="mrim.jpg"></object>

</object></object>

CIS 311 Dr. Soe 2004 74

More About The <object> Tag

The <object> tag shows great promise for expanding the capability of HTML in handling embedded objects.

HTML 4.01 deprecates the <embed> tag, preferring Web designers to use the <object> tag

CIS 311 Dr. Soe 2004 75

Embedding Objects

See excellent discussion of embedding different types objects at link belowIncludes sample code and some

hacks to make code work with different browsers

object tag: embed content in valid strict HTML