要素を使ってそうすることを見ていきます。それから動画にキャプションや字幕を追加する方法を見て完了します。目的:動画や音声のコンテンツをWebページに埋め込み、動画にキャプションや字幕を追加する方法を学びます。上で動画や音声を長時間使用したいと考えていました。機能、セキュリティの問題、アクセシビリティの問題でうまく機能しないなど、さまざまな問題がありました。正しく行っていれば、ネイティブな解決策はこれの多くを解決します。実現できる基本的な基礎だけです。完全に異なる知識や技能が必要です。あなたが実験のための音声や動画のファイルとサンプルコードを手に入れることができない場合に備えて、それを提供しています。ようなオンライン音声プロバイダがあることも知っておく必要があります。そのような企業は、動画をホストして消費するための便利で簡単な方法を提供するので、莫大な帯域幅の消費を心配する必要はありません。ページに動画や音声を埋め込むための既製コードを提供しています。その道を行くなら、この記事で取り上げるいくつかの困難を避けることができます。この種のサービスについては、次の記事でもう少し詳しく説明します。要素を使用すると、動画を非常に簡単に埋め込むことができます。本当に簡単な例は次のようになります。動画をサポートしていません。href="rabbit320.webm">動画へのリンク</a>があります。</video>機能は次のとおりです。属性には、埋め込みたい動画へのパスが含まれています。これは、まったく同じように動作します。(特にてんかんを患っている人にとっては重要です)。使用してインターフェイスを構築する必要があります。少なくとも、インターフェイスにはメディアの開始と停止、および音量の調整が含まれている必要があります。要素をサポートしていない場合に表示され、古いブラウザでの代替手段となります。これはあなたが好きなことができます。この場合、動画ファイルへの直接リンクが提供されているため、使用しているブラウザに関係なく、ユーザは少なくとも何らかの方法でアクセスできます。埋め込み動画は次のようになります。ここでサンプルをライブで試すことができます(ソースコードも参照してください)。ブラウザで上記のライブのリンクにアクセスしたなら、すでに気づいているかもしれない問題があります。フォーマットをサポートしているためです。用語をすばやく説明しましょう。形式はコンテナフォーマットと呼ばれます。(動画の場合)、および提示されるメディアを記述するメタデータなど、歌または動画全体を構成する異なる部分を含みます。音声トラックと動画トラックもさまざまなフォーマットになっています。音声をパッケージ化します。サポートされています。音声をパッケージ化することがよくあります。サポートされています。動画と一緒に行く傾向があります。フォーマットに取って代わられています。オーディオプレーヤーは、音声トラックを直接再生する傾向があります。これらはコンテナを必要としません。音声と動画のコーデックの互換性表からわかるように、それほど単純ではありません。多くのモバイルプラットフォームのブラウザは、サポート対象のシステムのメディアプレーヤーに再生するためにそれを渡すことで、サポートされていないフォーマットを再生することができます。これは今のところできます。(生の動画と音声は非常に大きい)。コーデックが含まれています。これらのコーデックは、圧縮された音声と動画を2進数字に変換して戻すために使用されます。上記のように、残念ながらブラウザはすべて同じコーデックをサポートしているわけではないので、メディアの制作ごとに複数のファイルを用意する必要があります。メディアをデコードするために適切なコーデックがない場合、再生されません。このような状況が存在するのだろうか。どちらも広くサポートされており、良質です。2027年までカバーしています。特許を保有していないブラウザは、これらのフォーマットをサポートするために膨大な金額を支払う必要があります。多くの人々は、制限されたソフトウェアを原則として避け、オープンフォーマットを支持しています。このため、さまざまなブラウザに複数のフォーマットを提供する必要があります。(それをここでライブで試してみてください)。動画をサポートしていません。href="rabbit320.mp4">動画へのリンク</a>があります。要素を通過し、サポートするコーデックがある最初の要素を再生します。ソースを含めれば、最近のほとんどのプラットフォームやブラウザで動画を再生できるはずです。タイプが含まれており、ブラウザがこれらを読み込んで理解できない動画をすぐにスキップすることができます。それらが含まれていない場合、ブラウザは各ファイルを読み込んで再生しようとしますが、より多くの時間とリソースを必要とします。タイプがいくつか含まれています。動画に含めることができる他の多くの機能があります。以下の3番目の例を見てください。動画をサポートしていません。href="rabbit320.mp4">動画へのリンク</a>があります。</p></video>これにより、次のような出力が得られます。新しい機能は次のとおりです。使用して動画サイズを制御することができます。アスペクト比が設定したサイズによって維持されない場合、動画は水平方向にスペースを埋めるように拡大し、デフォルトでは満たされていないスペースには無地の背景色が与えられます。autoplayこの属性は、ページの残りの部分がロードされている間に音声または動画の再生をすぐに開始します。自動再生することはお勧めしません。終了するたびに再生を開始させます。これは迷惑になることもありますので、本当に必要な場合にのみ使用してください。mutedこの属性を使用すると、デフォルトで音声をオフにしてメディアを再生します。これは、スプラッシュ画面または広告画面に使用するためのものです。preloadこの属性は、大きなファイルをバッファリングする要素で使用されます。3つの値のいずれかを取ることができます。(ソースコードも参照してください)。要素とまったく同じように動作しますが、以下に説明するように若干の違いがあります。典型的な例は次のようになります。音声をサポートしていません。href="viper.mp3">音声へのリンク</a>があります。</p></audio>これはブラウザで次のようなものを生成します。(オーディオプレーヤーのソースコードも参照してください)。音声を再生するコントロールを表示するだけで済みます。動画とのその他の相違点は次のとおりです。ビジュアルコンポーネントがないため、幅や高さを割り当てることはありません。ビジュアルコンポーネントはありません。同じ機能をすべてサポートしています。詳細については、上記のセクションを参照してください。動画のテキストトラックを表示するここでは、もっと知りたいと思う、やや高度なコンセプトについて説明します。多くの人々は、少なくともある時点では、Web上で見つけた音声や動画のコンテンツを聞くことができない、または聞きたくない。:多くの人が聴覚障害を持っているため、音声は聞こえません。いると他の人を邪魔したくないため、音声を聞くことができないことがあります。動画の言語を話さない人には、テキストの写しや翻訳がメディアのコンテンツを理解するのに役立つかもしれません。要素を使用することができます。話し言葉をテキストとして書き留めることを意味します。複数のテキスト文字列を含むテキストファイルを書くための形式です。動画内の何時に各テキスト文字列を表示するかや、限られたスタイリング/位置情報などのメタデータが一緒に含まれています。これらのテキスト文字列はキューと呼ばれ、さまざまな目的のためにさまざまなタイプを表示できます。一般的なものは次のとおりです。(subtitles)音声で話されている言葉を理解していない人々のための外国の翻訳材料。(captions)対話や重要な物音の描写の同期化で、音声を聞くことができない人が何が起こっているのかを理解できるようにする。descriptions)視覚障害者にサービスを提供するために、音声に変換するためのテキスト。ファイルは次のようになります。00:00:24.606これが最初の字幕です。00:00:34.074これは二番目です。メディアの再生と一緒に表示するには、以下を行う必要があります。ファイルとして保存します。ファイルにリンクします。要素の後に配置する必要があります。いずれであるかを指定します。属性を使用して、字幕が書かれた言語をブラウザに伝えます。srclang="en"></video>これにより、字幕が表示された動画になります。これは次のようなものです。動画にキャプションと字幕を追加するをご覧ください。(ソースコードも参照してください)。使用してさまざまな字幕を選択できるようにしています。ボタンを押して、英語、ドイツ語、スペイン語のオプションを選択する必要があります。テキストトラックを使用すると、検索エンジンは動画の途中地点に直接リンクすることもできます。最近の携帯電話では、音声や動画を非常に簡単に録音することができ、コンピュータに転送することができれば使用できます。多くの手間をかけることなく、これを行うための十分なプログラムがあります。さあ、行ってください!動画や音声を入手できない場合は、このサンプルを自由に使用してこの演習を行うことができます。サンプルコードを参照のために使用することもできます。次のことをしましょう。音声と動画のファイルをコンピュータの新しいディレクトリに保存します。ファイルを作成します。それらにデフォルトのブラウザコントロールを表示させます。要素を付けて、ブラウザが最もよくサポートするフォーマットを見つけて読み込むようにします。要素に、動画が再生される前に表示されるポスターを指定します。自分のポスターのグラフィックを作成して楽しんでください。追加のボーナスとして、テキストトラックの研究や動画にキャプションを追加する方法などがあります。まとめそれはラップです。技術を使用して、Webにコンテンツを埋め込む他の方法について説明します。使用して音声と動画をWebページに配置することに関する詳細。(たとえばフィルタを追加するなど)。マルチメディアを翻訳するための自動オプション。inbox.現在、ニュースレターは英語でのみ提供されています。従って私の個人情報を扱うことに同意します。