-本日のアジェンダ-
1限目
学科 WEB動画基礎
WEB動画とは？
2限目
学科 WEB動画基礎
Webサイトでの動画の使い方について
3限目
学科 WEB動画基礎
課題作成
4限目
学科 WEB動画基礎
課題作成
5限目
学科 WEB動画基礎
課題作成
本日のテーマ
Webサイトでの動画の活用法についてです。
WEB動画について
Web動画とは、WebサイトやYouTubeチャンネルなど、オンラインでの視聴を想定した動画全般を指します。 「Webムービー」と呼ばれることもあり、目的はブランディングや商品・サービスのプロモーション、広告配信など多岐にわたります。
参考資料
ドロップボックス
資料＞【STEP4】Webページの制作＞「WEB動画基礎20220818.pdf」をダウンロードしましょう。
ポイントをまとめた資料です。
【動画】「WEB動画運用基礎」
- WEB動画とは？・主なWEB動画
https://youtu.be/PArDVLEBPhg（10:33） - WEBデザイナーが知っておきたい動画の知識とは？
https://youtu.be/OyLqnaWkiR0（8:33） - 5Gによるコンテンツの需要の変化・意識しておくポイント3つ
https://youtu.be/QfoMPJhFhgM（15:28） - 短い動画によるプロモーション活動について
https://youtu.be/Q4XYhPLmP_4（14:50） - Web1.0 2.0 3.0について
https://youtu.be/h7zRKzTCjyo（10:52） - Web3.0はどうなる？
https://youtu.be/y4i-iecVAbs（14:29） - 就職活動に向けてのワンポイントアドバイス
https://youtu.be/SOLaSv0YIkQ（10:12）
VIDEOとIFRAMEタグ
WEBサイトに動画を埋め込む方法は２つあります。
①iframeタグを使用する（youtubeなどの動画サイトから読み込む）
②videoタグを使用する（動画ファイルをアップロードして読み込む）
①IFRAMEタグを使用する（YOUTUBEなどの動画サイトから読み込む）
記述例 <iframe width="410" height="200" src="https://www.youtube.com/embed/9No-FiEInLA" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen>
②VIDEOタグを使用する（動画ファイルをアップロードして読み込む）
記述例 <video src="sample.mp4"></video>
参考サイト
その他、埋め込みについては下記を参考に！
本日の課題
課題提出はありません。
デザインラフを元にコーディングを進めていきましょう。