ホームページの作り方

非デザイナー向け!ホームページデザインの基本4つ

「デザイナーに依頼する予算がなく、自分でホームページデザインをしたい」
「ホームページ制作の担当になったが、どんなデザインがいいのかわからない」

この記事は、【デザインの基礎を学んでいないが、ホームページデザインをしたい】皆さまへ向けて書いています。

皆さま、こんにちは。

この記事にはホームページデザインに悩んでいる方々がたどり着かれていると思います。デザインは大変な仕事ですので、ノンデザイナー(非デザイナー)がデザインをしなければならないというのは大変な心労だろうと思います。

デザインには答えがなく、気にいるものを作りたいと思えば、いくらでも追求できます。

しかし、予算のない非デザイナーがホームページデザインをするとなったとき、凝りすぎると「技術の壁」に阻まれ、時間ばかりを使ってしまいます。費用対効果が下がり、とても損です。

絶対に外してはいけないポイントを押さえて、時間を掛けすぎずに完成させることが望ましいです。

そこで今回は、ホームページをかっこよく見せるために最低限守るべきデザインの基本を4つお伝えします。

シンプルな4つですが、これを避けては「お客様に好かれるホームページ」はできません。とても重要なポイントです。

はじめに:嫌われるホームページを知ろう

さて、「好かれるホームページ」は個人差があってはっきりと答えを出すのは難しいですが、「嫌われるホームページ」ははっきりと答えが出ています。

・わかりにくく、ゴチャゴチャしている
・文字が小さい
・情報が不足気味、知りたいことがわからない
・片手間に作られたことがわかる(気配りが少ない)

だいたい嫌われる原因は、このようなポイントに集約されます。
まずはこれらのポイントを避けられるよう、意識して作っていきましょう

今回のデザインの基本として挙げた4つのポイントは、「好感度が低いホームページ」にならないための最低限のラインと言えます。この4つに気を配らないと、せっかく作ったホームページが逆効果になる可能性大ですので、ぜひこの4つだけは押さえてもらいたいと思っています。。

デザインの基本1:業種に合わせたカラーを1つ決める

ホームページの第一印象を決めるのが、カラーです。
まずここで大切なのは、メインで使うカラーを1つ決めて、あまりたくさんの色を多用しないことです。

前項目で「嫌われるホームページ」について、「ゴチャゴチャしている」という答えがありました。このゴチャゴチャは、色味を多用するとお客様(ホームページ訪問者)にひと目で伝わります。

ゴチャゴチャが伝わると、「古臭い」「ダサい」「おしゃれじゃない」イメージが付いてしまい、それを払拭するのは困難になります。

まずはゴチャゴチャしないよう、カラーを1つ決めて、色を選ぶ場合はその色を基本として使うようにしましょう。

カラーを決めるのは、業種のイメージと合っているかどうかを判断基準とします。

  • 建築会社:木材を連想させる茶、自然を感じさせる緑、モダンなデザインの住宅を作るのであれば黒など
  • 士業(弁護士、司法書士等):信頼を与える青
  • 介護施設:優しさを表すピンクやベージュ
  • エステサロン:華やかさや豪華さを伝えるゴールド

同じ業種のホームページを見ていると、よく使われている色がわかってきます。それに合わせておけば間違いないでしょう。

デザインの基本2:フォントは種類もサイズも統一する

こちらもゴチャゴチャと見せないために大切なポイントです。
カラーと合わせ、お客様の第一印象に大きく響くのがフォントです。

まずはフォントの種類ですが、いろいろなものを合わせて使った上でキレイに見せるにはデザインの高い技術が必要です。そのため、デザインの基本としては、フォントは1種類にしぼります

サイズも「見出し」「本文」の2つでどちらをどのサイズにするか決めておき、ずっとどのページでも同じ設定で書いていきましょう。

太字(強調)も使いたくなりますが、使わずに済ませたほうがすっきりとおしゃれに見えます。

デザインの基本3:お客様に本当に必要なものを丁寧に載せる

ホームページのどの位置に、何を載せるかを決めるのもデザインのうちです。
1ページの中に割り付けていくのはレイアウトデザインと呼ばれます。

このレイアウトをしっかり考えて作っておくと、「よく考えられた、親切なデザインのホームページ」とお客様に印象付けられます。

まず、ホームページに訪問してくださるお客様は、何を見たいと思っているのか考えましょう。

  • ネット予約をしたい
  • 電話番号を知りたい
  • 資料請求をしたい
  • 実績をみたい
  • 料金を知りたい

など、これは企業・サービスによって様々でしょう。
まずは仮設を立てて、お客様に必要であろう情報をピックアップします。

そしてそれに優先順位をつけ、ホームページの中にどういう配置で並べればわかりやすいか考えましょう。

できれば載せたい情報や写真を印刷して並べながら、ホームページの配置や情報量を何度も検証するのがよいでしょう。

ゴール地点は「お客様が必要な情報を探しやすいホームページ」です。

見つけられなければ、ホームページからの売上につなげられませんし、ホームページを作った意味もありません。逆に、悪印象を与えてしまい逆効果になりますので、載せる順序決めも丁寧に、何度も検証しましょう。

デザインの基本4:写真は1枚を大きく載せる

ホームページを作るための技術や時間がそれほどない場合、デザインの基本となるのは写真です。

伝えたいイメージに近い写真を1枚バシッと載せれば、それだけでビジュアルは完成します。

写真を使わずイラストやタイポグラフィに頼るデザインもありますが、写真を使ったデザインと比較すると、非常に高度な技術が必要です。

そのため、基本としては写真を使ったデザインパターンを推奨します。

そして、この写真を使ったデザインパターンの場合、写真の選び方と配置の仕方がキモとなります。配置を考えるのも大変なので、まずは大きく1枚の写真を真ん中に大きく配置するようにしましょう。

あとは、どの写真を使えばいいか決めるだけです。
選び方は、伝えたいイメージがいちばん表現されていると思う写真をピックアップするだけですが、、これもなかなか難しいです。

  • 製品の写真:いちばん見せたい部分が写っている
  • お店の写真:いちばん素敵に見えるアングルから撮ったもの
  • サービスの写真:形のないものの場合はサービスする人にフォーカスした写真

iPhoneカメラでも今はとてもキレイに撮れますので、何枚も別のアングル、違うものを撮影し、どれがいちばん伝えたいイメージに近いか考え、選びましょう。

まとめ

4つのポイントをまとめてお伝えしましたが、「これはデザインの話なのか?」と思われたかもしれません。

しかし、デザインとは設計のことです。
目的に合わせて設計されることが、デザイン性のあるホームページなのです。

そして最低限度として、カラーやフォント、写真選びで訪問者に悪い印象を与えないこと。好感度を上げること。

まずこれをクリアし、少しずつ変更を加えながら、よりよいものへ高めていきましょう。

ホームページ簡単制作 PAGEKit

どうしてもホームページ作りが難しいという場合はページキットにおまかせください。

かんたん3ステップ最短15秒で、業種ごとにぴったりの文章が入ったホームページが作れます。サポートつきで30日間無料でお試しいただけます。

サンプルを作ってみる