WEB MULTIMEDIA COURSE WELLCOME TO

6. WINDOW MEDIA FORMATS 7. OBJECT INTRO 8. OBJECT QUICKTIME 9. OBJECT REALVEDIO 10. TAG REFERENCE 11. PLAYER REFERENCE 1. INTRODUCTION 2. SOUND FORMATS 3. VIDIO FORMATS 4. BROWSER SOUND 5. BROWSER VIDIOS CONTENTS

INTRODUCTION Multimedia is everything you can hear or see : texts, books, pictures, music, sounds, CDs, videos, DVDs, Records, Films, and more. What is Multimedia? Browser Support Internet Browser support : text, fonts, colors, picture, sounds, animations, video

INTRODUCTION Multimedia Formats -.html or.htm : the HTML page -.xml : the XML file -.css : the style sheet The most common way to discover the media type is to look at the file extension. -.jpg,.gif : the picture file - formats with different extensions.

SOUND FORMATS Sound can be stored in many different formats. The MIDI Format (Musical Instrument Digital Interface) The downside : - Cannot record sounds (only notes) or cannot store songs, only tunes. The upside : - MIDI files can be extremely small. - Supported by many different software system (.mid or.midi)

The RealAudio Format SOUND FORMATS (.rm or.ram) The format allows streaming of audio (on-line music, Internet radio) with low bandwidths. Because of the low bandwidth priority, quality is often reduced. The AU Format (.au) supported by many different software systems over a large range of platforms.

SOUND FORMATS The AIFF Format (.aif or.aiff) Audio Interchange File Format and SND was developed by Apple. They are not cross-platform and the format is not supported by all web browsers. and The SND Format (.snd)

SOUND FORMATS The WAVE Format (.wav) supported by all computers running Windows, and by all the most popular web browsers. The MP3 Format (MPEG) (.mp3 or.mpga) The MP3 encoding system combines good compression (small files) with high quality

SOUND FORMATS What Format To Use? If you want recorded sound (music or speech) to beavailable to all your visitors, you should use the WAVE format If your website is about recorded music, the MP3 format is the choice of the future.

VIDEO FORMATS The AVI Format It is a very common format on the Internet, but not always possible to play on non-Windows computers. (.avi) The MPEG Format The MPEG (Moving Pictures Expert Group) format is supported by all the most popular web browsers. (.mpg or.mpeg)

The QuickTime Format VIDEO FORMATS QuickTime movies cannot be played on a Windows computer without an extra (free) component installed. (.mov) The RealVideo Format The format allows streaming of video (on-line video, Internet TV) with low bandwidths. Because of the low bandwidth priority, quality is often reduced (.rm or.ram)

VIDEO FORMATS The Shockwave (Flash) Format The Shockwave format requires an extra component to play. This component comes preinstalled with the latest versions of Netscape and Internet Explorer. (.swf)

PLAYING SOUNDS - sound is included in a web page, or as part of a web page Inline Sound - Inline sound can be added to a web page by using the element or the element.

PLAYING SOUNDS Using A Helper (Plug-In) - A helper application (Plug-In) is a program that can be launched by the browser to "help" playing sound. - Helper applications can be launched using the element, the element, or the element. - can let some (or all) of the player settings be controlled by the user.

PLAYING SOUNDS Using The Element - The purpose of this element is to provide a background sound for a web page:

PLAYING SOUNDS Using The Element Music In The Background Example

PLAYING SOUNDS Using The Element -The purpose of this element is to embed multimedia elements in web page:

PLAYING SOUNDS Using The Element Horse As An Image Example

Using The Element PLAYING SOUNDS -The purpose of this element is to embed multimedia elements in web page:

PLAYING SOUNDS Using The Element Beatles Embedded <embed src="beatles.mid" width="50%" height="50%"> Example

Using The Element PLAYING SOUNDS <object classid="clsid: 22D6F312-B0F6-11D0-94AB-0080C74C7E95 "> - The purpose of this element is to embed multimedia elements in web page:

Playing The Object <object height="50%" width="50%" classid="clsid:22D6F312-B0F6-11D0-94AB- 0080C74C7E95"> PLAYING SOUNDS Using The Element Example

PLAYING SOUNDS Using A Hyperlink Click here to play the Beatles - If a web page includes a hyperlink to a media file, most browsers will use a "helper application“ to play the file.

Linking To Beatles Click here to play the Beatles PLAYING SOUNDS Using A Hyperlink Example

PLAYING VIDEO Using The Element -The purpose of this element is to embed multimedia elements in web page.

Using The Element PLAYING VIDEO -The purpose of this element is to embed multimedia elements in web page.

PLAYING VIDEO Using The Element -The purpose of this element is to embed multimedia elements in web page.

Using A Hyperlink - If a web page includes a hyperlink to a media file, most browsers will use a "helper application“ to play the file. PLAYING VIDEO Click here to play a video file

WINDOWS FORMATS The ASF Format -The ASF format (Advanced Streaming Format) is specially designed to run over the Internet. - ASF files can contains audio, video, slide shows, and synchronized events

WINDOWS FORMATS The ASX Format - ASX (Advanced Stream Redirector) files are not media files, but metafiles. - Metafiles provides information about files. ASX files are plain text files used to describe multimedia content

WINDOWS FORMATS The ASX Format Holiday 2001

WINDOWS FORMATS The WMA Format - The WMA (Windows Media Audio) format is an audio format developed by Microsoft. - The WMA format is similar to the ASF format

WINDOWS FORMATS The WMV Format - The WMV (Windows Media Video) format is an audio format developed by Microsoft. - The WMV format is similar to the ASF format

Other Windows Media Formats WINDOWS FORMATS - WAX (Windows Media Audio Redirector) files are much the same as ASX files, but intended to describe audio files (.wma files) - WMP (Windows Media Player) files and WMX are reserved file types for future use by Windows.

OBJECT INTRO Displaying A Picture <object height="100%" width="100%“ type="image/jpeg" data="audi.jpeg">

OBJECT INTRO Displaying A Web Page <object height="100%" width="100%“ data="

OBJECT INTRO Displaying A Sound <object classid="clsid: 22D6F312-B0F6-11D0-94AB-0080C74C7E95 ">

OBJECT INTRO Displaying A Video <object classid="clsid: 22D6F312-B0F6-11D0-94AB-0080C74C7E95 ">

Displaying A Calendar OBJECT INTRO <object width="100%" height="80%“ classid="clsid: 8E27C92B C-8A2F C02 ">

OBJECT INTRO Displaying Graphics <object width="200" height="200“ classid="CLSID:369303C2-D7AC-11D0-89D5-00A0C90833E6"> <param name="Line0002" value="Oval(-100, -50, 200, 100, 30)">

Displaying Flash OBJECT INTRO <object width="400" height="40" classid="clsid:D27CDB6E-AE6D-11cf-96B " codebase=" /pub/shockwave/cabs/flash/swflash.cab#4,0,0,0">

OBJECT QUICKTIME The QuickTime Format - The QuickTime format is developed by Apple. Videos stored in the QuickTime format have the extension.mov. - QuickTime movies cannot be played on a Windows computer without an extra (free) component installed.

OBJECT QUICKTIME The Solution <object width="160" height="144“ classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase=" <embed src="sample.mov" width="160" height="144" autoplay="true" controller="false" pluginspage="

The Element OBJECT QUICKTIME - The width and height attributes of the object element should match the size of the movie in pixels. - The classid attribute uniquely identifies the player software to use. It must be set to "clsid: 02BF25D5-8C17-4B23-BC80-D3488ABDDC6B ". This unique code identifies an ActiveX control that must be installed on the users PC before the movie can be played.

OBJECT QUICKTIME The Element - The codebase attribute specifies the base path used to resolve relative URIs specified by the classid, data, and archive attributes. - The src parameter should point to the movie file. - The autoplay parameter should have the value "true“ if you want the movie to play automatically. - The controller parameter should have the value "false“ if you don't want the control buttons to show.

The Element OBJECT QUICKTIME - The embed element is added to support browsers that don't support the object element. - The width and height : element should match the size of the movie in pixels. - The autoplay and controller attributes : should be set to the same values as for the parameters in the object element. - The pluginspage attribute defines the players download path. It must be set to "

The Real Video Format OBJECT REALVIDEO - The RealVideo format is developed by Real Media. Videos stored in the Real Video format have the extension.rm or.ram. <object width="320" height="240" classid="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA"> The Solution

The Element OBJECT REALVIDEO - The width and height attributes of the object element should match the size of the movie in pixels. - The classid attribute uniquely identifies the player software to use. It must be set to "clsid: CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA ". - The param elements supply additional information to the player.

OBJECT REALVIDEO The Element - The src parameter should point to the movie (or audio) file. - The autostart parameter should have the value "true" if you want the movie to play automatically. - The controls parameter should have the value "ImageWindow”if you don't want the control buttons to show, or "All" if you want all the controls to show.

Object Reference AttributeDefines classidA unique id for the object. height The height of the object in pixels or %. width The width of the object in pixels or in %. OBJECT REALVIDEO

Parameter Reference Attribute Defines src The source of a RealAudio or RealVideo clip. controls The visibility of the controls. (See below) console A console name to link multiple controls. autostart Automatic start. (true | false). nolabels Suppression of label texts in the controls window. reset Resetting the control for playlist. (true | false). autogotoURL How a URL is handled. (true | false) True forwards URL event to the browser. False uses VBScript event instead.

Controls Values Value Displays All Displays a full player with all controls. InfoVolumePanel Title, author, and copyright and volume slider. InfoPanel Title, author, and copyright. ControlPanel Position slider, play, pause, and stop buttons. StatusPanel Messages, current time position, and clip length. PlayButton Play and pause buttons. StopButton Stop button. VolumeSlider Volume slider. PositionField Position and clip length. StatusField Messages. ImageWindow The video image StatusBar Status, position and channels. OBJECT REALVIDEO

TAG REFERENCE The Element AttributeFunction idA unique id for the element. srcThe location (URL) of the source file. balance The balance. (-10000=left, =right). loop The number of loops. (-1=infinite). volume The volume. (0=max, =min).

TAG REFERENCE The Element AttributeDefines autostart Automatic start. (true | false). height The height of the element in pixels or %. hidden The visibility of the element. (true | false). srcThe location (URL) of the source file. width The width of the element in pixels or %.

TAG REFERENCE The Element AttributeDefines altAn alternate text. archiveThe locations (URLs) of archive files. codeThe location (URL) of the applet code. codebaseThe base location (default URL) for all files. heightThe height of the applet in pixels or %. name The name of the applet. object A saved representation of the applet. Do not use. width The width of the applet in pixels or %.

The Element AttributeDefines archiveThe locations (URLs) of archive files. classidThe location (URL) of the object. codebaseThe base path used to resolve relative URIs specified by the classid, data, and archive attributes. codetypeThe content type of the code. dataThe location (URL) of object data. declareDo not instantiate (execute) the object. heightThe height of the object in pixels or %. name The object's name. standby Text to display while object is loading. tabindex The position in the tab order type The content type of the object. usemap The location (URL) of an image map. width The width of the player in pixels or %. TAG REFERENCE

The Element Attribute Defines idA unique id for the element. name Parameter name. typeParameter content type. valueParameter value. valuetypeParameter value type. TAG REFERENCE

Styling Attributes Attribute Defines alignThe alignment of the object. border The border with in pixels. hspaceThe horizontal white-space (margin) in pixels. vspaceThe vertical white-space (margin) in pixels. TAG REFERENCE

Common HTML Attributes AttributeDefines class The element's class. dirThe directionality of the element. idA unique id for the element. langThe language used by the element. styleThe element's style. titleThe elements title. TAG REFERENCE

Standard Events EventHandles onclickmouse clicked ondblclickmouse double clicked onmousedownmouse button pressed down onmouseupmouse button released onmouseovercursor moved onto the element onmousemovecursor moved within the element onmouseoutcursor moved away from the element onkeypressedkey pressed and released over the element onkeydownkey pressed down over the element onkeyupkey released over the element TAG REFERENCE

MEDIA PLAYER REFERENCE Why Has the class ID Changed? - The correct class ID for Windows Media Player 7 and later is: clsid: 6BF52A52-394A-11D3-B153-00C04F79FAA6. - Many places on the internet it states that the class ID should be: clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95. This class ID is not the correct one, but it will work, because of backward compability..

Windows Media Player 10 clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6 (same as WMP7) MEDIA PLAYER REFERENCE Windows Media Player 9 clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6 (same as WMP7) Windows Media Player 7 clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6

Windows Media Player 6.4 clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95 MEDIA PLAYER REFERENCE Windows Media Player 6 (Older Version) clsid:05589FA1-C356-11CE-BF01-00AA A

REFERENCE