1. ファーストビュー
2. 関連性
3. 具体性
4. ウェブライティング
5. リンクの装飾と配置　←今回のテーマ
6. 目線の操作
7. 他サイトでの慣習

ウェブサイトでは、ユーザがリンクを見つけることができなければどんなにユーザの関心を引くページやコンテンツを用意しても、まったく見られないまま終わってしまう危険性があります。

そこで、今回は「リンクの装飾と配置」をテーマに、ユーザがスムーズにページ間を遷移することが可能な、回遊性の高いサイトを設計するためのポイントをお伝えします。

リンクの装飾

まずはリンクの装飾について、テキストリンクとボタンリンク、それぞれのポイントを順に解説していきます。

１. テキストリンクの装飾

テキストリンクは青字下線で表すことにより、ユーザがリンクであることを一目で認識できるようにしておくことが重要です。一目で認識できるようにするための基本は「青字下線」による表示で、これは現在でも変わることがありません。

一方、近年ではテキストの可読性やデザイン性を重視し、あえてリンクに青字や下線を使用しないサイトも増えてきています。

今後も、このような流れが続くと思われますが、弊社でこれまでに行われたユーザ行動観察調査の結果から、「青字」か「下線」のどちらかの要素はリンクと視認するためには必須ですので、必ずどちらかの要素は加えるようにしてください。

また、「青字」「下線」のいずれかの要素のみを採用する場合は、補足的な挙動でリンクであることをフィードバックするようにしてください。例えば、ヤフーのトップﾟページでは、リンクの上をマウスが通り過ぎると下線が出現するようなフィードバックをしています。このようなやり方は、特にリンクの数が多いサイトで有効であるといえるでしょう。（図1参照）

図１
「トピックス」１行目のリンクにオンマウスの際、下線が表示される（Yahoo!）

また、リンクではないテキストに「青字」や「下線」を使用することは著しくサイトのユーザビリティを下げることにつながりますので、注意が必要です。

リンクの装飾についてはさらに詳しく知りたい方は、以下の記事をチェックしてみてください。

２. ボタンの装飾

ボタンの装飾は「押せる感」を出すことが重要となります。近年ではクリエイティブのレベルがあがり、「押せる感」の強いボタンが多く見られるようになりましたが、もしデザインをしていて困ったとき、以下2つのポイントを押さえると「押せる感」を比較的簡単に表現することができます。（図2参照）

• バレットを付けることで、ボタンにリンクらしさを出す。（矢印や三角が一般的）
• グラデーションや影を付けたり、角を丸めたりすることにより、ボタンに立体感を出す。

図2
「押せる感」のポイントを反映したボタンの例

リンクの配置

ユーザがスムーズにページ間を遷移することが可能なサイトを設計するには、リンクそのものを適切な位置に配置することも必要です。そこで、ここではリンクを適切に配置するための方法とテクニックを2つ紹介します。

１. コンテンツエリア内の誘導リンク

ユーザは関心のある部分のみを見ようとするため、目的の情報があるページを閲覧し始めると、コンテンツエリアにユーザの視線が集中することが、弊社のユーザ行動観察調査で確認されています。

このため、ユーザにスムーズにサイト内を回遊してもらうためには、コンテンツエリア内の文脈に沿って、次にユーザが見たいと考えるであろうページへの誘導リンクを配置し、より多くの有用な情報を閲覧していただくことが重要となります。

ユーザの関心や視線が集中しやすい場所に、効果的なページへのリンクを配置することで、スムーズに、かつ効果的にユーザをビジネスゴールへと導くことができるのです。

２. フッターリンク

ページのフッターにリンクを配置することも重要です。

上述の通り、目的の情報があるページを閲覧し始めるとユーザはコンテンツエリアに視線を集中させるため、仮にコンテンツエリアを下まで閲覧した後、フッターリンクが自然と視野に入るようになります。

ここにコンテンツに関連するリンクや他カテゴリへの導線を配置することで、ユーザが自ら、より興味のある情報に遷移してくれるのです。（図3参照）

図3
フッターリンクの効果について

なお、リンクの配置についてさらに詳しく知りたい方は、以下の記事をチェックしてみてください。

以上、「リンクの装飾と配置」をキーワードに、ユーザがスムーズに目的ページへ辿りつくことができる、回遊性の高いサイトを設計するためのポイントをご説明してきました。

次回のテーマは「目線の操作」です。ユーザの視線を集める要素と視線を遠ざける要素をうまく使い分けることで、意図通りにユーザにメッセージを伝達するためのコツをご紹介します。

1. ファーストビュー
2. 関連性
3. 具体性
4. ウェブライティング　←今回のテーマ
5. リンクの装飾と配置
6. 目線の操作
7. 他サイトでの慣習

「ウェブサイトに有益で魅力的な情報を載せているのに、何故か成果が出ない。」そんな経験をお持ちの方もいらっしゃるのではないでしょうか。ウェブサイトでは紙媒体に比べ、可読性が著しく低下します。もしかしたらウェブサイトに適した文章の書き方になっておらず、「有益で魅力的な情報」であることが伝わっていないのかもしれません。

第4回では「ウェブライティング」をキーワードに、メッセージを伝えるための3つの観点をお伝えします。

「ウェブライティング」に関する3つの観点

• 見出しを書くときのポイント
• 本文を書くときのポイント
• 文字装飾のルール

１. 見出しを書くときのポイント

ウェブサイトのユーザは、見出しのみを流し読みし、本文を読まない傾向が強いと言われています。見出しでは具体的な内容を書き、見出しだけでもそのページのメッセージが伝わるようにしましょう。

見出しを書くときのポイントには大きく分けて2つあります。1つは「メッセージを伝えるためのポイント」、もう1つは「可読性を向上させるためのポイント」です。まずは「メッセージを伝えるためのポイント」から以下にご紹介します。

• キーワードは文頭に置く
• 1文は1メッセージにする
• 機能ではなく、ユーザにとっての便益を書く
• 専門用語、社内用語、英語を使用しない

また、「可読性を向上させるためのポイント」としては以下が挙げられます。

• 漢字だけ、ひらがなだけを連続して使用しない
• 同じ単語を何度も繰り返さない
• 数字を入れて訴求力を向上させる
• 数字を使用する時は小数点は使用しない。分数表記や四捨五入をして表記する

メッセージが明確になり、可読性が上がれば、ユーザは「有益で魅力的な情報」に気がつき、興味を持って本文を読み始めてくれることでしょう。次は本文を書くときのポントです。

２. 本文を書くときのポイント

ユーザが本文を細かく読むことは少ないため、流し読みでも分かるような文章にする必要があります。読み飛ばされるリスクを考え、まずは結論から文章を始めましょう。また、本文にしか書かれていない重要なことがあるなら見出しにしてしっかり伝えましょう。以下、本文を書く時のポイントをご紹介します。

• 重要な内容から記述する
• 一文を短くする
• 1行は35〜40文字、1段落は3・4行前後に抑える

また、伝えたい事が多くて文章量が増えてしまう場合には、以下のポイントが有効です。

• 要約を使用する
• 文章量に応じて大見出し、中見出し、小見出しを使い分ける
• 段落ごとに適切な見出しを付ける
• 箇条書きを有効に使用する

これらのポイントは、本サイト上でも実現されています。ウェブライティングについては、このユーザビリティ実践メモでも過去に色んなテクニックをお伝えしています。興味をもって頂けたら、是非過去の記事も読んでみてください。

３. 文字装飾のルール

文字の装飾に関して、ウェブサイトでは以下のようなケースが多く見られます。

• 青い文字は未読リンクのみに使用する
• 紫の文字は既読リンクにのみ使用する
• 下線の文字はリンクにのみ使用する
• 赤字、太字は強調時のみ使用する

多くのサイトでこのルールが適用されているため、ユーザはこのルールを日常のウェブ体験で学習しています。このルール（＝学習経験）に反してしまうと、ユーザの読みやすさは大きく損なわれます。

例えば、リンクではないのに青字下線を引かれている文章をクリックしたユーザは、いつものルールが通用しないためどこがクリック出来るのか分からなくなってしまいます。

また、赤字や太字は伝えたい箇所全てに使用してしまいがちですが、あれもこれも強調してしまっては、強調の役割を果たしているとは言えません。赤字や太字はなるべく使わないよう心がけ、内容を絞った上で最も強調すべきメッセージにのみ使用しましょう。

以上、「ウェブライティング」をキーワードにメッセージを伝えるポイントをまとめてご説明してきました。

次回のテーマは「リンクの装飾と配置」です。一目でリンクだと分かってもらうためのコツや、スムーズな回遊を促すためのコツをご紹介していきます。どうぞお楽しみに。

1. ファーストビュー
2. 関連性
3. 具体性　←今回のテーマ
4. ウェブライティング
5. リンクの装飾と配置
6. 目線の操作
7. 他サイトでの慣習

ウェブサイトではページ間の移動は基本的にリンクによって行われます。しかし、一般的に言われているリンクのクリック率は高い場合でも10％程度。リンクがクリックされなければ、どんなにユーザの関心を引くページやコンテンツを用意しても、まったく見られないまま終わってしまう危険性があります。

まとめの第３回では「具体性」をキーワードに、伝えたいメッセージをウェブサイト上で確実に伝えるための２つのポイントをお伝えします。

「具体性」に関わる2つのポイント

• リンク先にある情報のイメージを湧かせる
• 見せたい情報を様々なページに露出する

1. リンク先にある情報のイメージを湧かせる

ユーザの関心を引き、リンクをクリックしてもらうためには、クリックした先に何があるかを明確に示す必要があります。それだけなく、リンク先にある情報がユーザにとって読む価値があるものだと思ってもらわなければなりません。

リンク先にある情報について具体的なイメージを湧かせ、興味を持ってもらうためには以下のような方法があります。

• その製品・サービスならではの内容を書く
• 関連する写真を用意する
• 一般的でない単語には説明をつける（外国語、専門用語、製品名など）
• リンク先のコンテンツの一部を見せる（図1参照）

なお、その先にある情報のイメージ湧かせることは、リンクだけでなく、記事の見出しなどでも重要です。情報を具体的に書くことの重要性は、次の記事でも取り上げているほか、次回のまとめ記事「ウェブライティング」の内容も参考になるでしょう。

2. 見せたい情報を様々なページに露出する

リンクのクリック率が低いことを前提に、リンクに頼らず、伝えたいメッセージを他のページに露出してしまうのも有効です。

例えば、製品のメリットや特長は、製品紹介のページだけでなく、FAQや体験談のページに関連する情報として挟み込むことが可能です（図2参照）。様々なページに露出することで、伝えたいメッセージがユーザの目に触れる確率を高め、詳細ページへの誘導を強めることができます。

また、ユーザが疑問・不安に思うと予想される内容をFAQの「Q」の形で露出し、先回りして疑問・不安を解決していくこともできます。こちらについては以下の記事をチェックしてみてください。

以上、「具体性」をキーワードに、伝えたいメッセージを伝えやすくするためのポイントをご説明してきました。

次回のテーマは「ウェブライティング」です。ウェブ上で文章を書く際には、紙媒体とは違った独特のルールが存在します。基本ルールを押さえて、読んでもらえる文章を書くためのコツをお伝えします。

1. ファーストビュー
2. 関連性　←今回のテーマ
3. 具体性
4. ウェブライティング
5. リンクの装飾と配置
6. 目線の操作
7. 他サイトでの慣習

まとめの第2回は「関連性」についてです。ユーザに2つの要素の関連性を認識してもらうには、1つの「まとまり」に見えることが必要です。人がどのようにまとまりを感じるかについては、ゲシュタルト心理学などの分野で議論されてきました。その中で、ウェブサイトを作る上で重要なのは、以下の2点です。

• 近接
• 閉合

1.近接

近接とは、簡単に言えば近いということです。例として、以下の図を見てください。

図1

上の図を見たときに、下の図のように右上の2つ、左下の1つをまとまりとして感じたのではないでしょうか。このように、人は近くにあるものをグルーピングする傾向があります。逆に、離れているものには関連性を感じにくいということです。

これをウェブサイトの作成に応用すると、1つのまとまりとして認識してほしい部分は他のコンテンツとスペースを空ける（文章だったら行間を空けるなど）、検索窓とと検索ボタンは近づけて設置する、といったことが考えられます。

具体的な配置の例は、以下の記事も参考にしてください。

2.閉合

閉合というと耳慣れない言葉ですが、括弧や枠で囲まれたものは「まとまり」として認識しやすい、ということです（今の文章も括弧がないと平仮名が続いて、かなり読みにくい文章になってしまいます：括弧や枠で囲まれたものはまとまりとして認識しやすい）。コンテンツの配置ということで言えば、エリアを区切ることで実現できます。

主なエリアの区切り方としては、以下のような方法があります。

• 前後の要素とのスペースを広くとる（近接の要素も含まれるため効果的です）
• 見出しの文字サイズを大きくして目立たせる
• エリアの左に画像を配置する（以下図2参照）
• エリアの左側に縦線を引く（以下図2参照）

図2

この他に、枠や横線、背景色などでエリアを明確にする方法がありますが、ユーザの視線を遮ってしまうなどの影響があるので注意が必要です。ユーザの視線への枠の影響については、以下の記事をチェックしてみてください。

以上、簡単ですがユーザに関連性を認識してもらうためのポイントをご説明しました。次回は「具体性」がテーマです。見てほしいページへのリンクをクリックしてもらうためのコツについてお伝えします。

実践メモでは、今回から7回シリーズで実際のウェブサイトをどう作っていったらよいのか分からないときに役立つ、特に重要な7つのテクニックについてまとめていきます。

1. ファーストビュー
2. 関連性
3. 具体性
4. ウェブライティング
5. リンクの装飾と配置
6. 目線の操作
7. 他サイトでの慣習

まとめの第1回は「ファーストビュー」についてです。ファーストビューは、ユーザがそのページを見るかどうかを決める重要なエリアです。以下4つのことに気をつけてください。

ファーストビュー設計／4つのポイント

• 縦幅を節約する
• 適切なフィードバックを与える
• 下にページがつながる印象を与える
• 画像を置く

1. 縦幅を節約する

スクロールしないユーザもいるため、ファーストビューの見せ方はサイトの設計上最も重要です。ファーストビューエリアには無駄なものをなるべく置かず、縦幅を節約します。

ファーストビューラインは、主要なモニタサイズである「1024×768」に合わせます（ツールバーなどの幅も考慮してくださいね）。ただ、最近では「1280×800」が主流になりつつあるので、このあたりも意識しつつ、自社サイトを訪れる人たちのモニターサイズをアクセスログなどで確認の上、決めるとより良いです。

2.適切なフィードバックを与える

リンク元の文言と関係性の高い情報をファーストビューに表示し、ユーザが期待していた通りの　ページであることを明示します。主に「画像」と「H1要素（ページタイトル）」によって適切なフィードバックを返します。

例えば、検索エンジンの結果画面から自社サイトに入ったとき、ファーストビューで適切なフィードバックがないとユーザは間違えた！と思いその時点でサイトを去ってしまうこともあります。

3.下にページがつながる印象を与える

ファーストビューで、ちょうどページが終わっているように見えてしまうと、スクロールしてもらえません。例えば、横線が引いてある、コンテンツがぴったりおさまっているなどの状態です。

ファーストビューのラインによって、コンテンツが途中で切れるように設計します。

Amazonの例
ファーストビューのライン近くに「大きめの画像」を置くことで、画面下端からさらに続く感じが生まれやすい

4.画像を置く

ファーストビューに画像を入れた場合、離脱率が低くなる傾向があります。文字ばかりのページではなく、分かりやすい印象になることが理由です。画像の内容自体は、良い印象を与えるものを選んでくださいね。

「ファーストビュー」については以上です。次回のテーマは「関連性」ですので、ぜひお楽しみに。

本稿では、WEBサイト上での情報提供で、ユーザに『自分ゴト化』してもらうための3つ紹介いたします。

(1)「こんな人にオススメ」という情報を示す

例えば、以下の表現を比べてみてください。

上の例だと、これらの商品が自分に合っているのかどうかをユーザは判断することができません。
しかし、下のように「こんな人にオススメ」という情報を提示すれば、ユーザに「この商品は自分の状況に合っている」と認識させることができ、自分ゴト化してもらうことができます。

(2)商品価格をユーザに実感させる

いくら自分の状況に合った商品があっても、「その商品を自分が買うとしたらどれくらいの代償が必要なのか？」 を具体的に想起できない場合、ユーザは商品を購入する検討を簡単に中断してしまいます。
そういったユーザに購買意欲を喚起してもらうためには、商品価格をユーザに実感させることで、「自分ゴト化」し てもらうことが有効です。

例えば、『月々4000円で買える健康食品』と言われても、それは投資に値するものなのかどうかをユーザに認識 させることはできず、ニーズを喚起してもらうことはできません。
それに対して、「飲み会たった1回分の値段で」 であるとか「1日にタバコを3本減らすだけで」などのように、日常生活に結び付いた形で商品価格を紹介することで、 ユーザは自分のコトとして捉えることができるため、商品に対する興味をより強くすることができます。

(3)商品の利用状況をイメージさせる

例えば車のCM広告では、家族でドライブしてどこかにお出かけする様子を見せるものが1つの定番となっています。
これは「週末に家族で楽しく過ごしたい」というニーズを持っている人に、「この車を買えば、このCMと同じような 家族の団らんが実現できそうだ」といった商品の利用状況をイメージさせることを目的としています。

このような形で具体的な利用シーンをユーザに想起させることができれば、ニーズが喚起され、「自分ゴト化」して もらうことができます。
WEBサイトでこれを実現するためには、イメージ写真や動画などを用意することが重要となります。

本稿では、ユーザに「自分ゴト化」してもらうための方法を3つご紹介いたしました。
このような観点を踏まえて、商品の訴求方法をご検討してみてはいかがでしょうか。

すると、あるブランドのクリック率が2倍も伸びたのです。

いったいなぜロゴを足しただけで、CTRが2倍も伸びたのでしょうか？

このブランドの特徴を見てみましょう。

• 複数の大型駅ビルに店舗を構えていて多くの人が店舗を目にしている
• ブランド名が長く覚えにくい
• ブランドカラーとロゴが特徴的
• ロゴが目立つショッピングバッグをぶら下げている若者が多い

「ロゴが大事」ということをお伝えしたいわけではありません。（現に、他のブランドはロゴを足した後もCTRに大きな変化はありませんでした。）

自社の製品やサービスがユーザにどのように認知されているかを正しく把握し、サイト内のコピーやワーディングに生かしていくことが大事だということがここでのメッセージです。

タブは便利であると同時に、背後のタブが見られない危険性が伴います。今回は、タブの2種類の使い方にそって、タブ利用時の注意点について考えてみたいと思います。なお、どちらの使い方か明確に分けられない場合は、両方の注意点を参考にするのがおすすめです。

※タブを利用する際の注意点は過去の実践メモでも取り上げています。
（参考）
「困った時のタブ頼み」（ユーザビリティ実践メモ）

まず、一つ目の使い方は、「多数の情報をカテゴリごとに整理して提示する」というものです。

例えば、ニュースサイトでは多数のニュース記事を「総合」「経済」「エンタメ」「スポーツ」というタブを使って分かり易く分類しているのをよく見かけます（図1）。あるいは、衣料品を扱うＥＣサイトでは「レディース」「メンズ」「キッズ」といったタブを使うことで、自分の探したい商品をスムーズに探すことができるようになっています。

この場合、タブ化の一番の目的は「ユーザが関心のある情報へスムーズに辿りつけること」です。そのため、ユーザが自分の関心を満たすためにはどのタブをクリックすればいいのか分かるように「情報を適切に分類すること」「タブのラベルを分かりやすいものにすること」が重要となってきます。具体的には、以前の実践メモの注意点のうち、2，3，4を参考にすると良いでしょう。

二つ目の使い方は、「一番伝えたいメッセージと、それを補強する情報を一箇所で見せる」というものです。

例えば、化粧品を扱うＥＣサイトで、「商品特長」「ご使用方法」「お客様の声」という３枚のタブが用意されているパターンです（図2）。この使い方では、１枚目のタブで売りたい商品の詳細と特長を伝え、２枚目、３枚目のタブで商品の魅力を別の角度から補強しています。

このように、タブを使って、メッセージとそれを補強する情報をまとめて見せることで、サイト内を移動することなしに商品の魅力を説得力のある形で伝えることができます。

できるだけ複数のタブを見てもらうための工夫が重要

この使い方をする場合、ユーザにできるだけ多くのタブを見てもらう必要があります。そのため、一つ目の使い方以上に、「次のタブへの導線を強くする」ことが重要となります。具体的には以下のような方法が考えられます（図3）。

1. それぞれのタブの中に、「次へ」「この悩みを解決するには」といったボタンを用意する
2. 切り替え部分を上部に加えて下部にも用意する

また、そもそも1枚目のタブの内容が興味を引かなかった場合、2枚目以降が見られる確率はかなり低くなります。1枚目のタブを作成する場合には、導線をきちんと用意することはもちろんですが、そのページを訪れた際にまず気になる情報は何なのか、ユーザの立場に立って考えてみることが大切です。

タブを利用する際にはこれらの注意点を意識して、タブの機能を十分に活かせるようにしましょう。

「でも、ページの中に書いただけではメリットに気付いてもらえない！」という時、定石をはずして“あえてページを割り込ませる”という方法が有効な場合があります。

ある情報サイトAでは、グループ会社Bの商品を紹介しており、サイトAの会員はB社の商品を購入する際に割引特典が受けられるというサービスがありました。しかしこのサービスの認知度はあまり高くなく、ユーザ行動観察調査においてサイトAからB社サイトを訪れたユーザも、ほとんどの人がこのサービスに気付きませんでした。

そこで弊社では、サイトAでB社のサイトへのリンクがクリックされた際に、会員限定割引を知らせるページを表示させてから、B社サイトへ遷移するようにサイト設計を行いました。こうすることで、ユーザ行動観察調査においても、サイトAからB社サイトを訪れたユーザの全員が、会員限定割引について理解した上でB社の商品を閲覧していました。しかも、間にページが挟まれていたことに対する反応も、「わかりやすかった」などのポジティブなものでした。

今回のケースで、“あえてページを割り込ませる”方法が有効だったのは、

• ユーザにとって今すぐ使える情報であること
• あまり知られていないサービスであること

実際にこの方法を採る際に注意したい点としては、

• ユーザに間違ったと思わせない工夫をすること
• ユーザに違和感を感じさせないようにすること

• レイヤー表示にすることで遷移先が間違っていないことを伝える
• すぐに本筋に復帰できるようにする
• クッキーを利用するなどして同じ情報を2度見せない

普段はウェブとユーザの二者間のコミュニケーションを考えていますが、友人紹介キャンペーンには「紹介される人」という第３の人を意識する必要があります。

そこで今回は、ユーザと紹介される人のコミュニケーションが少しの仕組みの違いで180度変わってしまうという例を見ていきます。

友人紹介としてたとえば次の二つの方法が考えられます（図1、図2参照）。

図1は企業のウェブサイト上で友人のメールアドレスを登録するもの、図2は企業のウェブサイト上にある紹介券を友人に送るものです。

一見これらはささいな違いしかないように見えますが、ユーザの視点から見ると大きな違いがあります。

それは、前者は「企業に友人の情報を与える」のに対して、後者は「友人に有益な情報を与える」という違いです。

これによってどういう行動の違いになるか、もう少し詳しく見ていくことにしましょう。

図1の例の場合、ユーザは友人の個人情報を企業に教えてしまうことになるので、紹介しても良いか友人に確認をとるという手間を与える可能性があります。

このときユーザは、ウェブで紹介キャンペーンを見た後ウェブの外で友人に登録してもよいか確認したうえで、再度ウェブまで登録しに来なければなりません。（図3参照）

二つ目の場合ユーザは、有益な情報を友人に教えることになるので、あまり躊躇なく紹介することができると想像できます。また再度ウェブに登録する手間もありません。（図4参照）

つまり図1の例では

• 企業に友人の情報を提供することを後ろめたく感じる
• わざわざ友人に確認してから登録しなおすという手間がかかる

• 友人に有益な情報を提供することに満足感を覚える
• 友人に情報を教えるだけなので手軽に行える

実際にユーザ行動観察調査においても、図1の例をイメージして、「紹介キャンペーンは友人を売るような感じがするからやりたくない」という発言が何度も見られました。

図2の例であればこのような発言は出ないと考えられます。

今回の例のように少しの仕組みの違いでユーザの気持ちが180度変わってしまうことがあります。

特に紹介キャンペーンのように第三者が関わってくるようなときは、ウェブサイトの外でユーザがどのようなコミュニケーションをとるかについても十分に検討するようにしてください。

しかし、1か所に情報を詰め込みすぎると分かりにくくなってしまい、肝心のそのページの商品の売り上げが下がってしまう…というようなことにもなりかねません。

「できるだけ情報をまとめて伝えたいけれど、わかりにくくなるのは避けたい」という場合、どこまで情報を詰め込んでいいのか判断がつかずに悩んでしまうこともよくあるのではないでしょうか。

そうした場合、いわゆる「マジックナンバー7±2」を参考に、「1エリア5要素まで」を一つの目安としてみることもおすすめです。

例えば、ECサイトにおいて、購入ボタン付近に以下のような情報を掲載していたとします。

1. 商品名
2. 価格
3. 獲得ポイント
4. 数量
5. 購入ボタン

と現在5つの情報要素が掲載されています。

ここにさらに定期購入の導線や他商品へのレコメンドを置こうとすると「1エリア5要素まで」ではなくなってしまいます。

「1エリア5要素まで」を超えないようにするためには、例えば定期販売の購入のための導線についてはエリアをもう一つ増やして配置するという方法があります。他商品へのレコメンドはさらに形式を変えてエリアを増やし、以下のように配置すると分かりやすくなります。

もちろん、時と場合によって目安となる数は変わってきますが、迷った時はまずは「1エリア5要素まで」を目安としてみてください。

さらに、各要素に強弱をつけて情報を配置するとよりわかりやすいサイトとなります。（「ユーザを混乱させない表組みのコツ」）なども御覧ください。

自社サイトで簡易アンケートをとることはユーザを理解する上での基礎調査になる。
→メリット１：今、サイトに来ている人がどんな人かがわかる。
→メリット２：調査がしにくいユーザの声が聞ける（遠方や海外にいるなど）。
→注意点１：ユーザ行動ではなく、「声」であるため、あくまで一意見として捉える。
→注意点２：今サイトにきている人の声、かつその一部の人であることを忘れてはいけない。

●自社サイトアンケートは基礎調査におすすめ

例えば、服を売っている企業であれば、当たり前の話ですがお店に来ている客がユーザです。その人達に対してレジで以下のような質問を２、３個尋ねるだけで、そのユーザの気持ち、想いが把握できます。

• 今日はどのような目的で来られたのですか？
• 欲しい物は見つかりましたか？
• 何か気になった点があれば教えてください。

ウェブサイトでもアンケートを利用して同じことができます。

訪れた瞬間、もしくはサイトでの目的を達成したタイミングで「もしよろしければ３問程度のアンケートにご協力いただけないでしょうか」という依頼をします。

答えたくない人は答えなくてよいので、ユーザが怒って帰ってしまうといった事態に気をつける必要はありません。

この調査は、「本当に今サイトに誰が来ているかわからない」というときの基礎調査としておすすめします。あくまで基礎調査である理由は次の「気をつけなければいけない点」で記載します。

●自社サイトアンケートで気をつけなければいけないこと

簡易に行えるこの調査ですが、気をつけなければいけない点が大きく二つあります。

１：アンケートはユーザの行動ではなく「声」であるため、あくまで一意見として捉える。

ユーザ行動観察調査でも気をつける点ですが、ユーザの声は必ずしも行動を表しません。アンケートで取れる情報はあくまで「声」ですので、一意見として捉えることを心がけてください。

また、その信憑性を確認するためにもアンケートはある程度の数をとって、定量的に分析することをおすすめします。

２：今サイトにきている人の声、かつその一部の人であることを忘れてはいけない

もう一つ注意すべき点として、今サイトに来ているユーザは必ずしも狙っているユーザだけではないことを念頭においてください。

狙っていないユーザの声にあわせてアクションプランを立ててしまうと、狙うべきユーザが離れていってしまうといった事態も起こりえます。

アンケートで獲得できる生の声は宝のようなインプットに見えますが、上記の理由からも、一意見として扱うべきであることを念頭においてください。

●アンケートの応用方法

最後に私が自社アンケートをプロジェクトで活用した例について軽く触れます。

担当したプロジェクトでは、ユーザが世界中にいるサイトだったため、国内でユーザ行動観察調査は行えないものでした。そこで自社サイトを利用してサイトのトップページに複数言語でアンケートを設置し、1週間で数百人の声を集めることにしました。

「やはりそうか」というものもあれば、「そんなニーズもあるのか」と気づきを与えてくれるものも多くありました。

「国内にいるが接触しにくい」ユーザや海外にいるユーザなど、接触しづらいケースでは、手軽にできるのでおすすめです。

今回の実践メモでは、「ラボの外で行うユーザ行動観察調査」をご紹介させていただきます。

ラボの外で調査を行いたい場合、以前ご紹介しました「出張ユーザ調査」を行うこともできます。

• 出張ユーザ調査のすすめ（ユーザビリティ実践メモ）

今回ご紹介する「ラボの外で行うユーザ行動観察調査」では、

• 被験者の方に、ご自宅でプロトタイプを利用してもらう
• 被験者のプロトタイプの利用を、モデレータがリモートで閲覧（一部操作）し、随時質問する

ユーザ行動観察調査を「モデレータ：オフィス」「被験者：自宅」の環境で実現できることで、

• 遠隔地のユーザに対してユーザ行動観察調査を実施できる
• ユーザが普段使っているPCの環境で調査したいときにも使える

実施の大きな流れは、

1. 被験者を収集
2. プロトタイプを閲覧できる環境を、各被験者の方に連絡
3. モデレータが被験者の方のPCを、リモートで閲覧できるよう環境を設定（※）
4. モデレータから被験者の方に電話をかけて、調査を開始

※3.の「被験者の方のPCをリモートで閲覧できるよう環境を設定」は、市販の専用ツールを使うことで、比較的簡単に実現することができます。

この手法であれば国内の遠隔地に限らず、海外のユーザに対する調査も、比較的簡単に実施することができます。

地理が障害となり調査が実施できない、という場合には、一度検討してみると良いでしょう。

特に、

• 「新しいウェブの活用方法を模索したい」
• 「自社製品を他国・他地域で拡販したいが、あまり工数が掛けられない」

しかし、最近このような活用方法ではなく、「ニーズ探索」のためのツールとして活用されているケースをいくつか耳にするようになりました。例えば、以下のようなケースです。

【事例】海外へ製品展開をするにあたりランディングページでニーズを探った例

◆状況

• 自社製品を海外に展開していきたいのだが、どの国でどの程度の需要が見込めるのか、よくわからない。
• かといって、各国に営業マンを派遣して、需要を確認するような予算はなく、工数も掛けられない。

◆解決策

• そこで、安価に制作できるランディングページを進出先候補の国々向けに制作した上で、リスティング広告を出稿。
• 各国における反応を見て、ニーズの強さや特長などを把握していった。

ウェブには、販売促進・PR・見込み客獲得・アフターサポートなどの役割を持たせることができますが、「リサーチ（調査）」という役割を持たせることもできます。

ウェブの世界で「リサーチ（調査）」というと、一般的にはアクセス解析をし、各種数値や来訪者の属性をみながら分析をするイメージがありますが、今行われている施策について調査をするだけでなく、これからやろうとすることについて調査をすることも可能なわけです。

オンラインなら、リアルなユーザの行動をベースに調査をすることができますし、発言力のある方に左右されやすいグループインタビューなどと比べても、信頼性のある調査をすることができます。

意識せずとも既にこのようなことをされている方もいらっしゃるとは思いますが、意識してこのような活用方法を使っていくことで、より販促プランを柔軟に組み立てることもできますので、ぜひ皆さまの実務において活用できるポイントがないか、ご確認をいただければ幸いです。