audio要素
audio要素は、音やオーディオストリームを表します。
audio要素のコンテンツは、audio要素をサポートしていない古いウェブ・ブラウザに向けて、古いオーディオ用プラグインを試すことができるようにしたり、古いブラウザを使っているユーザに、オーディオ・コンテンツにアクセスする方法を知らせるためのテキストをコンテンツとすることができます。ただし、このコンテンツは、アクセシビリティの問題を解決するものではありません。
src属性
src属性は、表示するメディアリソース(ビデオ、オーディオ)のアドレスを指定します。
例)
<audio src="sample.mp3" controls><a href="http://example.com/sample.mp3">オーディオファイルへのリンクです。</a></video>
preload属性
preload属性は、メディア・リソースのバッファリングのときの、以下のキーワードに対応する内容をユーザー・エージェントに伝えます。この属性が指定が無い場合のデフォルトはユーザー・エージェントの定義となります。
また、preload属性よりもautoplay属性が優先されますが、両方の指定があってもエラーにはなりません。
キーワード
- none
ユーザーが、メディア・リソースを必要とするとは期待していない、または、サーバーの不必要なトラフィックを最小化したい、ということをユーザー・エージェントに伝えます。 - metadata
ユーザーが、メディアリソースを必要とするとは期待していないが、リソースのメタ・データ(再生時間、トラック・リストなど。)を読み込んでも良い(ただし、帯域幅の不足を考慮しつつ。)ことをユーザー・エージェントに伝えます。 - auto
リソースすべてのダウンロードも含め、ユーザーのニーズに合わせてバッファリングしても良いことをユーザー・エージェントに伝えます。なお、空の文字列も有効なキーワードで、これを値にした場合もautoと同じ意味になります。
mediagroup属性
mediagroup属性は、暗黙的にMediaControllerを作成することによって、複数のvideo要素やaudio要素をリンクします。値はテキストで、同じ値を持つvideo要素やaudio要素はユーザー・エージェントによって自動的にリンクされます。
autoplay属性
autoplay属性は、属性が存在するときに、ユーザー・エージェントに、停止することなく、できるだけ早く自動的にメディア・リソースの再生を開始するように伝えるブーリアン属性です。
loop属性
loop属性は、属性が存在するときに、メディア・リソースの最後に到達すると先頭に戻ってシーク、いわゆるエンドレス再生を指定する、ブーリアン属性です。
muted属性
muted属性は、属性が存在するときに、潜在的にユーザー設定を上書きし、オーディオ出力のデフォルトの状態を制御し、音声を出さない、いわゆるミュート状態で再生する、ブーリアン属性です。
controls属性
controls属性は、属性が存在するときに、ユーザー・エージェントに独自の再生ボタンや停止ボタンなどのコントローラーを提供するように伝える、ブーリアン属性です。
例)自動再生をしますが、音はなしで再生し、ユーザーが音声をオンにできるように指定しています。
<audio src="sample.mp3" controls autoplay loop muted></video>
audio要素でサポートされているメディアフォーマットについて。
audio要素は、プラグインを必要としないオーディオの再生サポートを提供します。
しかしながら、主に特許の問題によりブラウザのaudio要素の実装において、それぞれのブラウザで同一のメディア形式をサポートするのは難しい状況のようです。
そのため、主要なブラウザの最新バージョンでaudio要素を使うには、以下の例のように、異なる形式のオーディオファイルを用意し、source要素で指定します。例では、WAVE形式、MP3形式、Ogg,Vorbis形式のオーディオファイルを指定しています。
例)
<audio controls> <source src="sample.wav" type="audio/wav"> <source src="sample.mp3" type="audio/mp3"> <source src="sample.ogg" type="audio/ogg"> <a href="http://example.com/sample.mp3">オーディオファイルへのリンクです。</a> </audio>
参考、詳細:Mozilla Developer Network HTML5のaudio要素とvideo要素でサポートされているメディアフォーマット
- カテゴリ
- フロー・コンテンツ、フレージング・コンテンツ、エンベッディッド・コンテンツ、インタラクティブ・コンテンツ(controls属性を持つ場合)、パルパブル・コンテンツ(controls属性を持つ場合)。
- 要素を使用することができる場所
- エンベッディッド・コンテンツ。
- コンテンツ モデル(内容に含めることのできる要素)
- src属性がある場合は、0個以上の track要素に続き、以降トランスペアレント。ただし、子孫にメディア要素(video要素やaudio要素)が存在しないこと。
- src属性がない場合は、0個以上の source要素に続き、0個以上のtrack要素、以降トランスペアレント。ただし、子孫にメディア要素(video要素やaudio要素)が存在しないこと。
- コンテンツ属性
- グローバル属性、src属性、crossorigin要素、preload属性、autoplay属性、mediagroup属性、loop属性、muted属性、controls属性、width属性、height属性。