動画の再生

例：放射線を測るチーム三重（2011-10-19）

MacとiOSのSafari用MPEG4形式

Chromeでも大丈夫ですが，Firefoxでは「この動画のファイル形式またはMIMEタイプはサポートされていません」になります。WindowsのIE11でも大丈夫でした。

<video src="team_mie.m4v" controls>
  このブラウザはHTML5 videoに未対応です。
</video>

FirefoxやChrome用Ogg形式

Safariでは「読み込み中…」になります。WindowsのIE11では「無効なソース」になります。

<video src="team_mie.ogv" controls>
  このブラウザはHTML5 videoに未対応です。
</video>

解説

HTML5のvideo要素を使えば簡単に動画を含めることができます。ただ，ブラウザによって対応する動画の形式が違うので面倒です。

上の動画は，キヤノンPowerShot G11で撮影したMOV形式のものをMacのQuickTime Playerで読み込み，「ファイル」→「Web用に書き出す...」で書き出したフォルダのResourcesの中の一番サイズの小さい（「セルラー」用の）MPEG4ファイル team_mie.m4v です。

その下のOgg Theora形式の動画は，ffmpeg2theora をインストールして ffmpeg2theora team_mie.m4v とターミナルに打ち込んで作った team_mie.ogv です。

あらかじめ（サーバの設定ファイルまたは同じディレクトリに置いた .htaccess の中で）次のように設定しておきます：

AddType video/ogg .ogv
AddType video/mp4 .m4v

参考

Last modified: