背景に動画を使ったWebサイトの作り方
2023年5月12日 jQuery, Webサイト制作, Webデザイン 2012年後半あたりから少しずつ目にする機会が増え、今では海外サイトを中心に世界中に広まった、背景に動画を用いたWebサイト。サイトの雰囲気や、サービスの具体的な内容を背景に流すことで、よりユーザーの視点をスクリーンに注目させることができます。今回はそんな背景動画の実装方法を、実例サイトと共に紹介していこうと思います。 ↑私が10年以上利用している会計ソフト！ KINS WITH 動物病院のWebサイトでは、かわいいわんちゃんの動画とともに院内の様子がよくわかる動画を掲載しています。 AquallのWebサイトでは画面全体ではなく、動画の一部をくり抜いたような形で動画を掲載。背景の装飾としてよく溶け込んでいます。 動画を用意する まずは背景に表示したい動画を用意します。動画を用意する方法は大きく分けて4通り。 自分で
フラットデザインのコツ的なアレ - 納豆には卵を入れる派です。
P4Dで教えていただいたエンジニアさんに聞かれたので、なんか整理しきれてなくてざっくりなんですが、取り急ぎ、なんかそれっぽくなるコツみたいなのを独断と偏見でまとめてみました。 3色〜5色くらいの色を画面の中で均等に使うのおすすめ 作りたいサービスが何で色分けできるか考えます。ちょうどよく3〜5種類くらいのステータスやカテゴリなどがあったら、それに応じて色が変わるとかするとうまくハマる。かも。 Flat UI Colorで色選び http://flatuicolors.com/ という便利なサイトがあって、ここから3〜5色くらい選ぶとよいです。クリックするとカラーコードがコピーされます。あら便利。赤は他の色と仲良くするのが難しめ。 Sassで彩度を抑えると落ち着いた色調になって、使いこなしの難易度が低くなります 上のサイトもそうなんですが、Flat UIによく使われている色は、鮮やかなが多く
ウェブサイトのフッタを魅力的にする10のシンプルなアイデア
昨年くらいからウェブデザインの傾向としてフッタを充実させたウェブサイトが増えてきました。 ユーザーの印象に残り、より利便性の高いフッタを設置する際にヒントとなるアイデアをDesign Shackから紹介します。 10 Techniques for a Fantastic Footer 以下は、そのポイントを意訳したものです。 はじめに 1. プライマリ ナビゲーション 2. 「トップに戻る」ボタン 3. 美しいコントラスト 4. インパクトのあるイラスト 5. 充実したコンテンツ 6. インフォメーション 7. メディア ハブ 8. 新鮮なコンテンツ 9. インフォグラフィックス 10. ビジュアル的なアクセント はじめに 魅力的なフッタは、サイトのユーザーに永続的でポジティブな印象を与えることができます。 フッタのデザインと機能性の両方にフォーカスをあてることで、サイトのフッタを魅力的に
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
