タグ

webデザインとフォームに関するzetfsのブックマーク (6)

  • あと1%離脱を減らすフォームのテクニック (ユーザビリティ実践メモ)

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

  • マウスのホイールによる入力エラーの可能性 (ユーザビリティ実践メモ)

    しかし、プルダウンでの項目選択を行う入力フォームにおいては、この便利さが逆効果になる場合があります。弊社のユーザビリティテスト(ユーザ行動観察調査)で観察された例をご紹介しましょう。 1ページの入力項目が多く、何度かスクロールしなければ「次へ」のボタンまでたどり着けない入力フォームを使うという作業で、ほとんどのユーザはホイールを使いながら入力を進めて行きました。 その中で、あるユーザがプルダウンの項目を選択し終え、ページをスクロールして次の項目へ入力を進めようとホイールを操作したところ、直前に入力したプルダウンにまだフォーカス(ハイライト)が当たった状態であったため、選択項目が別のものに変わりました。つまり、ホイール操作がページのスクロールではなく、プルダウン内の選択項目の移動に使われたということです。 ユーザはページがスクロールしないことにすぐ気づき、ページ内の空白部分をクリックしてプル

  • フォームの離脱を防ぐ心遣い (ユーザビリティ実践メモ)

    資料請求や申込みフォームにおけるユーザの離脱を防ぐ方法はこれまでもご紹介しましたが、今日は「入力フォームに遷移する手前」で行う離脱を防ぐ心がけを私の実体験からご紹介したいと思います。 郵便番号、住所、名前と入れ画面をスクロールすると、次の項目に、「お客さま番号」という項目があることを見つけました。 始め、このお客さま番号が何の番号か思い当たらなかったのですが、入力欄の脇にある「お客さま番号とは」というリンクから、毎月届く領収証(「電気ご使用量のお知らせ」)に記載されている番号であることがすぐにわかりました。(このサイトでは、実際の領収証のイメージで説明しており、とてもわかりやすくなっていました) しかし、領収証の保管場所をすぐに思い出せなかった私は、また後日手続きを行おうと思いここで画面を閉じてしまいました。 皆さんはこのような経験をされたことはないでしょうか? このような状況にユーザが置

  • フォームでのちょっとした配慮の例 (ユーザビリティ実践メモ)

    フォーム設計のポイントについては、実践メモでも何度もご紹介してきました。 フォーム設計についての記事一覧 今回は、ECサイトの「配送日時」を例にとって、フォームの改善ポイントをご紹介します。 一見普通のフォームですが、実際にユーザ行動観察調査を行ってみると、何人ものユーザが混乱する様子が観察されました。どのような問題が起こったのでしょうか? 調査では、次のようなことが起こりました。 「配送日時は1週間以内をご指定ください」という注記の存在に気付かず、1週間以降の月日を入力してしまった。 「2月8日」と入力したが、実際に指定できるのは2月7日までだった。 翌週の水曜日で指定したかったが何日か分からずに、手元の手帳でカレンダーを確認しようとした。 開発側の視点では、「1週間以内とちゃんと明記しているのに・・・」「曜日なんて考えるまでもない」と思ってしまいがちです。 もちろん何の問題もなく使いこ

  • LukeW | Primary & Secondary Actions in Web Forms

    Primary & Secondary Actions in Web Forms by Luke Wroblewski August 27, 2007 In recent months, I’ve been working on refining the design recommendations in my upcoming book, Web Form Design Best Practices, through actual usage data. To that end, I’ve had the pleasure of working with London-based usability firm Etre on several eye-tracking and usability studies focused on specific aspects of Web form

    LukeW | Primary & Secondary Actions in Web Forms
  • 検索フォームや見出しなどエレメントのデザインを集めたサイト -Elements of Design | コリス

    Elements of Designは、ブログなどのウェブサイトでよく使うエレメントのデザインを集めたサイトです。

  • 1