video-on-the-web.html 15.8 KB

Raw Blame History Permalink

<?xml version="1.0" encoding="UTF-8"?>
<!--*- nxml -*-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head profile="http://www.w3.org/2003/g/data-view">
  <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
  <title xml:lang='es' lang='es'>Video en la Web</title>
  <meta name="copyright" content="Copyright © 2008 W3C (MIT, ERCIM, Keio)" />
  <meta name="Date" content="$Date: 2008/01/23 15:51:26 $" />
  <link rel="transformation"
  href="http://www.w3.org/2002/12/cal/glean-hcal.xsl" />
  <link rel="stylesheet" href="../../Talks/Tools/Slidy/slidy.css"
  type="text/css" media="screen, projection, print" />
  <link rel="stylesheet" href="../../Talks/Tools/Slidy/w3c-blue.css"
  type="text/css" media="screen, projection, print" />
  <script type="text/javascript" src="../../Talks/Tools/Slidy/slidy.js">
 </script>
  <style type="text/css">
table {
 border-collapse: collapse;
 margin: auto;
}
th { background: #ccc; }
td {
  font-family: monospace;
  text-align: right;
}
td, th {
  border-right: 1px solid black;
  border-left: 1px solid black;
  padding: 1ex;
}
tbody th {
  text-align: left;
}
thead td, thead th,
tr.total td, tr.total th,
tbody {
  border: 1px solid black;
}
th.empty {
  background: inherit;
  border-top: none;
  border-left: none;
}
tr.total td {
  font-weight: bold;
  background: #eee;
}
div.slide img {
 border: 3px solid #ccc;
 padding: 2px;
}
div.cover img {
 border: none;
}
div.image p.title {
  text-align: center;
  font-weight: bold;
  font-size: large;
}
div.image p.img {
  margin: 1em auto;
}
div.image span.source, blockquote p.source {
  font-size: x-small;
  font-style: italic;
}
div.note {
 display: none;
}
div.snote {
 margin-left: 1em;
 margin-right: 1em;
 background-color: #ccc;
}
blockquote p.source {
  text-align: right;
}
 </style>
</head>

<body>

<div class="background">
<img id="head-icon" alt="graphic with four colored squares"
src="http://www.w3.org/Talks/Tools/Slidy/icon-blue.png" /> <object
id="head-logo" title="W3C logo" type="image/svg+xml"
data="http://www.w3.org/Talks/Tools/Slidy/w3c-logo-blue.svg">
  <img src="http://www.w3.org/Talks/Tools/Slidy/w3c-logo-blue.gif"
  alt="W3C logo" id="head-logo-fallback" /></object> </div>

<div class="background slanty">
<img src="http://www.w3.org/Talks/Tools/Slidy/w3c-logo-slanted.jpg"
alt="slanted W3C logo" /> </div>

<div class="slide cover">
<img align="right" src="http://www.w3.org/Talks/Tools/Slidy/keys.jpg"
alt="Cover page images (keys)" class="cover" />

<h1 xml:lang='es' lang='es'>Video en la Web</h1>

<p>January 23, 2008 - <a href="http://isabel.dit.upm.es/mediawiki/index.php/W3C_Seminar">W3C Spain Office Seminar</a> </p>

<p>Online Presentation</p>

<p><em><strong><a href="http://www.org/People/LeHegaret">Philippe
Le H&eacute;garet</a></strong></em></p>

<p><em><strong>W3C Architecture Domain Leader</strong>,<br />
<strong>Co-Chair of the W3C Workshop on Video on the Web</strong></em></p>

<p>These slides at <a href="http://www.w3.org/2008/01/video-on-the-web">http://www.w3.org/2008/01/video-on-the-web</a></p>
</div>

<div class="slide">
<h1>What's on the Internet tonight?</h1>


<blockquote cite='http://www.gizmag.com/go/7862/'>
  <q>The Internet is becoming consumers' primary entertainment source [&hellip;]</q>
  <p class='source'>
    &mdash; Saul Berman, IBM Media &amp; Entertainment Strategy and Change
  </p>
</blockquote>

<div class='image'>
<p class='img' style='width: 320px;'>
  <img src="http://www.w3.org/2007/10/marge.jpg" width='320px'
title='Marjorie "Marge" Simpson using the Web (&copy; Fox Broadcasting Company)'
alt='Marjorie "Marge" Simpson using the Web (&copy; Fox Broadcasting Company)' /><br />
<span class='source'>&copy; Fox Broadcasting Company</span></p>
</div>

<div class='handout'>
<ul>
  <li>There is a decline of TV as Primary Media Device.</li>
  <li>Nearly 75% of US Internet users watched online video</li>
  <li>Video producers are looking at ways to increase their reach.</li>
  <li>Broadcast TV advertisement is a $60B market, Internet (not
  counting search) is $10B. $4.3B spend in online video advertising
  over the next 4 years. Online video ad revenues are growing 55.5% per year.</li>

</ul>
</div>
</div>

<div class="slide">
<h1>Video Forecast</h1>

<div class='image'>
<p class='title'>Cisco's Global Consumer Internet Traffic Forecast</p>
<p class='img' style='width: 680px; margin: 1em auto;'>
<img src='cisco-graph.png' width="680"
title="Cisco's Global Consumer Internet Traffic Forecast"
   alt="Cisco's Global Consumer Internet Traffic Forecast"/><br />
<span class='source'>Source: Cisco, 2007</span></p>
</div>

<div class='handout'>
  <ul>
    <li>Video is driving IP traffic growth</li>
    <li>thus consumer bandwidth will increase (but never enough)</li>
    <li>Increase in volume of video content</li>
    <li>In 2011, nearly 30% is Internet Video, additional 30% due to Video P2P</li>
  </ul>
</div>
</div>

<div class="slide">
<h1>Increase in Video Online Content</h1>

<div class='image'>
<p class='title'>User Generated Video Uploads per day</p>
<p class='img' style='width: 389px;'>
<img src='idc-ugv.png' width='389'
title="User-Generated Video Uploads per Day"
   alt="User-Generated Video Uploads per Day"/><br />
<span class='source'>Source: IDC, 2007</span></p>
</div>
<div class='handout'>
<p>So, what does all this tell us?</p>
<ul>
  <li>YouTube was Just the Beginning: launched in 2005, take 4% of the
  US Internet Traffic by the end of 2006.</li>

  <li>While TV brought us information and entertainment, online video
  adds the social aspect dimension, it's a means of expression.
  YouTube and MySpace are good examples. The value is the combination
  of communications and content.</li>
  <li>Multiple and fragmentation of multiple video platforms</li>
  <li>Drive towards higher quality, ideally HD. Camcorders and HDTV are getting deployed.</li>
  <li>User Generated Content helps drives the number</li>
</ul>
</div>
</div>

<div class="slide">
<h1>The Long Tail&hellip; of Video</h1>

<blockquote cite='http://www.wired.com/wired/archive/12.10/tail.html?pg=2&amp;topic=tail&amp;topic_set='>
<q>
 The future of entertainment is in the millions of niche markets at
 the shallow end of the bitstream.
</q>
  <p class='source'>
    &mdash; Chris Anderson, Wired magazine
  </p>
</blockquote>
<div style='text-align: center'>
<img src='../../2007/10/Long_tail.png' alt='The Long Tail' title='The Long Tail'/>
</div>

<div class='handout'>
  <ul>
    <li>The number of viewers is inversely proportional to its popularity rank</li>
    <li>With online and mobile video, million of titles are viewed by a relatively small audience</li>
    <li>Notion is that the total amount of viewing of less popular content is large than the total amount of viewing of popular content.</li>
    <li>But, it needs to be available, for a small price, and you need to help consumers find it. (see Amazon, Netflix, Rhapsody)</li>
  </ul>
</div>
</div>

<div class="slide">
<h1>Video at W3C</h1>
<p>We do video related work in several areas, each more or less affecting different video issues</p>

<ul style='font-size: small'>
  <li>Synchronized Multimedia Activity: Timed Text (closed captioning), SMIL (video element/API, closed captioning)</li>
  <li>HyperText Activity: HTML 5 (video element/API)</li>
  <li>Graphics Activity: SVG (video element/API)</li>
  <li>Semantic Web Activity: POWDER (metadata for digital rights, tv, surfing, querying)</li>
  <li>Architecture Activity: EXI (container formats)</li>
  <li>WAI Activity: Protocols and Formats (closed captioning), Guidelines</li>
  <li>Mobile Web Initiative (device independence)</li>
  <li>Rich Web Applications</li>
  <li>Privacy Languages Interest Group</li>
  <li>Multimedia Semantics XG (closed)</li>
</ul>
<div class='handout'>
  <p>Lots of activities can potentially impact video</p>
</div>
</div>

<div class="slide">
<h1>W3C Workshop (1/2)</h1>
<div style='color: white; background-color: rgb(0, 90, 156); margin: 1em;'>
<img src='http://www.w3.org/2007/08/video/banner.jpg' alt='Cinematographie'
 style='float: right; padding-top: 5px;padding-right: 5px;border:none'/>
<h3 style='padding-top: 1em;'>W3C Video on the Web Workshop</h3>
<p>12-13 December 2007, San Jose, California and Brussels, Belgium</p>
<p style='margin-bottom: .5ex;padding-bottom:1em'>Hosted by Cisco Systems</p>
</div>
<div class='image'>
<p class='img' style='width: 500px'><img src='chris_takes_a_picture.jpg'
   alt='W3C Video Workshop Telepresence' title='W3C Video Workshop Telepresence'/><br />
<span class='source'>Photo credit: <a href="http://www.flickr.com/photos/49504282@N00/">Chris Lilley</a></span></p>
</div>

<div class='handout'>
  <ul>
    <li>Make video a first-class object on the Web</li>
  </ul>
</div>
</div>

<div class="slide">
<h1>W3C Workshop Participants</h1>

<p style='font-weight: bold; font-size: small'>Accenture, Adobe Systems, Annodex
Association, Apple, CBS Interactive, CableLabs, Canon, Capgemini, CWI,
Cisco Systems, Dailymotion, Hitachi, Hot Potato, IBBT, IJS, MTV
Networks, Meraka Institute, Motorola, Move Networks, Mozilla
Foundation, Nemours Foundation, Nokia Corporation, RealNetworks,
Samsung Electronics, Sony, Sun Microsystems, Thomson, Turner
Broadcasting System, University Of California at Santa Cruz,
University of Wollongong, VRT medialab, Via Licensing, Walt Disney
Internet Group, Web3D Consortium, Wright State University, YouTube,
thePlatform
</p>

<div class='image'>
<p class='img' style='width: 500px'><img src='steve_bratt.jpg' width='500'
title='Steve Bratt makes a point in Black and White'   alt='Steve Bratt makes a point in Black and White'/><br />
<span class='source'>Photo credit: <a href="http://www.flickr.com/photos/rwfreund/">Robert Freund</a></span></p>
</div>
</div>

<div class="slide">
<h1>Laundry list</h1>

<ul style='font-size: small;'>
<li>Codecs and formats</li>
<li>Metadata</li>
<li>Content protection</li>
<li>Spatial Fragment</li>
<li>Temporal Addressing</li>
<li>Accessibility</li>
<li>Tagging</li>
<li>Searchability</li>
<li>Synchronization, Temporal properties for styling</li>
<li>Distribution: cost, QoS, tracking, mobile, etc.</li>
<li>Playlist files</li>
<li><code>&lt;video></code> HTML 5</li>
<li>&hellip;</li>
</ul>

<div class='handout'>
  <ul>
    <li>Accessibility is still an issue</li>
  </ul>
</div>
</div>

<div class="slide">
<h1>Codecs and formats</h1>

<p style='font-size: x-small; text-align: center'><img src='video-container.png'
title="Video Container format" style='border: none; '
   alt="Video Container format"/></p>

</div>

<div class="slide">
<h1>Flash Video examples</h1>
<p>Flash 6: flv container</p>
<pre>Stream #0: Video: flv
Stream #1: Audio: mp3</pre>

<p>Flash 8: flv container</p>
<pre>Stream #0: Video: vp6
Stream #1: Audio: mp3</pre>

<p>Flash 9: MPEG-4 container</p>
<pre>Stream #0: Video: h264/avc
Stream #1: Audio: he-aac</pre>
</div>

<div class="slide">
<h1>Video codecs</h1>

<dl>
<dt>H.264/AVC</dt>
<dd>supported by Apple/Quicktime/Safari, Adobe/Flash,
Mobile industry (3GPP), Joost, HD DVD/Blue Ray, DVB, etc.</dd>
<dt>VC-1</dt>
<dd>supported by Microsoft/Silverlight, HD DVD/Blue Ray.</dd>
<dt>Ogg/Theora</dt>
<dd>Supported by Mozilla, Opera, and the KDE team.</dd>
<dt>Dirac</dt>
<dd>Developed by the BBC. I-frame only will become VC-2.</dd>
<dt>H.263</dt>
<dd>Older codec but still widely spread.</dd>
</dl>

<p>Video codecs are still evolving: H264/AVC SVC (2007), H.265 (2012?), &hellip;</p>
</div>

<div class="slide">
<h1>HTML 5 Requirements for a Video codec</h1>
<blockquote>
<ul>
<li>Known to not require per-unit or per-distributor licensing</li>
<li>Compatible with the open source development model</li>
<li>Of sufficient quality as to be usable</li>
<li>Not an additional submarine patent risk for large companies</li>
</ul>
</blockquote>

<p>None of the codecs fit the requirements for HTML 5&hellip;</p>

</div>

<div class="slide">
<h1>Metadata</h1>

<ul>
<li>Many standards: MPEG 7, SMIL, iTunes XML, Yahoo! MediaRSS, CableLabs VOD Metadata Content, etc.</li>
<li>Different sources: Content Creator, Publisher, Professional Content, Users.</li>
<li>Survivability: allowing the metadata to survive along the delivery chain (transcoding, republication, syndication, etc.).</li>
<li>Ability to add metadata without touching the data</li>
</ul>
<p>Goals:</p>
<ul>
<li>Search</li>
<li>Discover</li>
</ul>

<p>See also <a href='http://www.w3.org/2005/Incubator/mmsem/'>Multimedia
Semantics Incubator Group</a>.</p>
</div>

<div class="slide">
<h1>Content protection</h1>

<ul>
<li>Pushed by the content owners: monetizing commercial content</li>
<li>Enforce usage rights</li>
<li>Monitor content usage</li>
<li>DRM, watermarking, fingerprinting</li>
</ul>

</div>

<div class="slide">
<h1>Spatial Fragments (1/2)</h1>

<div class='image'>
<p class='img' style='width: 500px'><img src='beth.jpg'
title='Beth, the audience, Belgium, her pitch, and herself' alt='Beth, the audience, Belgium, her pitch, and herself'/><br />
<span class='source'>Photo credit: <a href="http://www.flickr.com/photos/rwfreund/">Robert Freund</a></span></p>
</div>

</div>

<div class="slide">
<h1>Spatial Fragments (2/2)</h1>

<p>Can use SVG or MPEG-7, but require indirection</p>

<pre>&lt;svg:rect id="beth"
       x="14.64" y="15.73" width="146.98" height="147.48"
       style="opacity:1;fill:none;fill-opacity:1;
              fill-rule:nonzero;stroke:#ff0000;stroke-opacity:1"
/></pre>
<pre>&lt;SpatialDecomposition>
  &lt;StillRegion id="beth">
    &lt;SpatialMask>
      &lt;SubRegion>
        &lt;Box>14.64 15.73 161.62 163,21&lt;/Box>
      &lt;SubRegion>
    &lt;/SpatialMask>
  &lt;/StillRegion>
&lt;/SpatialDecomposition></pre>
</div>


<div class="slide">
<h1>Temporal Addressing (1/2)</h1>
<p><code>http://dig.csail.mit.edu/2007/09/OneWebDay</code></p>
<p class='text-align: center'><img src='timbl_movie.png' alt='Temporal addressing' title='Temporal addressing'/></p>
<div  style='margin-top: 1em; margin-left: 2ex;'>
</div>

<div class='handout'>
  <ul>
    <li>Motivations: Playlists of video highlights, Search results, Mashups, Caching</li>
    <li>Addressing: offset, segment, named event</li>
  </ul>
</div>
</div>

<div class="slide">
<h1>Temporal Addressing (2/2)</h1>
<ul>
<li>SMIL and MPEG-7 require an indirection
<pre>&lt;video src="http://dig.csail.mit.edu/2007/09/OneWebDay"
         region="r1" clipBegin="34.45"/></pre>
</li>
<li>TemporalURI and MPEG-21 approaches extend the URI syntax
<pre>http://dig.csail.mit.edu/2007/09/OneWebDay?clipBegin=34.45</pre>
<pre>http://dig.csail.mit.edu/2007/09/OneWebDay#clipBegin(34.45)</pre>
</li>
</ul>
<div class='handout'>
  <ul>
    <li>Issue with ? and #</li>
    <li>Issue with # and RFC3986</li>
  </ul>
</div>
</div>

<div class="slide">
<h1>Next steps</h1>

<ul>

  <li>Codecs and formats: is it possible to meet the HTML 5 requirements?</li>

  <li>Temporal Addressing: MPEG-21, temporalURI and RFC3986</li>

  <li>Metadata: Continue the investigation</li>
</ul>

<div class='handout'>
  <ul>
    <li>Those are immediate steps</li>
  </ul>
</div>

</div>

<div class="slide">
<h1>Thank you</h1>


<img src='http://www.w3.org/2007/08/video/banner.jpg' alt='Cinematographie'
 style='float: right; margin: 3em; -moz-border-radius: 2px;'/>
<h2 style='color: rgb(0, 90, 156); font-weight: bold;padding-top: 1em;'>Video on the Web is not just what you see</h2>
<h3 style='color: rgb(0, 90, 156); padding: 1em; font-weight: bold; font-style: italic'>&mdash; it's
what you can search, discover, create, distribute and manage.</h3>


<div style='text-align: center; clear: both'>
<div id="logo"><img style='border: none' width="315" height="48" alt="The World Wide Web Consortium (W3C)" src="http://www.w3.org/Icons/w3c_main"/></div>

<h2 style="color: rgb(77,140,186); font-style:italic; font-family: Times, 'Times New Roman'">Leading the Web to Its Full Potential&hellip;</h2>
</div>
</div>

</body>
</html>