by shigemk2

当面は技術的なことしか書かない

HTML5のvideoタグ

HTML5 video - Wikipedia, the free encyclopedia

こちらから。HTML5から、動画ファイルを埋め込めるようになった。

書き方の例。

<video poster="movie.jpg" controls>
        <source src='movie.webm' type='video/webm; codecs="vp8.0, vorbis"'/>
        <source src='movie.ogv' type='video/ogg; codecs="theora, vorbis"'/>
        <source src='movie.mp4' type='video/mp4; codecs="avc1.4D401E, mp4a.40.2"'/>
        <p>This is fallback content</p>
</video>

設定しないといけないのは、

  • 動画のサムネ
  • 動画ファイルのパス

上記のように記述すると、再生ボタンなどの表示はブラウザがやってくれる。

ただ、コーデックにはライセンスがあり、ライセンスがオープンソース(Ogg、VP8)なのと
有料(H264)なのが存在する。

各ブラウザの会社がライセンスの問題で揉めに揉めたので、
サポートしているコーデックがブラウザによって違う。
webページを記述する側は、コーデックを考慮して
動画を選ばなければならない。

一応flashは全てのブラウザで使えるが、iPhoneが対応しなくなった上にアンドロイド版の開発が中止されたので
webmあたりが今後期待されるのではないか、という話。