video・audioタグ(
HTML5 videoタグ サンプル)です。ブラウザはOperaです。Firefoxだと音が出ないと思います。
詳解! HTML 5と関連APIの最新動向 - 新タグ&API編を見て勉強してみました。
VideoとAudioタグで出来ることは、記事にも書かれている通り、
動画や音声を簡単にWebページ内に埋め込むことができることです。
・埋め込み方
1. video/audioタグを記述する
2. src属性に動画/音声ファイルのURLを指定する
基本的に、これだけですね。
・記述方法
<video src="動画ファイルのURL">
videoタグが使えないブラウザ用のコメントを記述
</video>
<audio src="音声ファイルのURL"></audio>
ただし、ブラウザによって対応しているコーデックが異なります。
コーデックとは、「データを圧縮／伸張するプログラムの総称」のことで、動画ファイルなどの容量の大きいファイルの場合、様々な方法のコーデックがあります。
・ブラウザ毎のコーデック対応状況
* Firefox 3.5 … Ogg theoraをサポート
* Safari 4 … QuicktimeとH.264をサポート
* Google Chrome 3 … Ogg theoraとH.264をサポート
video・audioタグでは、様々な属性を利用できます。
上述のブラウザによって対応していないコーデックへの対処なども、以下のように可能です。
<video>
<!-- コーデックの違う複数動画を用意(ブラウザによって利用できるコーデックが異なることへの対処) -->
<source src='sample.ogv' type='video/ogg; codecs="theora, vorbis"'>
<source src='sample.mov' type='video/quicktime'>
</video>
