背景に動画を使ったWebサイトの作り方2012年後半あたりから少しずつ目にする機会が増え、今では海外サイトを中心に世界中に広まった、背景に動画を用いたWebサイト。サイトの雰囲気や、サービスの具体的な内容を背景に流すことで、よりユーザーの視点をスクリーンに注目させることができます。今回はそんな背景動画の実装方法を、実例サイトと共に紹介していこうと思います。 KINS WITH 動物病院の Web サイトでは、かわいいわんちゃんの動画とともに院内の様子がよくわかる動画を掲載しています。 Aquallの Web サイトでは画面全体ではなく、動画の一部をくり抜いたような形で動画を掲載。背景の装飾としてよく溶け込んでいます。 動画を用意するまずは背景に表示したい動画を用意します。動画を用意する方法は大きく分けて 4 通り。 自分で撮影するプロに撮影依頼する有料の動画素材を使う無料の動画素材を使う1
![背景に動画を使ったWebサイトの作り方](https://cdn-ak-scissors.b.st-hatena.com/image/square/0d655fcef4ab7c58d6cb6713a454624c6e4ee838/height=288;version=1;width=512/https%3A%2F%2Ffanyv88.com%3A443%2Fhttps%2Fimages.microcms-assets.io%2Fassets%2F2d1b8c905c1d447eb649028ca07253a8%2F6a68fe1181cf47b4bd412aff21648f65%2Fthumb_video.jpg)