ノンデザイナーがクオリティの高いWebデザインを作成する時に気をつけたい4つのポイント

2.揃える

Webページのレイアウトは、一枚の紙をイメージすると良いでしょう。
サイトの名前にあたるロゴをどこに置くか、メニューをどう置くか、問い合わせフォームをどこに置くかなどを、縦・横の両方を意識しながら決めていきます。

Webデザインの場合、レイアウトを「揃える」方法は、「左揃え」「右揃え」「中央揃え」「上揃え」「下揃え」です。

英語や日本語のサイトは横書きで表示されることがほとんどですが、Webデザインでよく使われているのは「上揃え・左揃え」です。それは、左から右に文字を読むからです。
しかし、下揃え・右揃えではダメなのかというと、必ずしもダメなわけではありません。その時々に応じた用途に合わせて、どう揃えるかを決めていくのがいいでしょう。

センタリングに不向きなシチュエーション

最近カラム（段組み）を使わないレイアウトをよく見かけるようになりました。
こうしたサイトでは、テキストを中心に揃えるデザイン（センタリング）がよく使われます。
しかし、センタリングは、場合によって読みにくく、野暮ったいデザインになってしまいます。

センタリングが不向きな次の2つの場合を押さえておきましょう。

- 左右どちらかに画像が添えられているとき
- 本文が長文の時

センタリングは視線を1点に集める効果があり、パーツが2つ以上あったり、1つのパーツが大きい場合には威力を発揮しません。
タイトルとサブタイトルのような、印象に残したい部分に効果的に使いましょう。

3.リズムを作る

単調なレイアウトはユーザーを退屈させてしまいます。
飽きのこないデザインを作るには、リズム感のあるレイアウトを作ることが大切です。

では、リズム感のあるレイアウトとはどのようなものなのでしょうか。

リズムとは、「大事なもの」と「それ以外のもの」を分けて見せる、対比させる、ということです。
例えばWebデザインの場合は、ロゴ、見出し、本文を、色や大きさを変えて重要度を変えていきます。

最近では文章が長いほどSEOに有利だという話もありますが、単に長いだけでは文章は読みにくく、すぐにサイトから離脱してしまいます。
しっかりとリズムをつけることで、同じ文章でもメリハリが生まれ、軽快に読めるようになります。

4.写真や図を活用する

WebデザインはCSSと密接な関係にあるので、文字の装飾にばかり気をとられてしまいます。
しかし、Webデザインを考えるうえで、写真や図をどのように生かすのかも考えておきたいものです。

写真や図は、言葉では説明しにくいことを明確に伝えるという役割があります。

関連するシチュエーションの写真があるだけでも、イメージが鮮明に湧いてくるのが分かります。

数字や規模などを示すデータは、グラフなどで図解すると、説得力が増します。
また、複雑な情報は図解をすると非常に効果的です。文章で読んだり、箇条書きにしても、全体像や出来事の関係が理解しにくいことがあります。
図解することで、個々のポイントの関連性が明確になり、全体像がわかりやすくなります。

余裕があれば、文字と写真や図との比率（ジャンプ率）もチェックしてみましょう。写真や図の大きさ一つとっても、伝わるイメージは大きく変わるからです。

参考：
印象をガラリと変える文字の「ジャンプ率」を理解しよう