menu

Web担当者なら知っておきたい、今注目の3つのWebデザイントレンド

リニューアル

Webデザインのトレンドは目まぐるしく移り変わるものですが、オウンドメディアなどの運営に携わるなら、やはり最低限の知識は持っておきたいもの。デザインの特徴・効果を知って入れば、リニューアルの際の打ち合わせもより本質的なディスカッションになりますし、コンテンツ作成のヒントを得ることもできるはずです。今注目を集めている3つのWebデザインをご紹介します。

・背景への動画埋め込み
ページを開くと自動的に動画が再生されるWebサイトはこれまでもありましたが、動画を使うと表示速度が遅くなりがちで、ユーザーのストレスにつながりやすいのが課題でした。それに対してHTML5のvideoタグやJQueryを使うことによって、表示速度を保ったままブラウザのバックグラウンドに動画を取り入れるWebサイトが増えてきています。

福岡県内をはじめとした九州・沖縄エリアのブライダル会場を紹介する「ブラなびプラス」では、トップページの背景としてテレビCMのような動画が使われており、ユーザーの目を惹きつける大きな効果を生んでいます。

参考:ブラなびプラス

・パララックスデザイン
「パララックス」とは、日本語に訳すと「視差効果」といった意味です。ページをスクロールすると、複数の画像のレイヤーがそれぞれ異なるスピードで表示され、奥行きのある視覚効果を与えるのがパララックスデザインです。下のWebサイトでは画像だけでなくキャッチコピーや数字といった複数の要素が時間差で表示され、雑誌のページをめくっているような感覚でコンテンツを楽しめます。

参考:enod Resto & Din Ap’

こうしたパララックスデザインは2013年頃からあったものの、当時はただやみくもにパララックスを取り入れただけのWebサイトも多く、ユーザーがページのどこにいるのか分からなくなったり、スクロールが遅くなったりするケースもありました。現在ではそうした課題も解消され、目的に沿った手法の1つとしてコーポレートサイトや採用サイトなどでも取り入れる企業が増えてきています。

・インタラクティブな表現
HTML5やJQueryの登場によって、マウスの動きやスクロールにあわせてさまざまな要素が表示されるインタラクティブな表現も一般的になりました。下のサイトでは、マウスポインタに連動して画像の色彩がアーティスティックに変化します。

参考:KAZ ARAHAMA FHOTOGRAPHER

リニューアルに関するご依頼、ご相談、お見積はこちら

小野 良勝 代表取締役

投稿一覧

横浜の制作会社アイティネットの代表取締役。WEB、モバイル、DTP、デジタルサイネージを事業展開。それぞれの特性を活かした メディアミックスを得意とする。iPhoneやiPadを活用したBtoB向けのアプリケーションを開発。モチベーションの高い人や異業種との交流がたまらない。華の47年組。趣味はオートキャンプ

キービジュアル・広告制作に役立てたい、絵画・アート作品のコレクションサイト3選

カゴ落ちの理由の第1位は?WorldPay社のリサーチに見る原因と対策

関連記事

  1. 「やだ…こんなにある…」Webサイトリニューアルで失敗する13の…

    Webサイトをリニューアルして心機一転するのは非常に気持ちいいですよね!ただし、リニューアルに成功す…

  2. 消費者の意見=ニーズではない?ユーザーアンケートの注意点

    Webサイトの課題の背景・理由を洗い出す定性データの把握・分析において、ユーザービリティテストと並ん…

  3. 画像編集ソフトが苦手な方も安心。手軽なシネマグラフ作成ツール3選…

    画像の一部にピンポイントな動きを加えることによってアクセントをつけ、アイキャッチ効果を高めることがで…

  4. Webサイトの運用で起こりがちな3つのトラブル&対応方法について…

    Webサイトのデザインや機能はもちろん大切ですが、それ以上に大切なのが運用保守です。高い予算をかけて…

  5. Macユーザーは注目。日常業務を効率化できる4つのMac専用アプ…

    日常的な業務用PCとしてMacを使っている方が増えてきているのではないでしょうか。以前のMacは映像…

  6. 行動心理学でCVRを向上させる。Web担当者が知っておきたい3つ…

    日々Webサイトの改善に取り組むなか、「狙い通りのCVRになかなか到達しない」、「商品の魅力が本当に…

  7. リニューアルに欠かせない現状把握&分析。具体的な3つのアプローチ…

    Webサイトのリニューアルを成功させるためには、「ゴールと指標」、「目的と手段」という要素をきちんと…

  8. 多くの企業が取り入れているレスポンシブデザインのメリット&デメリ…

    スマートフォン市場が毎年2桁の成長を続け、ユーザーの過半数がスマートフォンを使ってインターネットにア…

PICKUP

PAGE TOP