HTML5 タグ audio、video、canvas の埋め込み

HTML5 タグ

//

audio

HTML5ならaudio タグを入れるだけで Web上で再生、停止、音量、DLなどのコントロールもできます。

※サンプル（body内に書きます）

ダウンロードボタンを消した版（推奨）

<audio src="hoge.mp3" controls controlslist="nodownload">

<p>※ご利用のブラウザでは再生することができません。</p></audio>

※ダウンロードボタンあり版（過去物）

<audio controls>

   <source src="audio/sample.mp3" type="audio/mp3">

   <p>※ご利用のブラウザでは再生することができません。</p>

</audio>
<audio controls>

   <source src="audio/sample.mp3" type="audio/mp3">

   <p>※ご利用のブラウザでは再生することができません。</p>

</audio>

みてわかるかと思いますが、souce には音声ファイルを指定（もちろんURLでも問題なし）し、

pタグでは、再生できない場合のエラー表示を指定するだけです。

音声のコーデックは、一般的なmp3やaiff、WAVだけでなく、ほとんどの物が使えます。

また、バージョンアップにより増えますので、最新情報はwikipediaなど参照ください。

https://ja.wikipedia.org/wiki/HTML5%E3%82%AA%E3%83%BC%E3%83%87%E3%82%A3%E3%82%AA

//

video

video の場合は、videoタグになるだけです。

<video src="movie.webm" poster="movie.jpg" controls>

ここは video 要素をサポートしないウェブブラウザのためのフォールバックコンテンツ

</video>

wikipedia

https://ja.wikipedia.org/wiki/Video%E8%A6%81%E7%B4%A0

//

canvas

他にも、HTML5なら動的な2次元ビットマップ画像の描画する canvas タグも活用されています。

https://ja.wikipedia.org/wiki/Canvas%E8%A6%81%E7%B4%A0