Appleのウェブデザインから学ぶ、ディテールを強化する9つのポイント
Post on:2011年5月20日
sponsors
Designer Dailyの記事を参考に、Appleのウェブデザインからディテールを強化する9つのポイントを紹介します。
Creating beautiful web designs: 9 details that matter
[ad#ad-2]
下記は各ポイントを意訳し、Appleのサイトを例にしたものです。
ドロップシャドウ
ドロップシャドウは、デザインに深さを与える素晴らしいテクニックです。しかし、計画的に使用しないと、とても素人くさい外見になってしまいます。
良いドロップシャドウを作るには、2つの重要なポイントがあります。
- シャドウは繊細にする。
- ページ内の光源は一貫したものにする。
グラデーション
グラデーションもドロップシャドウと同様に、使いすぎには注意が必要で、繊細に使用します。また、2色以上のグラデーションは重い印象与えがちなので、避けるようにします。
揃え
ページ内の各エレメントに適切な揃えを与えます。並べられたエレメントはウェブページ上で整然とし、組織的に見えます。また、ホワイトスペースを作るのにも役立ちます。
この揃えは、グリッドシステムを利用すると、簡単に実施できます。
out of box
一つ前の「揃え」とは矛盾したものになりますが、これはボックスの外にエレメントを出したデザインです。グリッドは確かに整然としており素晴らしいものですが、しばしば退屈な印象を与えます。こういったボックスの外にエレメントを出すことは、ダイナミックでウェブデザインを活発にします。
このエフェクトは特に多くの注目を必要とする重要なイメージに使用するとよいでしょう。
アイコン
アイコンはユーザーがインフォーメーションを探す際に、視覚的に役立ち、ユーザビリティを改善するためにも重要なものです。アイコンを使うことで、あなたのコンテンツはもっと読みやすくなるでしょう。
アイコンを使用する際、見た目が素敵なものにすると、デザインをいっそう優雅なものにします。
ハイライト
このテクニックはここ数年のデザインのトレンドです。白いラインを二つのカラーの間に配置し、コントラストを際立たせて明るくし、美しい外見を与えます。
また、アウトラインを際立たせるだけでも、非常に美しいコントラストを得ることができます。
タイポグラフィ
フォントの大きさと階層を調整することで、テキストをより読みやすくすることができます。リストや引用文のような箇所は垂直のリズムを用いてより均衡がとれたように配置します。
良いタイポグラフィというものは、一般のユーザーには気づかれないものでしょう。しかし、サイトのリーダビリティ、優雅さを改善することはいっそう品質の高いデザインになります。
テクスチャ
あなたは今までに何回、ページを圧倒する巨大な木のテクスチャを背景に使ったサイトを見たことがありますか？ これらのサイトは背景に注意をひきつけすぎており、ページはあまり読みやすいものではありません。
テクスチャを使用する際は、ページの雰囲気を作るためのものであり、若干のスタイルを加えるためだけに使われるべきです。まさに、テクスチャは気づかれない状態でいるべきです。
Apple -iPod
thanks:@blkrdr
call to Action
セマンティックは、あなたのウェブサイトのデザインにおいて非常に重要なものです。例えば、検索ボタンには「GO」やアイコンではなく、「検索」を使うべきです。紛らわしいものは、避けてください。
「call to Action」ボタンは、クリックすることでユーザーは何を得られるのかというコンテクストを明示する素晴らしいテクニックです。
[ad#ad-2]
sponsors
