なんだか変なデザインになっていないかな？ ホームページを制作する際、気をつけると良いポイントをまとめました。
デザイン編です。
配色について
1.色を使いすぎない
色は、使えば使うほど見づらくなります。
バランスをとることも難しくなります。
一般的にサイトカラーは、ベースカラー・メインカラー・キーカラーの3色でまとめるのがよいとされています。
下記の画像であれば、ベースカラーは白。メインカラーはグレー。キーカラーがきみどり。サブカラーとして山吹色を用いています。
キーカラーは、その企業やサービスの哲学を表現できると良いです。
サブカラーは、その哲学を踏襲しつつも、ボタンやアイコン、注意を促したい箇所に最適であるなど、機能の幅を広げられる色だと理にかなっています。
コンセプトによっては色数を増やす場合もありますが、その場合も、面積を広く取りすぎないなどでバランスをとります。
また、近い色で幅を持たせて色の選択をするとまとまりやくなります。同系色でまとめて「基本色＝サービスの色」という印象をユーザーに残すブランディング手法もあります。
2.強烈な色ばかり使わない（原色や蛍光色など）
若い方向けのサービスだと、原色を使いたくなるかもしれません。
スポーツの分野では、蛍光色を使いたくなるかもしれません。
けれど全ての色が強烈な色ばかりだと、閲覧者はどこに注意を向けて良いのかわからなくなります。
エキセントリックな印象にもなりがちです。
それが希望どうりの状態ならば良いのですが、閲覧者が視覚的に疲れてしまい、眺めることが困難なホームページであるならば再検討が必要です。
派手な色を2色使うなら3色目は無彩色にするなど、引き立てあうような配色の工夫がおすすめです。
3.色にメリハリをつける
隣り合う色同士に差があるほど、文字は読みやすくなります。（左）
背景色と文字の色の差が少ないほど、読みにくくなります。（右）
白黒印刷をしたらどのようになるか？文字が埋もれて読めなくなってしまう場合は、再検討が必要です。
4.色が目的と合わない
色は人に伝わる意味があります。
また、色の意味が目的と合わないと違和感を感じます。
さらに、記号と組み合わさることでその意味を強めます。
黄色であれば、注意喚起や、子供らしさ、遊びなどのイメージなどがわきます。
赤であれば、危険や興奮、活力といったイメージと結びつきます。
そのため、注意や危険を伝える時に、薄紫いろが用いることはありません。
反対に、安らぎが特徴であるサービスに原色の「赤」や「黄」は違和感につながります。
競合他社が使わないので、目立ちやすくなる可能性があるかもしれませんが...。
その場合も、綿密な計画やブランディングが必要です。
フォントについて
5.書体がイメージに合わない
書体の印象は、思っている以上に全体の印象を左右します。
丸みのあるデザインは親しみを持ちやすいなどです。
女性向けの繊細なサービスなのに、フェルトペンで書いたスーパーの激安&太字も、違和感を感じると思います。
6.書体の種類が多い
色彩と同じように、書体も混在するほど読みづらくなります。
7.文字の大きさ・文字数・行間・余白のバランス
新聞を見ると、まずは見出しが入ってきますね。
次に、大中小と文字が並び、読みたい度合いにあった表現をしています。
文字の大きさや情報量の変化に規則性があり、適切な余白があることが大切です。
8.文字の装飾が多い
立体化されたり、影があったり、装飾や枠線をつけすぎる事も、違和感を感じやすいです。リンクなのアンダーラインなのか、見る人に誤解を与えたりします。
ここぞという大切なところに使うことが大切です。
画像について
9.比率を変更する
画像や文字の比率を変えることも、おすすめしません。
人物写真であれば特に、左右反転することも奇妙な印象を与えます。
10.解像度がおかしい
「画像解像度」とは、その画像がどのくらいの密度で構成されているかを数値で表したものです。
解像度が低いと、写真がギザギザになったり、細部がぼやけた印象になります。
大きすぎると、表示や管理の際に負荷がかかるので、最適なサイズであることが大切です。
11.知りたい部分がはっきりわかる
知りたい部分がはっきりわかると、見る人は安心して判断できます。
通販サイトで、シルバーなのか、灰色なのか、分からなかったらもどかしいですよね。
12.配置がおかしい
詰め込みすぎていたり、セットで見るべき情報が遠く離れていたりすると、違和感を感じます。
コンセプトについて
13.優先順位をつける
大切なことがわからないと、ただ情報が並んでいるという状態になってしまいます。もしくはばらばらな印象を受けます。
また、できるだけ多くの情報を伝えたくなるのですが、人が一度に受け取れる情報はそれほど多くはありません。覚えていられる情報はさらに少ないです。
どうしても優先順位をつけられない場合、「何を見せるか」より「何をみせないか」に着目してみると、本当に伝えたいことが確認できるかもしれません。
14.統一感がない
文字のサイズや使用している色、余白、配置、写真のトーンなどに規則性や統一感があると、品格が生まれます。
ルールがばらばらだと、見ている人は１つ１つ新しい情報を汲み取ることになり、何だか疲れてしまいます。
目に見える美しさ、目に見えない工夫
目に見える美しさを作るために、目に見えない工夫を重ねてゆくと、すっきりと美しいデザインに近づくと思います。
１つ１つの作業で考えないで済むので、その結果、悩みが減ると思います。
もちろん、型をやぶる美しさもありますが、初心者さんのうちは、「べし」より「べからず」を守る方がわかりやすいと思います。慣れてゆくと自然と、判別がつくと思います。
Kikkaのホームページ制作では
Kikkaでは、ホームページ制作のヒアリング時に、あなたの好みなども伺って、なるべく齟齬のない進行を心がけています。
お好みのデザインや色、構成、雰囲気などを、ご自由にお伝えいただけたらと思います。
好きなものばかりではなく、嫌いな例でもとても参考になります。
何事もイメージして、伝えていただくことからはじまりますので、どうぞご自由にお話しくださいね。
