今回は、弊社で実施した英語でのユーザビリティテスト（ユーザ行動観察調査）から、日本人ユーザと英語ネイティブユーザの行動の違いをいくつかご紹介します。 検索サイトの利用行動の特徴として、日本人に比べ比較的検索語が長い、という点が挙げられます。 例えば、あるメーカーの製品を比較検討している場合、 compare Product A to B （＝製品AとBを比較する） Product A where to buy（＝製品Aをどこで買うべきか） のように、ほとんど文章に近い複数語を使って検索する例が多く見られました。 また、目的のサイトにたどり着いた後でも、製品カテゴリをたどるのではなく、複数語を使ってのサイト内検索を多用する傾向が見られました。 これには、 キーボード利用の文化があり、日本人に比べキーボードへの抵抗感が少ない 変換の手間がない分、日本語よりも入力が楽 などの理由から、より短時間

Yahoo! JAPANの画面横幅が950pxになって以降、サイトの画面横幅を770pxから900px以上に拡大するサイトが増えています。 今回は画面横幅を900px以上に拡大することのメリット・デメリットから、画面サイズを広げる際に注意すべきポイントをご紹介します。 【メリット１】　ファーストビューで表示できる情報が増える メディアサイトなど広告収入を目的としているサイトの場合、ファーストビューに表示できる広告の量が増えますので、売上増加に直接結びつきます。 【メリット２】 デザインが映える トップページのブランドパネル等の横幅が広くなり、迫力のあるデザインを表現できます。 一方、デメリットとして、大きく下記の3点が挙げられます。 【デメリット１】 右端が欠けて見られなくなるケースがある（特にお気に入り常駐時） 画面右エリアに重要なボタン（購入ボタン、申込ボタンなど）や重要なリンク(メイ

B to B向けの製品・サービス紹介サイトでは資料請求・問合せをビジネスゴールに設定しているケースが少なくありません。 今回はB to B向けサイトで資料請求数を効果的に増やす方法として以下の2つを紹介します。 （1）全てのページで資料請求への導線を設置する （2）ユーザの求める情報を具体的に提示する しかしB to BサイトはB to Cと比べて、訪問ユーザは製品・サービスに対して一定の興味を持っているため、そうした懸念は杞憂であると考えられます。逆に全てのページに資料請求への導線を設置していない場合、ユーザが何のアクションも起こさないままサイトから立ち去るリスクが高まります。 弊社の調査でも、あるページで欲しい情報を獲得したあと、そのページに資料請求への導線がなかったため、そのままサイトから立ち去るというユーザ行動が確認されています。 （2）ユーザの求める情報を具体的に提示する B t

ウェブサイトを制作していると、どうしても長い文章を掲載しなければいけない場面に遭遇します。 今回は、文章を読みやすくする「見せ方」の方法を、例を元にご紹介いたします。 ウェブライティングをご覧ください。 方法１．文字サイズを大きくする 最も基本的な方法ですが、最も効果的です。文字サイズを大きくするだけでも「見やすさ」は格段に向上します。 方法２．行間・改行・インデントを適切に取る 方法１．と同じく基本的な手法ですが、こちらも効果的な手法です。方法１．と組み合わせることで、ほとんどのサイトでは問題がないレベルにまで「見やすさ」は向上するでしょう。 方法３．キーワードを目立たせる 文中で重要なキーワードを太字にしたり、文字色をつけることで文章にメリハリをつけて見やすくすることができます。 キーワードを装飾することで、単に目立たせて読み手に意識させるだけでなく、一行を読み終えたユーザが視線を右か

メールを使ったBtoCコミュニケーションとして、多くのユーザに対して認知・集客を目的とするメールマガジンが一般的に挙げられます。 一方、比較的、対象人数が少ないセミナー・説明会の応募受付や面接など1対1のコミュニケーションの場合、企業側から送付したメールに対してユーザに「メールで返信を求める」形が考えられます。 今回は、弊社のユーザビリティテスト（ユーザ行動観察）から得られた知見から、「より返信しやすいメール」の作り方を考えてみましょう。 ある企業では、自社サイトからエントリーした採用希望者に対し、個別にメールを送り、１次面接のスケジュール調整を行っていました。 そこで、それに近い状況をテストするため、複数のパターンのメールを用意し、就職活動の中でユーザがそれらのメールを受け取ったという想定で行動観察を行いました。 まず、「メールを開封するかどうか」という場面では、本連載でも以前ご紹介した

自社サイトの会員に対し、「キャンペーンの告知」、「新製品の訴求」や「おすすめサービスの宣伝」を行いたいという状況はよくあると思います。 しかしバナーなどによる訴求ではユーザに無視されてしまい、思うように成果が上がらないというケースも多いのではないでしょうか。 弊社が行ったユーザビリティテスト(ユーザ行動観察調査)において上記のような「メッセージ」による訴求方法を試したところ、多くのユーザが自分にどのようなメッセージがあるのかと、確認する動きが見られました。 これはユーザの名前を表示し、メッセージという形をとったことで、「自分に関連のあるもの」がその先にあるという意識がユーザに働いたためだと思われます。 その結果、バナーなどでは認知されなかった「訴求したいもの」がユーザに認知されたのです。 「訴求したいものがユーザになかなか気付いてもらえない」とお悩みのサイト運営者の方は、「メッセージ」によ

インターネットの普及が進みユーザのウェブサイト利用経験が増えるにつれ、ユーザにある種の慣れや先入観が発生していることがあります。ウェブサイトやページを設計していく上では、この慣れや先入観を加味して構成を検討することが重要です。 今回はこのようなユーザの慣れ・先入観について、弊社である企業サイトのユーザビリティテスト（ユーザ行動観察調査）を行った際の事例をご紹介します。 しかし、調査においてユーザに企業情報コンテンツを探してもらったところ、ほとんどのユーザはメインコンテンツエリアに置いたリンクを見つけることができませんでした。 これらのユーザの行動をアイトラッキングで確認したところ、トップページを訪れたユーザは、メインコンテンツにほとんど視線を移すことなく画面下部のフッターを注視し、企業情報へのリンクを探そうとしていましたが見つからず、ついで画面上部に戻り、ヘッダーを探したもののやはり発見で

Jones氏は、Ajaxを使ったタブ切り替えなどインタラクティブにコンテンツを提示するUIを用いた際の、ユーザビリティやビジネス効果(ユーザの説得)といった観点での注意点を紹介しています。以下では、その中から2つの事例をご紹介いたします。 ユーザビリティへの配慮 コンテンツを参照しにくくしていないか？ Ajaxにより、ページ遷移をしないコンテンツの見せ方が普及しつつあります。よく見られるケースとしてタブ形式のインタフェースがあります(図1)。このタイプのUIでは、素早いコンテンツの切り替えができる反面、切り替えたコンテンツはページとして存在しないため、後からユーザが参照しづらいデメリットが生じることをJones氏は指摘しています。例えば、ユーザがあるタブのコンテンツを友達と共有したいと思っても、そのコンテンツはページとして存在しないため、リンクを送っただけでは友達は別のコンテンツを見てしま

多くのサイトがリスティング広告を出稿していますが、過去に色々なキーワードで出稿してみたが、「獲得効率が悪い」「コンバージョンしない」などの理由で、現在は獲得単価の安い企業名やサービス名のいわゆる「指名買いキーワード」のみ出稿し、その他の関連キーワード（複合語）は出稿していないというお話を伺うことがあります。 しかし、関連キーワードの出稿は本当に停止すべきなのでしょうか？ ここでは、ある大手インターネットサービス企業での改善事例をご紹介します。 この業界には多数の競合サービスが存在しており、多くのユーザがサービスの利用を検討する際に価格.comなどでサービスの比較を行います。 実際に、検索されているキーワードでも、「●●（サービス名） 比較」「●●（サービス名） ランキング」など、サービスを比べようとしていると考えられるキーワードが多数見られます。 この企業のサービスは、単純に価格だけで比べ

会員・非会員など、ユーザの状況によってウェブサイトに複数の入り口がある場合、振り分けが必要となります。今回は、そのような振り分け画面での要素の配置についてのコツを紹介します。 この画面を訪れたユーザは、すでにサービスに入会している方でしたが、少し迷った末、一番上の「○○プランお申し込み」（新規入会者用のリンク）をクリックしてしまい、かなり先に進むまで自分が間違えていることに気づきませんでした。 そこで、上の画面を、次のように変えてみたところ、ユーザはスムーズに自分の状況に適したリンクを選択することができるようになりました。 この画面で問題が解消された最大のポイントは、振り分けの要素を左右に並べたことです。 人は左右に並んでいる要素に対しては「対等な要素」、あるいは「対比されている要素」だと認識する傾向があります。したがって、左右に要素を並べられると、無意識的に「2者を比較しよう」というモー

今回は、Flashをナビゲーションに利用する場合に「読み込み時間」に注意する必要があるという事例についてご紹介します。 探したい商品カテゴリ（例：PC・周辺機器）をクリックすると、Flashエリアの中身が変わり、そこから下位分類（デスクトップパソコン・ノートパソコン・周辺機器）を選択するようになっています。 弊社のユーザ行動観察調査の中で、ノートPCを求めてこのページを訪れたユーザがいました。このユーザは、「とにかく目当ての商品を探したい」という商品検索モードであったため、ページが表示されるとすぐに「カテゴリ選択」から希望のカテゴリである「PC・周辺機器」を選択しました。 ところが、しばらく待っても何も反応がなく、ユーザはそこで「よくわからないな」と言ってサイトから離脱してしまいました。 実はこれは、カテゴリを選んでクリックした時には、まだFlashが「読み込み中」だったことが原因でした。

確認画面で与える安心感 今回は確認画面よりも前に、同様の工夫が必要となるケースについて紹介します。 家電など比較的高価な商品を扱うECサイトやメーカー直販サイトでは、ユーザは一度の訪問で購入にまで至るとは限りません。 ある家電ECサイトでのユーザ調査において、ユーザは一通り商品情報を見て候補の商品を選択した後、価格をメモしてサイトを離脱し、比較のために他サイトを訪れる様子が多く観察されました。 この時のユーザ行動には 買い物かごまで行かない キャンペーン割引や購入特典をあまり意識しない という特徴が見られました。 はじめから他サイトと比較することを目的にサイトを訪れているため、商品の内容と価格を「だいたい」把握した段階でサイトから離脱してしまったのです。 この家電ECサイトではキャンペーン割引を用意しており、買い物かごに商品を入れたところでキャンペーン割引額が表示されるようになっていました

今回はユーザビリティテスト（ユーザ行動観察調査）の結果から、関連性のある要素同士を離して配置してしまったことで混乱を招いたケースをご紹介します。 上記の検索は、「価格」と「ジャンル」の両方をプルダウンメニューで選択した後、右の「検索」ボタンをクリックすることで、AND検索を実行できます。（「価格」と「ジャンル」のどちらか一方だけでも検索可能です。） 一見、問題のなさそうな画面ではありますが、ユーザビリティテスト（ユーザ行動観察調査）の結果、一部のユーザは「検索」ボタンに気づかず、「価格から探す」のプルダウンメニューを選択しただけで、自動的に価格が絞り込まれると勘違いしました。 「価格から探す」のプルダウンメニューと「検索」ボタンの上端を揃えていないことで、この2つの要素の関連が分かりづらくなっており、勘違いが生じたと考えられます。 この画面の設計者としては、「価格から探す」と「ジャンルから

アパレル（衣料）関連のECサイトでは、ユーザは商品を実際に試着して確認することができないため、ページ上に表示する商品をいかに魅力的に見せるかが、売上げを伸ばすために重要なポイントとなってきます。 アパレル関連の商品を扱っている場合、詳細ページには、商品単体だけでなくモデルが着用している商品写真も合わせて見せることが効果的であることが、弊社の調査でわかってきています。 オンラインショッピングをしているユーザは、膨大な数の商品の中から、自身が欲しいと思うものを絞り込んでいき、絞り込まれた候補の中で、ある程度、時間をかけて検討した結果、最終的に購入するものを決定していきます。 最初の絞込み時点では、Tシャツにしようかワンピースにしようか、Tシャツの中でも形や素材感はどのようなものにしようかなど、商品単体の写真が並ぶ一覧を見ながら比較検討して、取捨選択していきます。 その後、ある程度、絞り込まれて

資料請求や申し込みフォームにおけるユーザの離脱を防ぐ方法はこれまでにもご紹介してきましたが、今回は「さらに一歩」改善するためのテクニックをご紹介いたします。 例えばECサイトのフォームでは支払い方法や配送方法など、ユーザに様々なオプションを選ばせることがよくあります。選択肢が多いことは利便性にも繋がりますが、一方でそれが離脱の原因になっている可能性もあります。 ユーザはフォームが縦に長かったり入力欄が多く見えると、「入力が面倒そう」と思い離脱の可能性が増えます。 以下は改善例です。支払い方法を選択するラジオボタンをクリックしてみてください。 選択したオプションに関連した情報だけを出す、言い換えると「要らないものは隠してしまう」のです。 クレジット決済をしたいと思っているユーザには、銀行振り込みや代金引換の注意書きは不要ですから、余計な情報を隠すことでフォームが簡単に見え、離脱を減らすことが

ニュースサイトや一部のブログなど、日常的に数多くの情報を扱うニュース系のサイトでは、見出しの配置や優劣がユーザの行動に大きな影響を与えます。 商品の比較や購買のためにECサイトを訪れるようなユーザと大きく異なり、ニュース系サイトのユーザは以下のような行動特性を示します。 特定の目的を持たずにサイトを訪れ、興味を引く情報を探す見出しを流し読みし、興味があるものだけクリックして詳細を見る短時間に、必要最低限の情報を得ようとする 弊社のユーザビリティテスト（ユーザ行動観察調査）では、こういった流し読みの際にユーザに認識されるのは、冒頭の15文字程度であることがわかっています。アイトラッキングによる観察では、ひとつひとつの見出しを読むのではなく、ほぼ一直線に視線を進めていきます。 【参考ページ】 アイトラッキング分析 つまり、この15文字の中に、リンク先の内容が想像できて、なおかつ興味を引く言葉を

サイトを訪問したユーザに対して「キャンペーンの告知」や「新製品の訴求」、「おすすめサービスの宣伝」のように、サイト訪問目的と違う何かを伝えたいということはよくあるのではないでしょうか。 そういった場合に利用できるのが、完了画面やログアウト画面で訴求したいものを表示するという方法です。 目的遂行後に表示される完了ページやログアウト画面では、ユーザに「次は■■■■をする」といった明確な意思がないことが多く、サイトが訴求したいものを受け入れてくれることがあります。 以下は弊社が行ったユーザー行動観察調査で見られたユーザの行動例です。 あるECサイトでは新しく販売した製品をユーザに認知して欲しいという希望があり、トップページなど多くの画面で新製品を訴求していました。ただし、ユーザは自分が欲しいものの買い物に一生懸命なため、新製品の訴求に一向に気付きません。 そこで試してみたのが購入完了ページでの新

ユーザの訪問頻度を考慮したトップページの工夫について、過去の実践メモでは、ニュースサイトを題材に記事の見せ方と本数を取り上げました（ユーザの訪問頻度を考慮したトップページ設計 2008/5/19）。今回は、企業サイトのトップページ画像の切り替え方法の一例を紹介します。 この点については、過去に「Flashでの画像切り替えの盲点」として1つの注意点をご紹介しましたが、ユーザの訪問頻度や滞在時間という観点から、複数の画像を効果的に見せるための別の手法を考えてみることにしましょう。 ある金融関連企業サイトのトップページでは、ユーザに複数のサービスを認知してもらうため、複数種類の画像を切り替えながら見せていくようなFlashアニメーションを設置していました。 ところが、アクセスログ解析データによると、トップページを訪れたユーザのうち、2枚目以降の画像が表示されるまでトップページに滞在しているユーザ

今回は、A List Apart.掲載のLuke Wroblewski氏による記事、"Sign Up Forms Must Die"をご紹介します。 ユーザにウェブサービスを提供する上で、まずは「会員登録」を求めることはよくあることだと思いますが、今回は、「まずは会員登録」から始めずユーザの会員化を実現する方法についての記事です。 旧来の「まずは会員登録」の事例： 動画共有サイトの一つ、 Google Video( http://video.google.com/)を例にとります。ユーザはGoogle Videoに訪問し、色々な動画を見ていく中で、自分もウェブ上に動画を公開してみたいと思います。そこで、「ビデオをアップロードする(Upload Video)」を押すと、その機能を利用するためのアカウント作成を初めに求められ、以下の会員登録ページにたどり着いてフォームへの情報入力を求められます

携帯サイトでの会員登録で、メールアドレス確認のためにユーザが入力したメールアドレスに仮登録メールを送信し、メールに書かれたURLから本登録をさせるフローにすることがあります。 弊社で行ったユーザビリティテスト（ユーザ行動観察調査）では、携帯サイトでの会員登録の途中で、自分の携帯電話に仮登録メールが届かず、ユーザが混乱して登録をあきらめてしまうケースが多数見られました。 このサイトでは、会員登録フローの画面上でメール受信設定についての記述がなかったため、メール受信設定をしていたユーザは、仮登録メールを受信するにはドメインを新たに追加する必要があることに気づきませんでした。 このような事態を防ぐために、携帯サイトではメール受信設定についてきちんと記述し、ユーザが自社のドメイン/メールアドレスを確実に追加できるようにしておくことが重要です。 この時に気をつけるポイントは2つあります。 1つ目は、