このセクションでは、<video>
タグと <source>
タグを使用してメディア ファイルをウェブページに埋め込む方法、聴覚障がいのあるユーザー向けに動画に字幕を追加する方法、メディア フレームワークの使用に関する一般的なコンセプトについて説明します。さらに、プリロードを使用して再生開始を高速化する方法と、Kino というオフライン アダプティブ ストリーミング機能を使用して最新のデモ PWA を作成する方法について説明します。
このセクションでは、ウェブページに埋め込む準備ができている動画ファイルがあることを前提としています。カメラからダウンロードした .mov
ファイルは機能しません。それしかない場合は、ウェブ用のメディア ファイルを準備するを確認してからここに戻ってください。
このセクションでは、次のトピックについて説明します。
- <video> タグと <source> タグでは、ウェブページにメディア ファイルを埋め込む方法について説明します。
- メディアのユーザー補助では、聴覚障がい者向けにメディア ファイルに字幕を追加する方法を学習します。
- メディア フレームワークでは、Shaka Player、JW Player、Video.js などのメディア フレームワークの使用に関する基礎を学びます。
- 音声と動画のプリロードによる高速再生では、リソースを積極的にプリロードすることでメディア再生を高速化する方法を学習します。
- オフライン ストリーミングを使用した PWA では、フレームワークを使用せずにアダプティブ ストリーミングとオフライン再生が可能な最新のデモ PWA をどのように構築したかについて説明します。ソースコードを試すこともできます。
このセクションでは、多くのことを学習できます。まずは、<video> タグと <source> タグの使用方法をご覧ください。