HTML5 ビデオの操作

HTML5 がモバイルビデオの配信の標準になっていますが、デスクトップビデオ配信のプラットフォームとしての HTML5 には次の制限事項があることを考慮してください。

  • HTML5 は、デスクトップビデオの次善策にすぎない。

    HTML5 については、各種 Web ブラウザ共通のビデオストリーミングの標準はありません。そのため、ビデオの配信は、プログレッシブダウンロードという方法に限られます。この方法では、ロードにかかる時間が長くなり、ビデオ内の検索にも時間がかかります。また、ユーザのデスクトップ上に、ビデオのコピーが一時的に保存されます。

    さらに、アダプティブビデオのストリーミングはできません。アダプティブビデオのストリーミングでは、ビデオプレーヤーがユーザのネットワーク接続を検知し、適切なビデオ画質を、動的にサポートします。つまり、低速の帯域幅では、ビデオ画質は低くなり、高速接続の場合は、高画質ビデオを提供するということです。この動的ストリーミングを行わなければ、ユーザの帯域幅に関係なく、すべてのユーザで「万能サイズ」のビデオ再生が行われることになります。

  • 提供する側にとって、エンコードし管理するビデオが増える。

    すべてのブラウザでサポートしているビデオ形式やコーデックはありません。その埋め合わせのため、最低でも 2 種類、最大 4 種類の異なるビデオ形式(MP4、OGG Theora および WebM など)にエンコードする必要があります。同じビデオを Firefox、Chrome、Internet Explorer、Safari およびその他の Web ブラウザで再生できるようにするためだけに、このエンコーディングが必要です。

  • ビデオプレーヤーをカスタマイズする機能が限られる。

    HTML5 ブラウザはそれぞれ、ビデオプレーヤーコントロールについて、独自のデフォルトの外観を持っています。その結果、ビデオプレーヤーのカスタマイズが制限され、ユーザ向けに一貫したビデオ再生操作を作成することは難しくなっています。

  • 限られたユーザにしか提供できない。

    すべてのデスクトップブラウザが HTML5 対応というわけではありません。例えば、Internet Explorer バージョン 7 と 8 では HTML5 ビデオのタグをサポートしていません。この制約があるので、すべてのデスクトップユーザーにビデオを提供できません。

    HTML5 ビデオコーデックに対してサポートされる必要システム構成は、次のとおりです。

    OGG

    MP4

    • Firefox 3.5 以降(デスクトップ)

    • Chrome 3.0 以降(デスクトップ)

    • Android 2.3 以降(モバイル)

    • Internet Explorer 9 以降(デスクトップおよびモバイル)

    • Android 3.0 以降(タブレット)

    • iOS 3.1 以降(モバイル)

    • Chrome 29(最新バージョン。Chrome は自動的に最新バージョンに更新されます)

    • Safari 5.1(Mac OS のみ)

    詳しくは、 ビデオのアップロードとエンコード を参照してください。

これらの制限は重要ですが、代わりに次の 2 つの方法を使用できます。1 つはリッチメディアコンテンツを配信するためのベストプラクティスです。

  • Scene7 Publishing System の HTML5 ビデオビューアを使用する。

    ベストプラクティスとして、 Universal_HTML5_Video ビューアを使用すれば、HTML5 ビデオ再生に関する上記の問題の多くを解決できます。このビデオビューアは単一のプレーヤーで、次の 2 つの利点を同時に活用できます。

    1. HTML5 と CSS を使用してプレーヤーの機能を設計する。

    2. アダプティブストリーミングまたはプログレッシブストリーミングのいずれかのダウンロードを使用してビデオを再生することで、HTML5 をサポートしていないブラウザーを使用しているデスクトップユーザーやモバイルユーザーでも、大多数のユーザーにビデオを提供できる。プレーヤーは、使用されているブラウザーとプラグインの互換性に基づいて、Flash または HTML5 の再生を動的に使用できる。

    詳しくは、 ベストプラクティス:HTML5 ビデオビューアの使用 を参照してください。

    動的ビデオ再生 を参照してください。

    『Adobe Scene7 ビューアリファレンスガイド』の HTML5 ビューアについて も参照してください。

  • ユニバーサル URL 機能を使用する。

    Scene7 Publishing System を使用して、デスクトップでは Flash ビデオビューアを使用し、携帯端末およびタブレットデバイスではネイティブのデバイスプレーヤーを使用するユニバーサルビデオプロファイルを設定します。

注意: ベストプラクティスとして HTML5 ビデオビューアを使用する利点の 1 つは、ユニバーサル URL 機能を使用する場合と違い、ビデオが別ウィンドウで開かないので顧客が Web サイトから離れることがないという点です。再生操作はすべて同一の Web ページで行われます。また、HTML5 ビデオビューアを使用すると、モバイル Web ページに埋め込まれたビデオを再生したり、デスクトップコンピューターと携帯端末の両方で一貫したブランドが示されるようにビデオプレーヤーをカスタマイズしたりできます。

詳しくは、 ユニバーサル URL の使用 を参照してください。