wulin.comの記事紹介(www.vevb.com):HTML 5ビデオの概要。
1ビデオはじめに
翻訳されたドキュメント「HTML5ページに埋め込まれたオーディオとビデオ」の紹介テキストを引用してください。今日、ブラウザやオペレーティングシステムに関係なく、Webページにビデオを埋め込み、すべてのユーザーを見る唯一の信頼できる方法はFlashを使用します。これには、Adobe Flashプラグインが必要であり、<オブジェクト>と<Embed>タグを組み合わせます。
ほとんどのユーザーはすでにフラッシュプラグインをインストールしています(実際、インターネットユーザーの約95%が特定のバージョンのフラッシュを持っています)が、HTML 5サポーターは、プラグインを必要としないオープンなビデオ標準を求めています。これは、HTML 5の新しいTag <video>にもたらされたアイデアであり、Flashなどのプライベートプラグインを必要とせずにビデオを埋め込む(およびそれらと対話する)方法を提供します。
残念ながら、ビデオはそれほど単純ではありません。ブラウザは<video>タグを理解するだけでなく、ビデオを再生するために必要なエンコードとデコーダーも理解する必要があります。明らかなソリューションは、HTML 5仕様の作成者がビデオコーデックを選択し、すべてのブラウザメーカーがそれを実行できるようにすることです。
とにかく、それはあなたが推奨するものです。同時に、これはカオスを引き起こすヒューズでもあります。さまざまなコーデックに関する議論はすでに非常に迷惑ですが、より悲劇的なことは、ブラウザーメーカーが統一された目的に到達できないということです。 Appleは提案されているOGG Theora Codecを使用することに消極的ですが、OperaとMozillaは、ブラウザがH.264コーデックをロードしているため、ライセンス料の支払いも嫌いです。 Googleは両方をサポートしており、MicrosoftはHTML 5ビデオ要素をまったくサポートする予定がないため、議論に大きく遅れています。
ブラウザメーカーの膠着状態に直面して、HTML 5有名な独裁者であるイアン・ヒクソンは手を振ってクソと言いました。したがって、HTML 5仕様にコーデックをエンコードする特別な名前または指定されたビデオはありません。わかりました、ここで引用してください。
状況は、Microsoftが最終的に閉じ込められるということですが、悲劇的には、IE 9でH.264のみをサポートしています。同時に、GoogleはI/OカンファレンスでVP8のフォーマットをエンコードするオープンソースビデオカプセル化形式のWebmとビデオエンコードVP8を最終的にリリースしました。 Opera、Mozilla、およびChromeは、VP8を完全にサポートすることを発表し、IEはサポートを発表しました(プラグインが必要であるが、正しく覚えていれば、HTML5のビジョンの1つはブラウザプラグインを離れることです。
AppleはVP8をサポートしないことにしました。 Jobsは、VP8は品質や効率の点でH.264ほど良くなく、製品の要件を満たすことができないと考えています。さらに、最新のニュースは、VP8に特許問題が含まれる可能性があることを示しています(特許が本当に侵害されている場合、オペラとFirefoxはおそらくVP8をすぐに無視するでしょう)。
最終的に、ページで<video>タグを使用したい場合は、3つの状況を考慮する必要があります。OggTheoraまたはVP8(このことは何も起こらない場合)(Opera、Mozilla、Chrome)、H.264(Safari、Ie 9、Chrome)をサポートするもの(IE6、7)をサポートするものです。
さて、<video>タグ、ビデオオブジェクトが使用できるメディアプロパティ、メソッド、メディアイベントの使用など、技術レベルのHTML 5ビデオを理解しましょう。
2ビデオタグの使用
ビデオタグには、SRC、ポスター、プリロード、オートプレイ、ループ、コントロール、幅、高さなど、内部で使用されているタグ<source>などのいくつかの属性が含まれています。
<source>タグに加えて、ビデオタグには、指定されたビデオを再生できない場合に返されるコンテンツを含めることもできます。
2.1 SRC属性とポスター属性
SRC属性が何に使用されているか想像できますか。 <img>タグのように、このプロパティはビデオのアドレスを指定するために使用されます。
ポスター属性は、現在のビデオデータが無効なときに画像を指定し、表示するために使用されます(プレビュー画像)。無効なビデオデータは、ビデオが読み込まれているためである可能性があります。ビデオアドレスが間違っているためかもしれません。
2.2プリロード属性
このプロパティは、ビデオがプリロードされているかどうかを定義するために使用される名前でも使用できます。属性には3つのオプションの値があります:なし、メタデータ、および自動。このプロパティが使用されていない場合、デフォルトは自動します。
なし:プリロードなし。このプロパティ値を使用すると、ページメーカーがユーザーがこのビデオを期待していないか、HTTPリクエストを減らすと考えている可能性があります。
メタデータ:部分的にプリロードされました。この属性値を使用すると、ページメーカーはユーザーがこのビデオを期待していないと考えていることを意味しますが、ユーザーにいくつかのメタデータ(サイズ、最初のフレーム、トラックリスト、期間などを含む)を提供します。
自動:すべてプリロードされています。
2.3オートプレイ属性
名前に従ってその使用を知っている別の属性。 Autoplayプロパティは、ビデオが自動的に再生され、ブールプロパティであるかどうかを設定するために使用されます。表示される場合、自動再生を意味し、削除することは、自動的に再生されないことを意味します。
HTMLのブール属性の値は真実ではなく偽ではないことに注意してください。正しい使用法は、この属性を使用してタグ内のtrueを表すことです。現時点では、属性には値がないか、その値は常にその名前に等しくなります(ここでは、自動再生は<Video autoplay />または<video autoplay = autoplay />)。この属性は、falseを表すためにタグで使用されていませんが(ここでは、自動再生は<ビデオ />)。
2.4ループ属性
ループ属性を使用して、ビデオが再生されるかどうかを指定するために使用されることは明らかです。また、ブール属性でもあります。
2.5コントロール属性
コントロールプロパティは、ページメーカーがスクリプトを使用して再生コントローラーを生成しないことをブラウザに示すために使用され、ブラウザはブラウザに独自の再生コントロールバーを有効にする必要があります。
コントロールバーには、再生ポーズコントロール、再生進行制御、ボリュームコントロールなどを含める必要があります。