タブの制作で注意すべきこと (ユーザビリティ実践メモ)
このエリアで迷ったユーザの典型的な行動例を以下(1)から(4)のステップでご説明します。（下図とあわせてご覧ください。） (1) 初期状態の「タブA」から、「タブB」をクリックした。 (2) 「タブB」内に表示された「リンク４」をクリックし、ページ遷移した。 (3) 遷移先ページを閲覧した後、(2)で見えていた「リンク５」や「リンク６」も気になっていたため、ブラウザの「戻る」ボタンをクリックした。 (4) 戻ったページでは、タブが初期状態の「タブA」になっていたが、ユーザは気付かずに「リンク１」や「リンク２」をクリックしてしまった。 (4)の場面で、ユーザはさきほど選択した「タブB」の内容が表示されていると思っていたため、実際にどのタブが選択されているかということに注意を払っていませんでした。 上記例のような混乱を防ぐためには、切り替えたタブをページ遷移後も記憶するように制作した方が良いで
エラーの頻発を前提にしたフォーム設計 (ユーザビリティ実践メモ)
フォームの主要な離脱要因の一つに、「エラーが発生しているが、ユーザがそのエラーを解決できない」というものがあります。この要因に対しては、以下の2つのアプローチがあります。 例として、記入例を添えておく、ユーザの入力に対してシステム側で自動的に対応する(半角/全角入力のどちらも受け付けるなど)、という方法が挙げられます。 ■エラーが起こった場合に、エラーから復帰しやすくする 例として、エラー発生箇所を強調する、エラー部分以外の入力内容を保持しておく、という方法があります。 今回は、後者の「エラーから復帰しやすくする」というアプローチについて、興味深い例をご紹介します。 あるコミュニティサイトの会員登録フォームの中に、コミュニティサイトで使用するID(ハンドルネーム)と自己プロフィール、興味・関心のある話題を入力する画面がありましたが、このうち、ハンドルネームの設定でエラーが頻発していました。
複数カテゴリ検索のインターフェース (ユーザビリティ実践メモ)
Webサイトの検索機能で、「テキスト」と「画像」、「ニュース」と「製品情報」など、複数のカテゴリを切り替えて検索できる機能を提供しているものがあります。今回はその切替の方法について考えます。 ある金融情報サイトで、企業名でサイト内検索を行ったところ、「記事」カテゴリでの検索結果が0件と表示されました。 このとき、結果が0件だったことを認識したユーザは、ページ上部のタブをクリックして「株価」に切り替えました。このとき 自分がクリックしたタブが切り替わる（アクティブなタブが濃い色になる） という変化で、ユーザには自分が別のカテゴリに移動したことが伝わりました。 しかし、検索結果部分の見た目に変化がなかったため、ユーザは「どちらのカテゴリにも自分の求める情報がない」と判断して、このサイトを立ち去りました。 このページではタブ切り替えだけでは再検索されず、新しい画面で改めて「検索」ボタンをクリック
【海外事例に学ぶ】入力フォームにおける、ヘルプテキストの効果的な表示方法 (ユーザビリティ実践メモ)
今回は、Uxmatters掲載のLuke Wroblewski氏による記事、“Dynamic Help in Web Forms”をご紹介いたします。 Wrobrewski氏は、現在Yahoo! IncのSenior Principal of Product Ideation & Designをされている方です。 しかし、そのようなヘルプテキストは極力少なくしたいものです。 説明文だらけの入力フォームは、かえってユーザの入力意欲を減退させてしまい、入力完遂(コンバージョン)への弊害となる可能性があるからです。 では、そのような悪影響がないよう配慮しつつ、ヘルプテキストをうまく提示するにはどうすればよいでしょうか。 解決方法の一つとして、ヘルプテキストを動的に表示することが考えられるでしょう。Wroblewski氏はそのなかで3つのパターンを示しています。 a.自動挿入型 b.ユーザクリック
個人プロフィールからの引用を考慮した携帯サイトフォーム設計 (ユーザビリティ実践メモ)
PCをほぼ/全く利用しない「インターネット＝携帯電話」ユーザには、フォームなどでメールアドレスを入力する際に、個人プロフィールから引用する傾向があります。 機種によってこの機能の名称や使用方法は異なりますが、筆者の携帯では下記の操作でプロフィールを引用することが可能です。 プロフィールの中でもメールアドレスは、文字数が多く、英数字が混在するため、直接入力する場合、煩わしい操作を要します。 そのため、携帯の操作に慣れているユーザの多くが上記の機能を使用してメールアドレスを入力しているのです。 この行動を想定したうえでサイトを制作しなければ、ユーザにストレスを与えてしまう可能性があります。 例えば、あるメールアドレス入力フォームでは、下図のように「＠」より前をフリーワードで入力し、「＠」より後ろをプルダウンメニューで選択する仕様にしていました。 一見、親切そうに見えるフォームですが、プロフィー
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
