サイトのデザインの決め方｜好みで決めない

デザインで揉める会社と、揉めない会社の違いは、センスではありません。決める手順を先に書面にしたかどうかです。 決めるのは3つだけです。誰が最終決定するか（1人）・何を基準にするか（先に文章にする）・何回直せるか（回数と単価）。 この3つが無いまま案を見ると、その場にいる全員の好みが意見として並びます。 この章は、「なんとなく好き」を判断から追い出し、デザインを期限内に終わらせるための章です。

この章で分かること

• 決定者1人・確認者3人以内にする理由と、体制の決め方
• 判断基準の作り方（3語で決める）と、参考サイトの正しい集め方
• 修正回数の決め方、スマホでの確認、好みと成果が食い違ったときの決め方

デザインで揉めるのは、判断の基準が無いから

案を見せられたとき、基準が無ければ、人は自分の好みで答えます。これは誰のせいでもなく、基準を渡していないほうの問題です。

もう少し踏み込むと、デザインの議論が長引くのは、参加者が悪いからではなく、答え合わせの相手が存在しないからです。原稿なら「この数字は合っているか」という確かめ方があります。実装なら「動くか動かないか」で決まります。デザインには、その場で正誤を判定する手段がありません。判定できないものについて意見を求められると、人は自分の感覚を答えるしかありません。

つまり、基準を先に作るというのは、答え合わせの相手を人工的に用意する作業です。3語の基準を紙に書いて全員に配った時点で、議論は「好きか嫌いか」から「基準に合っているか」に変わります。参加者の顔ぶれも人数も同じなのに、出てくる発言が変わります。

この切り替えは、案を見る前にしか行えません。案を見た後に基準を作ると、すでに芽生えた好みを説明するための言葉が選ばれます。順番が逆になった時点で、基準は機能しません。

基準が無いときに出る意見	実際に起きること
「もう少し明るく」	何色にすれば終わりなのか誰も分からない
「高級感がほしい」	人によって想像する高級感が違う
「社長が青が好きだから青で」	読み手の判断材料にならない
「他の人にも見てもらいましょう」	確認者が増え、意見が増え、期限が延びる
「なんか違う」	直す方向が分からないので、修正回数だけ消費する

この表は、こうした発言を封じるためのものではありません。発言そのものは自然で、止めようがないからです。使い方は、右の列を見て「いま起きているのはこれだ」と気づくことにあります。打ち合わせの場でこの表を開いておき、5行のどれかが出たら、その場で3語の基準に戻る。それだけで、往復の回数はかなり減ります。

デザインの修正が往復すると、回数の上限を使い切って追加費用が出ます。 4章で修正回数と単価を書面にしているのは、このためです。

決定者は1人、確認者は3人以内

体制は1章で決めたものをそのまま使います。この章では、それが守られているかを確認します。

役割	人数	この章でやること
最終決定者	1人	案を1つ選ぶ。修正の採否を決める
窓口	1人	社内の意見を集約し、1通にまとめて制作側に渡す
確認者	3人以内	意見を出す（決定はしない）

決定者が2人いるデザインは終わりません。 2人が別の案を選んだとき、誰も決められないからです。「社長と専務の両方がOKを出したら確定」という形は、決定者2人と同じです。

確認者を3人以内にするのは、増えるほど「念のため」の意見が増えるからです。そして、意見は窓口が1通にまとめてから渡してください。 5人がばらばらに制作側へ連絡すると、矛盾した指示が同時に届きます。

たとえば、決定者は社長ということになっているのに、実際には役員3名の合議になっている会社を考えます。案が出るたびに3名の意見が分かれ、社長は「みんなが納得する形で」と言い続ける。制作側は、3名それぞれの指摘を全部取り込んだ案を作ります。すると今度は、3名全員が「まとまりがない」と言う。当然です。3つの方向を1枚に載せたのですから。こうしてデザインが何か月も止まります。

抜け出す方法は、役員3名は確認者、決定は社長1人と書面で決め直すことです。案の質が上がるわけではありません。誰が決めるかが決まるだけで、修正は収束します。

こうした揉め方で失うのは、止まった期間と、使い切った修正回数ぶんの追加費用です。デザインが揉めたときの損失は、たいていこの2つで出ます。見た目が悪くなるのではなく、期限と費用が崩れます。

社内の意見の集め方も決めておきます。

決めること	合格の状態
意見を出す期限	「提示から◯営業日以内」
意見の出し方	1つのファイル・1通のメールにまとめる
矛盾したときの扱い	決定者が選ぶ（多数決にしない）
決定の記録	「◯月◯日、A案で確定」と書いて残す

最後の行を忘れると、公開直前に「やっぱりB案が良かった」が出ます。 確定した日と案を1行で残してください。

判断基準を、先に3語で決める

案を見る前に書きます。「誰に、どう見られたいか」を3語以内に絞ってください。

目的	3語の例	その結果決まること
取引前の信用確認	堅実・清潔・実績がある	派手な装飾を入れない。情報量を整理する
採用（若手）	風通しがよい・成長できる・人が見える	人の写真を大きく使う
高額商材の相談	落ち着き・専門性・丁寧	余白を広く、文字を読みやすく
地域密着のサービス	親しみ・近い・すぐ来てくれる	顔写真と電話番号を目立たせる
EC（日用品）	分かりやすい・安心・買いやすい	商品写真と価格を最優先

この表は、自社に当てはまる行を選ぶための表ではありません。右端の列——3語を決めると何が決まるか——を見て、3語という抽象的なものが実際の判断にどうつながるかを確かめるための例です。自社の3語は、この5行のどれとも違って構いません。大事なのは、選んだ3語から右端のような具体的な指示が導けるかどうかです。導けない3語は、抽象的すぎます。「誠実」「信頼」「品質」のような言葉は、どの会社にも当てはまるので、結局何も決まりません。

3語が決まると、意見が好みではなく基準との照合になります。 「もっと明るく」ではなく「『堅実』から離れませんか」と言えるようになります。制作側も直す方向が分かります。

3語は、1章の目的の1行と矛盾してはいけません。 「問い合わせを取る」が目的なのに3語が「独創的・先進的・かっこいい」になっているなら、どちらかが間違っています。

参考サイトは3つ、理由つきで集める

「好きなサイトを送ってください」と言われて、なんとなく集めると失敗します。集め方に手順があります。

手順	やること
1	同業他社を3〜5サイト見る（良し悪しではなく「何が書いてあるか」を見る）
2	自社の読み手が普段見ているサイトを挙げる（業種は問わない）
3	その中から3つ選び、「どこが良いか」を1行ずつ書く
4	逆に「これは避けたい」を1つ挙げ、理由を書く
5	3語の基準と照らし、ずれているものを外す

3番が必須です。 URLだけ渡すと、制作側は何を参考にすればよいか分かりません。「トップの1行で何の会社か分かる」「価格の表が見やすい」「スマホで文字が読みやすい」のように、部分を指してください。

良い集め方	避けたい集め方
「このサイトの、価格表の見せ方」	「このサイトの全体の雰囲気」
「トップの1行で対象が分かるところ」	「なんとなくおしゃれ」
「スマホで読みやすい文字の大きさ」	「有名企業のサイトだから」
「避けたい：写真が多すぎて何の会社か分からない」	（避けたい例を挙げない）

予算規模の違うサイトを参考に出すのは構いません。 ただし「同じものを作ってください」ではなく「この部分の考え方を使いたい」と伝えてください。大企業のサイトは、原稿も写真も専任の担当が作り続けています。

進め方：トップで方向を決めてから、全ページ

全ページを同時に進めると、方向が変わったときに全部やり直しになります。順番は決まっています。

順	段階	決めること	確認する人
1	構成（5章）	ページと導線	決定者・窓口
2	トップページの案	方向（3語との一致・色・文字の雰囲気）	決定者＋確認者
3	下層ページ	トップで決めた規則を適用	窓口（大きな判断は決定者）
4	スマホ表示	実機で見る	決定者・窓口
5	実装（8章）	—	—

2の段階で、色・書体・余白の方向が決まります。 ここを曖昧に通すと、下層ページが出てきてから「やっぱり違う」となり、全ページ分の修正になります。トップの確定に時間をかけるのが、結果として最も早い進め方です。

案の数は、多ければ良いものではありません。3案出されると、どれも中途半端な検討になり、「1案目の色で3案目の構成」のような足し算が始まります。 当社は、方向が決まっていれば1案を詰める形を勧めています（デザイン制作の単発では3案からお出しすることもありますし、ロゴ制作は3案お出しして1案に絞る形です）。何案出るかは、発注前に書面で確認してください（4章）。

1案か3案かで迷ったら、3語の基準が決まっているかどうかで判断してください。基準が固まっているなら1案で足ります。基準に照らして直していけば、同じ場所に着くからです。基準が固まっていない、あるいは社内で意見が割れていて方向そのものを見比べたい場合は、3案出してもらう価値があります。ただしその場合は、3案から良いところを寄せ集めないと先に決めておいてください。寄せ集めた案は、どの案よりも悪くなります。

修正回数は、先に決めたほうが早く終わる

「ご納得いくまで修正」は、発注側に有利な条件ではありません。回数が決まっていないと、制作側は時間の予算を持てず、後半の対応が遅くなります。

決めること	書き方の例
デザイン確定までの修正	「◯回まで。以降は1回◯円」
追加費用が出る条件	「方向性そのものを変える作り直しは別見積もり」
修正の出し方	1回につき1通にまとめる（小出しにしない）
公開後の無償修正	「公開後◯日以内の誤字・リンク修正は無償」

当社の単発のデザイン制作では、修正は2回まで無料、3回目以降は1回1万円としています（税別。方向性を変える作り直しは別見積もり）。サイト制作では制作費に一定回数を含みます。金額の多寡より、「回数と単価が書面にあること」が重要です。

回数を決めることが発注側に不利に見えるのは、上限があると遠慮しなければならない気がするからです。実際は逆に働きます。上限があると、1回の修正にまとめて出す習慣ができます。まとめて出された修正は、制作側が全体を見て直せるので、1回で意図に近づきます。思いついた順に小出しにすると、直した先からまた別の指摘が来るので、回数だけが消えていきます。上限は、発注側の出し方を整える装置でもあります。

「なんか違う」を翻訳する

修正依頼は、感想ではなく基準との差で書くと1回で伝わります。

言いたくなること	伝えるべき形
「なんか違う」	「3語のうち『堅実』から離れて見える。装飾を減らせますか」
「もっと目立たせて」	「問い合わせボタンが、スクロールしないと見えない」
「若い感じにしたい」	「採用の読み手は20代。写真の人物が全員50代に見える」
「文字が多い」	「スマホで2画面ぶん文字が続く。見出しで区切りたい」
「高級感がない」	「参考サイトAの余白の取り方に近づけたい」

どれも、3語の基準・参考サイト・読み手のどれかに紐づけています。 紐づけられない指摘は、好みの可能性が高いので、出す前に一度止めてください。

スマホで確認する。文字の大きさも見る

確認は実機で行ってください。 パソコンの画面で縮小表示したものは、実際の見え方と違います。

確認すること	合格の状態
本文の文字の大きさ	腕を伸ばした距離で無理なく読める
見出しと本文の区別	ひと目で段落の切れ目が分かる
ボタン	指で押せる大きさ。押し間違えない間隔がある
問い合わせ導線	スクロールしなくても入口が分かる（5章）
写真	顔や商品が切れていない
表	横にはみ出していない／スクロールできる

決定者が年配の場合、自分が読める大きさを基準にして構いません。 読み手も同世代であることが多く、読めない文字は読まれません。逆に、読み手が若くても、小さすぎる文字が有利になることはありません。

ロゴ・色・書体の規則

既にロゴやブランドの規則があるなら、それに従います。無い場合、サイトと同時に作るかどうかを決めます。

状況	判断
ロゴがあり、色と書体の決まりもある	それに従う。サイト側で変えない
ロゴはあるが、使い方がばらばら	サイト制作に合わせて、最低限の規則（色・書体・余白）だけ決める
ロゴが古い・データが無い	サイトと同時に作り直すか判断する（ロゴ制作 20万円〜）
ロゴが無い	先にロゴを作る。サイトの後だと全ページに反映し直す
名刺・資料も揃えたい	ブランド規則一式 50万円〜（名刺・資料テンプレートは5万円〜）

ロゴを先に作るのは、後回しにすると全ページの色を作り直すことになるからです。 ただし、ブランディング自体はすぐに売上を増やす仕事ではありません。今すぐ問い合わせを増やしたい場合は、サイト改善や広告のほうが先です。当社もその順でお伝えしています。

なお、Webで使う書体（フォント）にはライセンスがあります。 年額のものもあり、支払いが止まると表示が変わります。誰の名義で契約し、誰が払い続けるのかを契約書に書いてもらってください（4章）。

好みと成果が食い違ったときの決め方

これを先に決めておくのが、この章の最後の仕事です。

制作側が「この見せ方のほうが数字が出ます」と言い、発注側が「好みではない」と言う場面は必ず来ます。そのときの決め方を、着手前に1行で決めます。

決め方	向く場合
数字を優先する（公開後に測って判断する）	LP・EC など、成果を数えられるもの
好みを優先する（理由を聞いたうえで決定者が決める）	会社の顔として長く使うもの
両方作って比べる	広告を出していて、比較できる量の訪問がある場合のみ

当社の形も書いておきます。見た目の好みと数字が一致しない場合、理由をお伝えしたうえで、最終的には発注側の判断に従います（LP制作のFAQ）。決めるのは発注側です。ただし「言われなかった」をなくすために、理由は必ず先に伝えます。

作り直さない・頼まない判断

状況	判断
流入も問い合わせもある。見た目が古いだけ	デザインを作り直さない。 3章の切り分けに戻る
社内資料・採用パンフだけ整えたい	サイトは触らない（デザイン制作 5万円〜）
予算が小さく、ページも少ない	既製テーマ・テンプレートで足りる。ただし更新のしやすさは落ちる
3語の基準が決まらない	決まるまで着手しない。案を見ても選べない
決定者が決まらない	着手しない（この章の必須項目）
ロゴを変えたい理由が「飽きたから」	変えない。認知が積み上がったロゴには価値がある

既製テーマの行について補足します。 既製テーマは自由度が高い反面、入力欄が多く、どこを触ればどこが変わるのか分かりにくくなります。当社は必要な入力欄だけを残して壊せない形にしますが、予算が限られていて、更新も自分たちでやると決めているなら、既製テーマで始めるのは合理的な判断です。

よくある間違いを5つ

「案を見てから基準を考える」 ——案を見た瞬間に好みが働くので、後から作った基準は「選んだ案を正当化する理由」になります。直し方：案を見る前に3語（誰に・どう見られたいか）を書いて、窓口が保管する。案が出たら、その紙と照らして判断する。

「社内の全員に見せて意見をもらう」 ——意見は必ず割れます。割れた意見を平均すると、どこにも尖りのない見た目になります。しかも期限が延びます。直し方：確認者を3人以内に固定し、意見は窓口が1通にまとめる。矛盾したら決定者が選ぶ（多数決にしない）。

「参考サイトのURLだけ送る」 ——制作側は、そのサイトの何を参考にすべきか分かりません。全体の雰囲気を真似ると、自社の原稿量や写真では成立しません。直し方：3つに絞り、「どこが良いか」を1行ずつ書く。避けたい例も1つ、理由つきで出す。

「パソコンの画面だけで判断する」 ——多くの読み手はスマホで見ます。パソコンで整っていても、スマホでは文字が小さく、ボタンが押しにくいことがあります。直し方：決定者が自分のスマホの実機で開いて確認する。本文が読める大きさか、問い合わせの入口が分かるかを見る。

「修正は納得いくまで、と言っておく」 ——回数が決まっていないと、制作側が時間の予算を持てず、後半ほど対応が遅くなります。結局、公開が遅れます。直し方：回数と単価を書面にする。そのうえで、修正は1回につき1通にまとめて出す。

この章の出口

この章を終えたとき、手元に残っているべきものは3つです。

1. 決定者1人・確認者3人以内の名前と、意見の集め方・期限
2. 3語の判断基準と、理由を書いた参考サイト3つ（＋避けたい例1つ）
3. 修正回数と単価が書かれた書面と、好みと成果が食い違ったときの決め方

見せ方が決まりました。ここから先は、それを動く形にするための仕様です。 CMSで何を触れるようにするか、フォームはどこに届くか、ドメインとサーバーは誰の名義か、速度は何秒を合格とするか。発注側が○×を埋めるべき項目が、まだ12個残っています。

次の章へ：8章 CMS・サーバー・ドメインの決め方