Wow, That’s Cool… Fun With HTML5 Video

Sunday, March 14, 2010
Presenters:
Michael Dale – Kaltura Wikimedia
Christopher Blizzard – Mozilla Corporation

Description:
Using the video tag in HTML5, developers can do all sorts of things that are hard or impossible with plugins. In this presentation, Mozilla will show the best and most interesting hacks entered into OVA’s Open Video Contest-because when the webmonkeys unleash their creativity, things get interesting.

  • Why we video matters
  • Examples of creativity
  • Quick walk through of how to use HTML5 video

Why do we care?
Flash works, Youtube is there.
Flash and video plugins are missing something that the web has. The web has a bigger creativity surrounding it.
It lets people learn from each other and build on each other’s work (view source).
5000 developers surveyed. A huge percentage are self-taught.
Ideas and implementations spread from person to person and site to site.
This transparency is really important and should move into the video space.

http://jiilion.com/sublime/video – a really nice HTML5 video implementation

HTML5 will hopefully accelerate the pace of development of video on the web. Adobe is OK, but still a bit closed and awkward to use. It will hopefully invigorate change in the video realm w/out stagnation. Video should be really well connected to other things on the web. "Either you use flash, or you use web standards."

How is these all connected to the web?
Add animation of video windows and layer on top of video playing.
You can put drag/drop on top of a video (demo had color card moving around an image file on top of video).

Example:
<video src="shuttle.ogv"></video> – plain ole video

<video controls="true">
<source type="video/ogg" src="shuttle.ogv"/>
<source type="video/mp4" src="shuttle.mp4"/>
Your browser doesn’t suport HTML video. (You could also put flash or other video embedding in here.)
</video>

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.