ホームページを作る前に知っておきたいデザインテイスト5種【参考サイトあり】

2021/08/12

ホームページのデザインテイストにお悩みの方へ、素敵なWebサイトをテイスト別にご紹介します!

Webデザイナー歴4年、フリーランスでウェブ屋さんをしています!日々デザインのトレンドをリサーチし、Twitterアカウント @tsubasa_kamei にて #スキサイ で発信しています。

クール

キーワード スタイリッシュ・モダン・シャープ・先進的・都会的・テクノロジー・知的
相性の良い業種 IT・コンピューター・テクノロジー・スポーツ
よく使われる色 青・無彩色
クールテイストのデザインテクニック
  • 文字の強弱やウェイトに差をつける
  • 大胆なレイアウト
  • グラデーション
  • 罫線
ホームページを作る前に知っておきたいデザインテイスト【参考サイト厳選】
https://mabp.co.jp

製造業・建設業・不動産業・ヘルスケア業に特化したM&A仲介会社コーポレートサイト。青系で統一された配色がクールな印象のデザインです。欧文タイポグラフィがアクセントに使われていますね。

シンプル

キーワード ミニマル・洗練・モダン・繊細
相性の良い業種 ファッション・生活用品・物販・アート・芸術
よく使われる色 無彩色
シンプルテイストのデザインテクニック
  • 余白
  • 無彩色
ホームページを作る前に知っておきたいデザインテイスト【参考サイト厳選】
https://www.comp.jp

日本発のバランス栄養食COMP通販サイト。商品パッケージのデザインとモノトーンで統一されたサイトデザインがマッチしています。最小限の情報を掲載したシンプルなデザインですね。

エレガント

キーワード 優雅、繊細、上品、気品、シック
相性の良い業種 ホテル・旅館・ファッション・美容
よく使われる色 低彩度色・ピンク・紫・ベージュ
エレガントテイストのデザインテクニック
  • セリフフォント
  • 低彩度色
  • 余白
ホームページを作る前に知っておきたいデザインテイスト【参考サイト厳選】
https://mille-la-chouette.jp

ウエディングブーケ・花冠・フォトボックス等の通販サイト。女性をターゲットにしたガーリーな色使いに、ゆったりとしたインタラクションが上品な印象を与えますね。

ナチュラル

キーワード 手書き感・オーガニック・アーシー・素朴・優しい・親しみやすい
相性の良い業種 飲食・レジャー施設・旅行・観光・キッズ
よく使われる色 緑・茶
ナチュラルテイストのデザインテクニック
  • 手書き感のあるイラスト・フォント
  • アースカラー
  • 丸みのある形状
ホームページを作る前に知っておきたいデザインテイスト【参考サイト厳選】
https://tomatoto.jp

高知県日高村のゲストハウスのWebサイト。画像の角丸やボタンなど細かい部分の手書き風加工が、優しくナチュラルな印象を与えます。

ポップ

キーワード カジュアル・カラフル・元気・楽しい
相性の良い業種 レジャー施設・商業施設・キッズ
よく使われる色 赤・黄・多色配色
ポップテイストのデザインテクニック
  • 多色配色
  • 高彩度色
  • イラストで楽しさを演出
  • ダイナミックな構図
ホームページを作る前に知っておきたいデザインテイスト【参考サイト厳選】
http://www.kurokitec.com

兵庫・伊丹にある遊園地の乗り物屋さんのコーポレートサイト。工業系のコーポレートサイトですが、ポップで遊び心のあるデザインです。跳ねるようなアニメーションやカラフルなイラストが遊園地のイメージにぴったりですね。

まとめ

今回はホームページのデザインテイストをご紹介しました。目的とターゲットに沿ったデザインでより良いホームページを作りましょう!