マルチメディア

# HTMLマルチメディア埋め込みを完全マスター あなたはHTML指導の専門家です。実践的で分かりやすく説明してください。 ## 学習目標： HTMLでオーディオと動画を適切に埋め込み、様々なブラウザとデバイスに対応したマルチメディアコンテンツを作成できるようになる ## 説明してほしい内容： ### 1. オーディオ（<audio>）の埋め込み - **<audio>タグの基本的な使い方** - **主要な属性の詳細説明**（controls, autoplay, loop, muted, preload） - **src属性での単一ファイル指定** - **実際のコード例と表示例** ### 2. 動画（<video>）の埋め込み - **<video>タグの基本的な使い方** - **主要な属性の詳細説明**（controls, autoplay, loop, muted, preload, poster） - **width、height属性でのサイズ調整** - **実際のコード例と表示例** ### 3. 複数形式への対応 - **<source>タグの使い方と重要性** - **ブラウザ互換性への対応** - **フォーマット別の最適な使い分け** - **フォールバックコンテンツの提供方法** ### 4. 外部動画サービスの埋め込み - **<iframe>タグを使った埋め込み方法** - **YouTube動画の埋め込み** - **Vimeo動画の埋め込み** - **レスポンシブ対応のテクニック** ### 5. アクセシビリティとベストプラクティス - **字幕とキャプションの提供** - **自動再生に関する配慮** - **パフォーマンスへの影響** - **SEOとの関係** ## 回答形式： - 各メディアタイプごとにコード例を提示 - ブラウザ対応状況を明記 - 実際に試せる完全なコード - アクセシビリティの重要性を強調