Week 4 Notes

Embedding Media / Media Encoder

Project A: Add Flash Video (FLV), QuickTime video and HTML5 video (MP4/h.264). 3 options including script to divert non-Flash environments.

Project B: Embed Vimeo

ONLINE VIDEO IN CREATIVE SUITE… PLAN:

Brief presentation: Video compression for the Web:

• Why?
• How?
• 2 competing formats
• Discuss economic, philosophical, and moral dimensions to competing video standards
• Discuss: Option of YouTube or Vimeo

Create (fun! - in iMovie) or download QuickTime video

Create alternate presentations for Flash and iPhone

• Generate FLV and h.264 compressions in Media Encoder
• Create 2 video pages in Dreamweaver:
• Embed Flash Video (FLV) for most visitors
• Place h.264 for Apple mobile devices with HTML5 video element
• Link from home page to Flash Video page
• Add JavaScript to Flash Video (FLV) page to detect non-Flash media and divert to Apple page

OR... embed Vimeo player and video

Video You Can Use:

• Small QuickTime video
• Large QuickTime video
• Really small QuickTime video

HTML5 Video Element Code

First type the following:
<video width="xxx" height="xxx" controls="controls">
where the video width value is the width of your video and the video height value is the height of the video (both in pixels). Use the controls code to display player controls.
Then type this:
<source src="xxx.MP4"> where xxx.MP4 is the filename for your MP4 format video.
Finally, enter:
Your browser does not support the video tag in HTML5 </video>
That last line displays text if the viewer's browsing environment does not support HTML5.