初心者向け講座早見表
前回のWeb系コラムでは、サイトにおける視線についてのお話をしました。
今回はさらに話を絞って、どのWebサイトにもある「ボタン」についてのお話をしたいと思います。
ボタンは、ユーザーが操作を行うインターフェースであると同時に、作り手にとってはユーザーを誘導するためのツールでもあります。
この2つの側面を軸に、ボタンの特徴と設置時の注意点について確認していきたいと思います。
ボタンは、まず「ボタンである」とユーザーに認識してもらう必要があります。
ボタンが「ボタンである」と認識させるためのポイントは、
・形状
・位置
の2点となります。
まず、ボタンの形状から説明しましょう。
Webサイトには様々なデザインがあり、Webサイトごとに異なるボタンがあります。
これらのデザイン等を踏まえた上で、まずは「押せそうな」デザインを考える必要があります。
具体的には、長方形、円形、角丸等を使って「立体的」に作ることで、ユーザーに「押せそうだ」という予測を与えることができます。平面のWebの世界において、3次元の感覚を共有させるデザインが、ボタンの形状においては大切なのですね。
デザインの上で可能ならば、周囲と異なる色で、はっきりした境界線をつけることも、より「押しやすいボタン」の形状に繋がりますので、おすすめです。
次に、ボタンの位置について説明しましょう。
いわゆるグローバルナビゲーションやサイドバーのように、どのWebサイトでも同じような位置にあるようなボタンに対しては、そのボタンを押すと何かアクションが起こるという予測を持たせやすくなります。
言い換えれば、一般的によく目にする場所以外に存在するボタンは、それ自体がボタンなのか、あるいは単なるデザインなのかがユーザーにとっては判断しにくくなりがちということになります。
では、どのようにすれば、このような「よく目にする場所以外に存在するボタン」の存在を、ユーザーに分かりやすく知らせることが出来るのでしょうか。
一般的には、アイコンや画像等をボタンと併せて活用することで、ボタン自体の存在をアピールすると共に、ボタンを押した際の動作をユーザーがイメージしやすいようにすることで対応します。
例えば、スタッフ紹介ページへ繋がるリンクを貼ってあった場合には、人のアイコンまたは写真をボタンに配置します。これにより、リンクの存在をユーザーに対してより強く印象づけることが可能になります。
デザインに「クリックしたくなる配慮」を加えることで、ユーザーがWebページを閲覧する際のストレスを減らすことが可能になります。このポイントをぜひ頭の片隅に置きながら、ボタンを作成してみていただけたらと思います。
（担当：斉藤 万幾子）
