映像（動画）を再生できるvideo要素
HTML5なら、従来はFlashなどのプラグインを使って表示するしかなかった動画や音声が、ブラウザだけで再生できます。例えば、動画「sample.mp4」を再生させたい場合なら、以下のHTMLソース1行を記述するだけです。※実際に使う際には、もう少し記述を加えた方が良いです（詳しくは後述）
<video src="sample.mp4" controls="controls"></video>
このソースを表示させると、以下のように見えます。（Safariでの例）
プラグインを使わずに動画を再生できる
上記のサンプルでは、ブラウザ側に搭載された標準のコントロール（再生位置を示すスライダーや、一時停止・消音などのボタン）を表示させています。ただ再生すれば良いだけなら、これで十分でしょう。
そのほか、JavaScriptを使って様々な制御が可能です。例えば、標準のコントロールを消して、自分流のコントロール（ボタンなど）を用意することもできます。
JavaScript側で現在の再生位置や音量なども取得・制御できますから、単純に映像を流す以外にもいろいろ活用できるでしょう。
video要素の実用的な使い方
先ほどのHTMLソースは短くて分かりやすいのですが、実用面では少々問題があります。以下の2点に対処できていないからです。- ブラウザによってサポートされている動画形式が異なる点
- HTML5のvideo要素に対応していないブラウザへの配慮がない点
video要素は、以下のように記述することで、上記の2点をカバーできます。
<video controls="controls"> <source src="動画ファイル名" type="形式名" /> <source src="動画ファイル名" type="形式名" /> ： ： ： <p>video要素に非対応のブラウザ向けメッセージ</p> </video>
上記のように、複数の動画ファイルをsource要素で列挙できます。各ブラウザは、先頭のsource要素から順に読んでいき、自分の再生できる形式が見つかったところで、その動画を再生します。
video要素に対応していないブラウザは、（video要素とsource要素を無視するため）p要素に書かれたメッセージを表示します。例えば、以下のように記述して使うと良いでしょう。
<video controls="controls"> <source src="sample.mp4" type="video/mp4" /> <source src="sample.ogg" type="video/ogg" /> <p>動画ファイルをダウンロードして、適当なソフトで再生して下さい。<a href="sample.mp4">MP4</a>,<a href="sample.ogg">Ogg</a></p> </video>
■ブラウザごとに対応する動画形式が異なる
残念ながら、現状では主要なブラウザ間で共通して再生できる動画形式が定まっていません。そのため、上記のように複数の形式を列挙する方法が現実的です。
■video要素の属性
video要素にはいくつかの属性があり、「自動再生」、「オートバッファ」（再生ボタンが押される前に動画を読み込んでおく指示）、「ポスターフレーム」（動画の再生が可能になる前に表示される静止画）などを指定できます。
本記事はvideo要素の詳しい解説が目的ではありませんので、具体的な説明は割愛致します（Internet Explorerを含めた主要なブラウザが多く対応した頃に、改めて詳しく解説したいと思います）。
次のページでは、音声を再生するaudio要素について解説します。
