<無料>デザイン修正指示をもっと簡単に効率化

   

デザイン会社が発信するデザイン制作情報

mitekaku journal

2022/11/25

webデザインでは情報整理が重要!その理由やポイントについて解説します!

webデザインでは、情報収集が非常に重要です。
情報収集はwebデザインの最初の行程であり、ここを疎かにしてしまうと情報が足りなかったり、まとまりのないwebサイトになってしまいます。
しかし情報収集がなぜ重要なのかよくわからない方もいらっしゃるでしょう。

そこで今回の記事では、情報収集が必要な理由や、情報をまとめる際に大切になってくるポイントをご紹介します。
webデザインをしている方はもちろん、依頼したい方にも役立つと思います。
ぜひ参考にしてみてください。

webデザインで情報収集を行う理由

デザインとは、「伝えたいことを伝えたい人に分かりやすく届けるための技術」です。
そのため、デザインをする前に情報をしっかり理解しておくことが必須です。
したがって、情報収集・整理が必要になります。

このとき押さえておきたい要素は、以下の通りです。

・なんのためにデザインするのか
・伝えたいことは何なのか
・伝えたいことの中での優先度
・いつどこで目にするのか

コーヒー屋さんのブログのデザインと仮定してみましょう。
「なんのためにデザインするのか」は「客数を増やすため」、「伝えたいこと」は「取扱商品、セールの日程、店舗地図、代表的な商品」、「伝える相手」は「コーヒーを飲む人」となるでしょう。

情報整理が苦手な人の特徴

情報整理の重要性をここまで述べてきました。
一方で情報収集が得意でない方もいらっしゃいます。
その様な方に共通してみられるのは、以下のような特徴です。

情報収取が苦手だと感じる人は、頭の中で考えすぎず、情報収集をある程度で止め、優先順位を付けるようにしましょう。

情報収集が得意でない方の特徴

・頭の中で考えすぎる
・情報を収集しすぎている
・優先順位を付けていない

文字を整理する際のポイント

文字を整理することで、読みやすい文章になります。
ここでは、文字を整理する際のポイントをご紹介します。

1行当たりの文字数

1つ目のポイントは、1行当たりの文字数です。
多くの文章を読む際に視線を頻繁に動かすのは疲れます。
また、次の行を見失ってしまう恐れもあります。
そのため、1行当たりの文字数は30から50文字くらいに設定するようにしましょう。

30から50文字は、視線を固定したまま視認できる文字数で、最も疲れにくいとされています。
これ以上多いと一文を読む際に視線を動かさなければなりませんし、少ないと文章数が増えるので上から下への視線移動が必要になります。

フォントサイズ

2つ目は、フォントサイズです。
通常、ブラウザのフォントサイズは16pxに設定されています。
このサイズは見慣れられているので、特に必要が無ければ16pxで良いでしょう。

また、小さすぎるフォントだと文字がつぶれてしまいますし、大きすぎると文章にまとまりがないように見えてしまいます。
適切な大きさを心がけましょう。

文字間

3つ目は、文字間です。
文字間の目安は、文字サイズの5から10パーセントくらいがちょうど良いでしょう。
広い文字間にすると間延びした印象になり、少し読みにくくなります。
一方で狭い文字間は視認性が悪くなります。

ただし、広い文字間にするとゆったりした雰囲気と高級感が出ます。
また、狭い文字間にすると緊張感が出るため固さを演出できます。
そのため、用途によっては文字間を広くしたり狭くしたりすることも有効である点は押さえておきましょう。

行間

4つ目は、行間です。
Googleでは1.2pmが推奨されていますが、これはアルファベットの場合です。
日本語はアルファベットより少し大きいので、1.5から2.0emくらいに設定すると良いでしょう。
広い行間にすると文章の印象がすっきりし、少しオシャレに見えます。
一方で広過ぎると間延びした印象を与えてしまいます。

また、狭い行間はまとまって見えます。
一方でつまり過ぎていると窮屈感がありますし、次の行を見失う可能性も高まります。

情報が多い場合の情報整理テクニック

グルーピング

1つ目のテクニックは、グルーピングです。
サイトに掲載したい情報があまりに多すぎる場合、まずは情報をグルーピングしてみましょう。
たとえば、以下のような情報があったとします。

とある分析アプリの強み

・スマホで使える
・低価格
・会員にメールを送れる
・実績豊富
・料金が安い
・データ分析可能
・初期費用無料
・1か月間無料
・安全

これはとある分析アプリの強みを書き出したものです。
グルーピングしてみると、製品の強みは「低価格、実績豊富、安全なセキュリティ」、製品情報は「スマホで使える、データ分析できる、会員にメールを送れる」、価格情報は「初期費用無料、1か月間無料、料金5000円」となります。
このように、グルーピングは情報整理において有効な手段です。

強弱をつける

2つ目は、強弱をつけることです。
沢山の情報が並んでいると、「どれに目を向ければ良いか分からない」という状態になりがちです。
そこでコンテンツごとに強弱をつけることで、情報の整理ができます。

たとえば上記の例で1か月間無料である点とスマホで使える点が最大の強みだと考えていると仮定します。
この場合、「1か月無料」と「スマホで使える」という情報を大きくしたり太字にしたりすることで、情報の整理ができます。

段落・見出しを付ける

3つ目は、段落・見出しを付けることです。
これは長文の場合にできる情報整理の方法です。
読みやすくなるため、情報整理に一役買います。

情報が少ない場合の情報整理テクニック

クライアントから伝えられた情報があまりに少ない場合、どのように対処すればよいのでしょうか。

文章を分解して再構築する

1つ目のテクニックは、文章を分解して再構築することです。
とても少ない文章を手渡されて「これでLPを1枚作って」と言われた経験はありませんか。
実は少ない文章であっても、情報量が多ければLPを作ることは可能です。

まずは情報を箇条書きにします。
これが「文章の分解」にあたります。

箇条書きに分解したら、グルーピングをしてみましょう。
グルーピングした時の軸を、見出しとして利用します。

最後に、文章を足していきます。
言い換えや適切な修飾語の使用により、文章は増やせます。

「〇〇カフェは、アクセスしやすい~~に位置する。おすすめはブレンドで一杯300円。こだわった豆を使用している。6:00から18:00で営業している。500円のモーニングも行っている。」
このような情報を分解してみると、以下のようになります。

・〇〇カフェは
・アクセスしやすい~~に位置
・おすすめはブレンドで一杯300円
・こだわった豆を使用
・6:00~18:00で営業している
・500円のモーニングも行っている。

これをグルーピングすると、店名、商品、営業場所・時間のように分けられます。

以上が1つ目のテクニックです。

デザインでなんとかする

文章を分解して再構築することで大抵の場合は少ない文字数でも対処できますが、これでも足りなかった場合は「デザインでなんとかする」ことになります。
これが2つ目のテクニックです。

たとえば、強弱をつけたり、たとえば画像やアイコンを付けたり、英語をつけたしてみたりしましょう。
情報量が多く見えるようになると思います。

ただし、今回紹介したものはテクニックに過ぎません。
少ない情報量では、競合他社のサイトに勝てなくなる可能性が高いです。
そのため、ヒアリングの段階でどれくらいクライアントから情報を引き出せるかが重要になってきます。

まとめ

今回の記事ではwebデザインにおける情報収集の重要性やその方法論、情報を整理するときに使えるテクニックをご紹介しました。
情報は多すぎても少なすぎても、webを作る際には不便です。
ヒアリングの段階で適切な情報を収集しておくことが大切です。

当社では修正指示ツール「mitekaku」を提供しております。
労力のかかる修正指示の効率を高め、より良いデザインにつながりますし、導入も容易です。
デザインを依頼したい方、手掛けている方は、ぜひご利用ください。