学科　WEB動画基礎①

2023年10月18日 0 HTML/CSS 訓練日誌

Web動画とは

YouTubeなどの動画共有サイトからX（旧Twitter）などのソーシャルメディアサービスに至るまで、ウェブ上で観られる動画をWeb（ウェブ）動画こと。
主に、YouTube、TicTok、Vimeo、IGTV、ミクチャ（旧名称MixChannel）など。

Webデザイナーが意識しておくポイントは3つ

  • 5Gによる動画コンテンツ需要の変化
  • 短い動画によるプロモーション活動について
  • Web1.0 Web2.0 Web3.0について

5Gによるコンテンツ需要の変化（5GのGはジェネレーション）

  • 1G…1980年代に登場したアナログ携帯電話
  • 2G…1990年代、通信がアナログからデジタルに移行し、インターネットへの接続が始まった
  • 3G…2000年代、通信の高速化が可能になり、モバイルの台頭で生活やビジネスの利便性が向上
  • 4G…2010年代、LTEという高速化技術とスマートフォンの台頭で生活やビジネスの利便性が向上
  • 5G…2020年～
    1. 高速で大きな容量の通信ができる
    2. 信頼性が高く低遅延の通信ができる
    3. 多数の機器に同時に接続ができる

5Gによる生活環境の変化

5Gによる生活環境の変化は今後の動向を見ていく必要があるが、既に体感できている環境として、どこでも映像を見ることが出来る。Webデザイナーなら、Webサイトに動画を埋め込む事に抵抗が少なくなっている。

短い動画によるプロモーション活動について

動画プロモーションとは

単純に「動画を活用して広告宣伝活動をおこなうこと」。要するにTVCM（テレビコマーシャル）の代わりで、TicTokやYouTubeのショート動画など縦長で見る15秒～1分ぐらいの動画の事。ショート動画は検索にひっかかる。“文字を読んで理解する”など、観る人の能動的なアクションが求められる静止画と比べて、受動的な人にも届きやすいことから、近年、動画プロモーションを活用する企業が増えている。また、インターネットの普及によって視聴者にとって動画が身近な存在になったことも、動画プロモーションが増えている理由。要するに素人でもできる。

Web1.0 Web2.0 Web3.0について

Web1.0：1995年～2005年（ホームページ時代）

Web1.0は1990年代半ばから2000年代半ばにかけて普及してきたインターネットやWebの
総称と言われている。Web1.0 の時代では情報の送り手・受け手が決まっていることを前提とした一方的な流れが可能であったものの、それ以上の機能は実現されていなかった。まだWi-Fiが普及していなかったWeb1.0の時代はインターネットへの接続に速度の遅い電話回線が使われており、動画の再生や画像の表示には膨大な時間が費やされていた。

  • 企業や企業の「ホームページ」
  • GoogleやYahoo!などの「検索エンジン」
  • 電子メールを送信・受信するための「メール専用ソフト」
Web2.0：2005年～2018年（SNS時代）

Web2.0は「誰もがWebを介して情報発信ができるように変化したWeb」のことを指し、ネットワーク機能を持つ全てのデバイスに広がるプラットフォームでもある。Web2.0の出現によってこれらのサービスが普及したことにより、多くのユーザーにとってネットワーク機能を持つ端末から情報を発信する
ことが容易になった。更にPCやスマートフォンの普及によって利用者が増加したことで、情報の量は莫大なものとなると当時に、質の高い情報社会が形成されてきた。

  • LINEやInstagramなどの「SNS」
  • インターネット上での情報発信が可能な「オンラインブログ」
  • オンライン上のクラウド上における「チャットツール」
Web3.0：2018年～（ブロックチェーン時代）

Web3.0は「権力分散型のネットワーク」を指し、次世代におけるインターネットとも言われている。Web3.0は近年世界中で注目を浴びており、「特定の企業に握られている個人の情報資産の分散化1」を目的としたブロックチェーンの技術の活用が行われていることが特徴。

  • 分散化とブロックチェーンの利用
  • 暗号資産に対応
  • 人工知能の利用
  1. Google（Alphabet）、Apple、Facebook（Meta）、Microsoft、Amazonなどに世界中の個人情報が集中すること。個人情報が特定企業のサーバーで集中管理されることにより、サイバー攻撃を受けやすいというセキュリティの問題視される。 ↩︎

VIDEOとIFRAMEタグ

WEBサイトに動画を埋め込む方法は２つ
①iframeタグを使用する（youtubeなどの動画サイトから読み込む）
②videoタグを使用する（動画ファイルをアップロードして読み込む

①IFRAMEタグを使用する場合

記述例
<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>

GooglemapやYouTubeにはhtmlの埋め込みボタンがあるのでそれを活用する。（それぞれ著作権があるので多様はしない。）

ひこ

Webデザイナーが関わるのはWebページやバナーなどのデザインといったあくまで平面的な要素だろうという考えでしたが、SNS動画によるプロモーション戦略や販路の拡大はたしかにここ何年かで多く見かけるようになったので、日々新しいものが生まれるインターネット上では、常にアンテナを張るべきなのだなと改めて思いました。

コメントを残す

メールアドレスが公開されることはありません。 ※ が付いている欄は必須項目です