制作の各フェーズのなかでも最も華となる、デザインのフェーズにおいてユーザビリティを高めていく方法を紹介します。
トップページには大きく分けて2つの役割があります。
- Webサイトの概要を明確に伝え、サイト内のコンテンツに期待を抱かせるための表示や玄関の役割
- ユーザーが欲しい情報やサイト運営者がユーザーに見せたい情報があるページへ案内するために目次や地図の役割
これらの目的は、どちらもトップページ以降のコンテンツをユーザーに見てもらうことです。
Webサイトの内容を明確に伝える方法
まずはそのサイトがどこのサイトで、どんな目的を持って開設されたのかを明示する必要があります。これは、サイトを訪問した人が、そのサイトに自分の必要とする情報があるかどうかを、判断する第一の材料となります。
まずはロゴや会社名をページの左上部に配置しましょう。
ロゴや会社名を左上部に配置する理由の1つは最も目につきやすいという点です。もうひとつは多くのサイトで使われている配置だからです。
一般的に認知されているルールを守ることは、ユーザビリティを確保する上で重要なポイントです。
そして、ロゴとともに、「タグライン」をいれます。
タグラインとは、サイト運営者がどういうことを行っていて、どんな点で優れているかを簡単に紹介する文章です。簡潔明快に12～20文字程度で掲載しましょう。
サイトロゴとタグラインの掲載例
また、ユーザーが直感的にWebサイトの内容を理解する要素としてイメージ画像が重要となります。
トップページに車のイラストや画像があれば、ユーザーが一目で車を扱うサイトだと知ることができます。当然、全く意味のない画像を用いるとユーザーを混乱させるので、サイトの掲載内容に即したものを使用しましょう。
提供している情報を明確に伝える方法
目次や地図としての役割を果たすためには、このサイトのなかに、どんな情報が含まれているのかを、トップページで分かってもらえるつくりにする必要があります。
ユーザーが、求めている情報がどのリンクの先にあるのかを判断する材料は、次のような情報です。
これらの材料を用いて、ユーザーがどこをクリックすれば求める情報にたどりつけるかを、直感的に理解できることばや画像で示しておくことが重要です。また、Webサイト内で発信する情報はユーザーの身になって的確かつ明確に分類整理しておくことも大切です。
レイアウトや配色、使うフォント、使う用語の統一、画像の処理方法など、さまざまな要素をあらかじめ決められたルールの中で運用することが必要です。
ページに一貫性があると、ユーザーは安心してWebサイトを利用することができます。
一貫性をつくり出す要素と活用のコツ
このような基本的なルールはサイトの特性にあわせて、慎重に選定して決めましょう。
色は人間の気分を左右する力があります。暖色、寒色、興奮色、鎮静色という分類があることからも分かります。それに加え、生活の中から色の持つメッセージを学習してきています。代表的なもので言えば、信号機。「赤はとまれ、黄色は注意、青はすすめ」ですね。例えば、赤が進めを意味する使われ方をしているとユーザーは混乱して、ストレスを生み出すことになります。
想定ユーザーに合わせた色の組み合わせを考える
それぞれの色が持つ意味を理解して、自分が伝えたいことを的確に表現できる色調を選ぶことが大切です。
たとえば、
- つくろうとしているWebサイトで伝えたいメッセージをより効果的に表現できる色調はどれか
- 想定されるユーザーが好むと思われる色は何色なのか
といったことを考えながら、基本となるベースカラーと色調を決めていきます。
配色を考える際には、先に全体のトーンを考えて、そのトーンを生み出せるベースカラーを考えるとよいでしょう。
| 要素としての色のよび方 | ||
|---|---|---|
|
|
|
色を配置するにあたって、一般的にバランスが良いといわれる色の割合は、
ベースカラー（基調色）70%
サブカラー（副調色）25%
アクセントカラー（強調色）5%
もちろん、ベースカラーの割合を落として他の割合を増やしたり、4つ目の色を入れることでカジュアルなイメージを生み出すことができますが、その場合、高度な色使いの技術が必要となります。せっかく設定したサイト全体のトーンが失われないように、十分に検討した上で配色を決めましょう。
