
はじめまして!企業実習生のKです。
職業訓練でWebデザインの基礎知識を学び始めて5ヶ月目の初心者です。
Webデザインの学習を始めて、きっと誰もが一度は「ターゲットを決めましょう」と習いますよね。でも、初心者の私は「ターゲットを決めたのはいいけど、じゃあ実際のデザインはどう変えたらいいの…?」と、完全に迷子になってしまいました。
そこで今回は、私と同じように「ターゲットを決めたその先」で悩んでいる方に向けて、デザインをどう切り替えていけばいいのか、私が調べてみて見つけたヒントを皆さんにシェアしていきたいと思います!
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
そもそも、なぜターゲットを決めて、それに合わせてデザインを変える必要があるのか。
それは、ターゲットによって「心地よいと感じる基準」や身体的特徴による「文字の読みやすさ」、「その情報へアクセスしている状況」などが異なるからです。
例えば、同じデザインを見ていても、スマホの画面を高速でスクロールする10代と、ゆっくり読む60代では、感じ方が違いますよね。
ターゲットにとって「心地よい」サイトを作ること。これこそが、ユーザーを迷子にさせず、離脱率を下げ、最後まで読んでもらえるWEBサイトを作る秘訣です。
今回は、「若い世代」「ビジネスマン」「ファミリー・主婦層」「シニア世代」の4つのターゲットを例に、それぞれに最適な色やフォント、レイアウトの傾向をまとめてみました!
1. 若い世代(10代〜20代)
トレンドに敏感で、スマホでの情報消費スピードが圧倒的に早い。SNS等で視覚からの刺激に慣れており、単調さを嫌う傾向にあります。
直感的な心地よさと、退屈させないデザインが求められます。

⚫︎色(トーン)
・感情を動かす彩度高めのビビッドカラーや心地の良いニュアンスカラー(くすみパステルなど)が効果的。
・その時のトレンドに合わせた配色が響きます。
⚫︎文字(フォント/ジャンプ率)
・フォントは、モダンですっきりしたゴシック体や、無駄な飾りがなく、正円と直線がベースの英字フォント(Futuraなど)が主流。
・流し読みすることが多いため、目に入りやすいようジャンプ率は非常に大きく設定し、キャッチコピーを大胆に目立たせます。
⚫︎レイアウト/余白
・単調を避けるため、余白はあえて不均等に、大胆に取ることで、洗練された「こなれ感」を演出。
・スマホファースト(縦長画面)が大前提。退屈にならないよう、スクロールしたくなるギミックを取り入れます。
2.ビジネスマン(30代〜50代・ビジネス層)
仕事や家事に追われているため、短時間で「信頼性」と「明確なメリット」を判断したい世代です。

⚫︎色(トーン)
・「信頼」「誠実」「知性」の印象を与えるネイビーや知的なブルー、「落ち着き」を与える洗練されたモノトーン、「安定」や「調和」のダークグリーンなど、誠実さと信頼感を与えるディープトーン(明度は低めで、彩度が高いトーン)が中心。
・アクセントカラーには、行動を促しつつ、安っぽさを感じさせない彩度を少し抑えたオレンジやゴールドなどが効果的。
⚫︎文字(フォント/ジャンプ率)
・フォントは、可読性も高く、シンプルで洗練されたゴシック体、または誠実さや高級感を演出する明朝体を使い分けます。
・ジャンプ率は中程度に設定。短時間でも要点を掴めるよう、見出しの重要度(H1, H2, H3)を厳格にデザインします。
⚫︎レイアウト/余白
・すっきり整ったグリッドレイアウトにすることで、信頼感と情報の探しやすさに繋がります。
・余白は「情報の区切り」として機能的に使います。無駄な余白は省きつつ、セクションごとの境界をきれいに空けることで、疲労感を感じさせず、スムーズな情報収集をサポートできます。
3.ファミリー・主婦層(30代〜40代)
家族の安心・安全を第一に考え、日常のリアルな生活感や「共感」を重視する層です。

⚫︎色(トーン)
・リラックス効果や警戒心を解く効果のある、優しく温かみのある暖色系(ベージュ、アイボリー、ソフトなオレンジやピンク)や、安心感を与えるナチュラルなグリーンが好まれます。
・彩度は高すぎず低すぎないライトトーンやペールトーンで、親しみやすさと清潔感を表現します。
⚫︎文字(フォント/ジャンプ率)
・フォントは、角が丸く親しみやすい丸ゴシック体や、人の温度を感じさせる手書き風のフォントが適しています。
・ジャンプ率はやや高めに設定することで、マルチタスク状態の脳に負担をかけない工夫を。「〇〇の悩みに!」「ママに嬉しい」といった共感ワードを目立たせ、自分ごと化してもらうためのメリハリをつけます。
⚫︎レイアウト/余白
・丸みのあるフレーム、波線、イラストなどを多用した、賑やかで楽しく、安心感のあるレイアウトが効果的です。
・余白は、「ゆったりとした安心感」を感じられる広さを意識します。あたたかい家庭の雰囲気をイメージさせる、余白の空け方が重要です。
4.シニア世代(60代以上)
身体的な変化(老眼など)や、ITデバイスへの慣れ親しみ度を考慮し、「誰でも迷わず、スムーズに操作できるアクセシビリティ」が最優先される世代です。

⚫︎色(トーン)
・加齢などにより青系の色は見えにくく、茶色っぽく見えることがあります。見えやすい色は赤、オレンジ、緑。
・彩度が高すぎる原色(ビビッドカラー)は、疲労感に繋がるため、落ち着きのある配色(アースカラー、和モダンなど)が適しています。
・背景色と文字色のコントラストをはっきりさせましょう。薄いグレー&白、青&黒など、見づらい配色は徹底的に避けます。
⚫︎文字(フォント/ジャンプ率)
・フォントは、太さが均一で視認性・可読性に優れたユニバーサルデザイン(UD)フォントや角ゴシック体が適しています。基本の文字サイズも大きめに設定しましょう。
・ジャンプ率は中〜高程度にし、見出しと本文の区別を明確にします。ただし、あまりに文字サイズが変化しすぎると視線移動が追いつかないため、規則正しい強弱が求められます。
⚫︎レイアウト/余白
・規則正しく、予測可能なグリッドレイアウトが基本です。どこをクリックすればいいかが一目でわかる、立体感のあるボタンデザインが好まれます。
・余白は、誤タップを防ぐためにボタンやリンクの周囲に十分な広さを確保します。要素を詰め込みすぎず、視線誘導をシンプルに1本化します。
まとめ
Webデザインは「おしゃれさ」だけでなく、ターゲットが「ストレスなく読めるか」「求めている世界観か」が成否を分けます。
今回の題材はターゲットでしたが、より具体化したペルソナを想定することもデザインに活きてくるでしょう。
ペルソナは年齢、性別、居住地、職業だけでなく、趣味、ライフスタイル、価値観、日々の悩みまで、実際に実在するかのような人物像を設定します。
一言で言うと、ターゲットで「市場のどこを狙うか(広さ)」を決め、ペルソナで「その人にどう届けるか(深さ)」を決めます。
マーケティングの段階や目的に合わせて、ターゲットとペルソナを使い分けるのが基本ですので、覚えておくとよいでしょう。
なお、今回取り上げたターゲットはあくまでも一例です。
性別的要素など、更なる要素を考慮する場合は、求められるデザインが変わる可能性もあります。目的とターゲットを整理した上で、デザインを考えてみてください。
ぜひ参考にしていただけますと幸いです。
最後までお読みいただきありがとうございました!

