グラデーションを使用しないでウェブデザインをする方法

Post on:2010年4月20日

除くことを学ぶ

多くのウェブデザインのブログで周期的にページデザインのPhotoshopのチュートリアルを紹介しています。これらは素晴らしいウェブページを作成するためにグラデーションベースのデザインが一般的であるというおかしな印象を与えてしまいました。こういった記事を書く我々は間違って解釈されてしまう記事を書いたという罪があります。

ウェブデザインはデザイントレンドがどれだけ含まれているかのチェックリストではありません。何を使用するにしても、何をやめて何をアレンジするか学ぶ必要があります。
WeFunctionの記事「How to Spot Quality within Web Design: Examples & Tips（邦訳：ウェブデザインのクオリティをアップする7つのポイント）」にデザインのクオリティに関する素晴らしい記事があります。あなたはそれらを取り入れたことがないかもしれません。しかし、別の方法でそれを実践することができます。

有意義なデザインエレメント

グラデーションを使用しないデザインでは何にフォーカスすればよいでしょうか？　フォーカスをあてる有意義なデザインエレメントを三つとりあげます。

タイポグラフィ

ウェブにはいくつかの安全に利用が可能なWebセーフフォントがあります。しかし、ここでいうタイポグラフィはこれらタイプフェイス以上のものです。

デザインでフォントの多様性を見せるなら、画像として見出しなどを作成するか、置き換えフォントを使用することができます。

ビジュアルヒエラルキー

もしあるエレメントが重要であるなら、あなたはどのようにそれを知らせますか？　カラー、サイズ、ウェイト、配置などでヒエラルキーを明示することができます。

もしそのテキストがページの上部にあり、大きいものであれば、おそらく重要なエレメントでしょう。
グラデーションのような飾りは他の具体的なデザインエレメントと一緒でなければ、ヒエラルキーを表現するのは難しいです。

ラインでトレース

これは一冊の本「The Principles of Beautiful Web Design」で学んだ興味深い概念です。
コンセプトはシンプルです。デザインをラインだけでトレースした状態で、重要なエレメントが認識できるなら良いというものです。これはデザインのシンプルなテストとしても役立ちます。また、ビジュアルエリアを指定するために微妙な変化に頼るレイアウトを確認するためにも役立ちます。

下記はそのテストを「art in my coffee」のデザインで行ったものです。