Download object

Multimedia Objects for
the Web
CIS 311
Dr. Soe
updated November 2009
CIS 311 Dr. Soe 2004 1
Special Demands of Multimedia
Color - what kind? How much?
Resolution - 96 dpi maximum you see
Size -Effects of compression on images & sounds
What 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 2
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 3
Potential New Uses for Multimedia
Desktop videoconferencing (Connect)
Multimedia databases
Travel agencies
Real Estate collections of houses
Multimedia documentation
Factory floor how-to demos
Maintenance information
Interactive training materials
Software Graphic User Interfaces (Flex)
CIS 311 Dr. Soe 2004 4
Why Use Multimedia on web?
Fast to create & alter
Cheaper than alternatives
Easier to set up interactive sites
Makes concepts easier to understand
More fun for viewer
Impresses others
CIS 311 Dr. Soe 2004 5
Multimedia Objects for Web
Photos
Audio
Graphics, including Text
Animation
Video
Clickable Maps
Any others?
CIS 311 Dr. Soe 2004 6
Accessibility: Alternative Text for an
Image or Label for Other HTML Objects
Set alt and title attributes for <img>
tags to text for mouseover/screen reads
Can specify height and width in pixels
Displaying an image smaller than its
physical size does NOT lower memory
requirements
Transparent pixel for spacing images
Attributes: border= hspace= vspace=
CIS 311 Dr. Soe 2004 7
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 8
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 browser
intended 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 9
Web only Displays 96 dpi
In 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 memory
Insert 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 10
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 11
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 12
A Simple Sound Wave
the higher the
amplitude, the louder
the sound
sounds with high
frequency have
higher pitches
CIS 311 Dr. Soe 2004 13
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 sample
the 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 14
Approximating a Sound Wave
with Different Sampling Rates
This 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 15
Sample Resolution
indicates precision in measuring the sound
within each sample.
3 commonly used sample resolution values
8-bit – smallest file size, worst quality
16-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 16
Approximating a Sound Wave
at 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 17
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 18
Sampling Rate & Sample Resolution
as Related to Sound Quality
8 KHz, 8-bit mono: Telephone
 poorest sound quality
Low 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 19
Creating/Modifying Sound Files
Need a sound card, speakers, soundediting 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 channels
add 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 20
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 21
Making small audio files
Sampling rate measured in kilohertz
(kHz)
Affects high-low range of digitized sound
Sampling rates: 8 kHz, 11 kHz …. 48 kHz
Higher sampling rates take more memory
Read in at higher rate
Compress before putting on web
Listen to how it sounds with various
compression rates
CIS 311 Dr. Soe 2004 22
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 23
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 24
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 25
MIDI (Musical Instrument Digital Interface)
standard for synthesizers and sound cards
PC synthesizer produces sound file based on its
configuration
limited 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 26
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 27
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 28
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 29
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 30
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 file
balance 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 31
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 32
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 sheets
Aural and Braille browser information
CIS 311 Dr. Soe 2004 33
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 34
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 35
Video Editing Software
Adobe Premiere Pro -- $352
Premiere 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?Prod
uct_ID=1501&Langue_ID=7
CIS 311 Dr. Soe 2004 36
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 37
An Example of Frame Rates
VHS videotape renders video at the speed of
30 fps, which yields large files
Reducing the frame rate
reduces 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 38
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 computer
Some codecs are better suited to the Web
How much you choose to compress the video
and/or audio
Type 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 39
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 format
ASF – 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 40
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 41
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 42
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 43
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 clip
typically, 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 44
Inserting an Embedded Video
Clip
<embed src="final_movie_320_240_wmv_28K.wmv"
width="199" height="189"></embed>
CIS 311 Dr. Soe 2004 45
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 46
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 47
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 VCRlike controls beneath the video clip
loop attribute to specify the number of times the
video is played
start 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 48
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 49
Java Applet Archives on the Web
Applets
from Sun
Gamelan
http://java.sun.com/applets/
Java
Boutique
http://javaboutique.internet.com/applets/
Java Rating
Service
Yahoo’s list
of Java
Applets
http://www.jars.com/
http://www.developer.com/java/ejb/
http://dir.yahoo.com/Computers_and_Internet/
Programming_and_Development/Languages/Ja
va/Applets/
CIS 311 Dr. Soe 2004 50
Java Applet
To 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 51
.class File
save the source code as a file with the fourletter 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 52
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 53
Working with the <applet>
and <param> Tags
file is the filename of the Java applet
the <param> tags are used for any
parameters required by the applet
The syntax of the <param> tag is:
<param name="text" value="value">
name attribute identifies the name of the
parameter required by the applet
value attribute is the value you’ll give the
parameter
CIS 311 Dr. Soe 2004 54
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 55
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 laws
when 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 56
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 57
Inserting an Applet
and Parameter Values
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.
filename of
Java applet
dimensions of
Java applet
applet
parameters
CIS 311 Dr. Soe 2004 58
The Applet in Action
text fades as it
leaves the
applet window
t
ext scrolls
vertically
If the browser has
trouble accessing the
applet, check the
<applet> and
<param> tags for
any errors or
misspellings.
CIS 311 Dr. Soe 2004 59
Using the Internet Explorer
<marquee> Tag
Use the <marquee> tag to create a theatrestyle marquee – syntax (not valid HTML).
<marquee attributes>Marquee
Text</marquee>
Marquee Text is the text that appears in
the marquee box
Disadvantages of marquees
only supported by Internet Explorer.
Text displayed in other Browsers
Lots of people find marquees disturbing &
distracting
CIS 311 Dr. Soe 2004 60
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
CIS 311 Dr. Soe 2004 61
"85".
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 box
width 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 62
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
CIS 311 Dr. Soe 2004 63
advances
Using the <object> Tag
four types of embedded objects
sound clips
video clips
applets
HTML files
CIS 311 Dr. Soe 2004 64
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 65
Validatable <object> Tag
 <embed> tag doesn't validate
<div>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8444553540000" 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 66
Using the <object> Tag
data 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 67
Some Attributes of the
<object> Tag
CIS 311 Dr. Soe 2004 68
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 WWW
if 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 69
Some Mime Data Types
CIS 311 Dr. Soe 2004 70
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>
. . .
CIS 311 Dr. Soe
</object>
2004 71
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 72
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/xmsvideo">
<img src="mrim.jpg">
</object>
</object>
</object>
CIS 311 Dr. Soe 2004 73
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 74
Embedding Objects
See excellent discussion of embedding
different types objects at link below
Includes sample code and some hacks to
make code work with different browsers
object tag: embed content in valid strict
HTML
CIS 311 Dr. Soe 2004 75