その確認画面、必要ですか？ | Accessible & Usable
公開日 : 2016年10月10日 カテゴリー : ユーザビリティ 問い合わせや資料請求などのフォームで、入力後に送信ボタンを押すと、送信前の確認画面が出てくるものがあります。 確認画面を見て、特に誤入力がなければ、もう一度送信ボタンを押して、そこで初めて送信が完了します。確認画面を見て、もし誤入力があれば、再度入力画面に戻ってから修正します。 このようなインタラクションは、2つの点で「まどろっこしい」と言えるでしょう。 入力してから送信される間に、1ステップ (余計な) 手続きが挟まれる。 確認画面で要修正箇所を見つけても、その場で修正ができない。 上記のうち、特にふたつ目はやっかいな問題です。ユーザーは確認画面で見つけた要修正個所 (と修正が必要な理由) を、実際に入力画面に戻って修正するまで、記憶しておかなければならないからです。 確認画面で修正できるようにすればよいのでは？と思われ
日付入力フォームのUXデザインガイドライン
日付入力欄は、適切なデザインパターンを利用して、あいまいさのない、タスク達成に役立つものにしなければならない。小さなデザイン変更で、大きなユーザーエラーが防げる可能性もあるのだ。 Date-Input Form Fields: UX Design Guidelines by Angie Li on January 22, 2017 日本語版2017年4月24日公開 日付入力欄の書式設定など、ささいなことだと思うかもしれない。しかし、書式の実装が不適切だと、ちょっとしたインタラクションによって、入力のプロセスが立ち往生してしまうこともある。日付入力に関するデザインが良くないと、ユーザーが悩んだり、イライラすることになり、その入力フォームを全面的に断念してしまうというリスクがあるからだ。それどころか、ユーザーが間違った日付を指定してしまって、取引自体が悲惨なことになってしまう可能性もある。たと
チェックボックス 対 ラジオボタン
有名ウェブサイトでも、基本的なユーザインタフェース（UI）で初歩的な間違いを犯すことがある。主要なガイドラインは明確だが、それ以外にも考慮しなくてはいけないことが 10 項目ある。 Checkboxes vs. Radio Buttons by Jakob Nielsen on September 27, 2004 最近、有名ウェブサイトの登録ページで、下に示すような記入欄を見た。これには最低でも 2 つのデザイン上の間違いがある。続きを読む前にその 2 つを見つけることができるか、試してもらいたい。 お見逃しありませんように！お薦めの製品、ソリューション、サービス、講習会などの最新情報を提供いたします。ぜひ Foobar Corp. や、そのほか選りすぐりの企業からの情報をお取り寄せください。 電子メールを通して、最新情報をお送りしてもよろしいでしょうか？ はい、電子メールを通して、その
ラジオボタンをUIに用いる時のポイントを解説！より良いサイト、アプリの利用環境のために
ラジオボタンはフォームにおける必須要素です。互いに相容れない２つ以上のオプションがある時に使用され、ユーザーは正確に１つの選択肢を選ばなければなりません。言い換えれば、選ばれていないラジオボタンをクリックすることによって、選んでいた他のどんなボタンも選ばないということになります。 ラジオボタンは正しく使用されれば素晴らしいものです。ユーザーが間違ったデータを入力するのを防ぎます。キーボード・ナビゲーションやプラットフォームを通じた信頼できるレンダリングなど、多くの選択肢を提示してくれます。 本稿では、ユーザビリティ・テストによって巧みにつくられたラジオボタンに関する実用的なガイドラインをご紹介します。 ラジオボタンの名前の由来 古いカーラジオにおいて放送局を変えるために使われたことにちなんでラジオボタンと呼ばれるようになりましたが、このボタンは１つ押された時、別の１つは飛び出すようになって
名字と名前で入力フィールドを分割すべきでない理由
anthony氏はUX Movementの著者であり編集長です。明快で効率的なデザインに美しさを見出し、ユーザーのために喜んで戦います。 あなたの作った入力フォームには、名字と名前という２つの入力欄がありませんか？ 特にグローバルに展開するようなサービスにおいて、このような入力欄はユーザーが名前を記入するのを難しくしている可能性があり、解決する必要があります。 名字と名前が区切られた入力欄は問題を引き起こす すべてのユーザーが名字と名前を持っているわけではありません。姓名は文化的背景によって構造がかなり異なるからです。 たとえば、ラテンアメリカ出身の場合、両親から１つずつ姓を引き継ぐため、姓を２つ持っている可能性があります。また、中国出身の場合、名字が先にきて名前が後ろに続くという書式に慣れているでしょう。 このように、すべてのユーザーに名前を２つの固定の欄に入力させることは不可能なのです
B2Bサイトのフォームにおけるベストプラクティス研究 ｜WACUL TECHNOLOGY & MARKETING LAB | 株式会社WACUL
WACULテクノロジー＆マーケティングラボでは、B2B企業のWebサイトにおいて、問い合わせなどのフォームで見込み客が離脱させないためにどのようにすべきか、また改善によってどれだけの差分が出るかを定量的に分析しました。
インラインバリデーションがフォーム入力の妨げになるケース
UX Movementの創立者、ライター。ユーザーに優しいユーザーエクスペリエンスデザインのスキルを読者の方が上達できるよう、UX Movementのブログを作りました。 フォーム入力におけるインラインバリデーションはユーザーの入力完了を妨げている恐れがあります。 インラインバリデーションは問題のあるフィールドのインラインにエラーメッセージを表示します。ユーザーがフォームを送信する前にこれが起動すると、さらなるエラーが発生する原因になり、フォームを完了するのに余計に時間が掛かってしまうことがあります。 送信前にバリデーションをするということ 77名と90名が参加した２つのリサーチによれば、ユーザーが情報を記入したフィールドから離れた瞬間にエラーメッセージを表示すると、フォームを完了するまでにはるかに多くのエラーを犯すことがわかりました。 ユーザーは間違いを瞬時に訂正する機会があったにもかか
徹底図解 入力フォームのデザイン・UXを高める15の方法 - ポップインサイト
サインアップ画面やデータ入力画面の「フォーム」は、サイトやアプリ設計において最も重要な要素の1つです。本記事では、入力フォームデザインのUXを高める15のルールをご紹介します。 ポップインサイトでは、ユーザーリサーチのファクトにもとづいたWEBサイト改善を支援しています。WEBサイトのUX改善に課題がある方はお気軽にご相談ください。⇒UXデザイン/UXリサーチについて相談する ※紹介資料の無料ダウンロードはこちら ※関連記事：【EFOとは？】入力フォーム最適化施策8選：CVR（コンバージョン率）改善のコツ ※この記事はuxdesign.ccの記事を許可のもと翻訳・編集したものです。 翻訳元記事：Design Better Forms (2016/7/5) 著者：Andrew Coyle
Best Practices For Mobile Form Design — Smashing Magazine
About The AuthorNick Babich is a developer, tech enthusiast, and UX lover. He has spent the last 10 years working in the software industry with a specialized focus on … More about Nick ↬ Users can be hesitant to fill out forms. That is why it is our goal as designers to make the process of filling out a form as easy as possible. The primary goal with every form is completion. Two factors have a ma
どんな生年月日の入力フォームがわかりやすいのか
UX Movementの創立者、ライター。ユーザーに優しいUXデザインのスキルを読者の方が上達できるよう、UX Movementのブログを始める。 生年月日の表記方法は国によって異なります。さらに、生年月日のフォームは年、月、日という３つのデータで構成されているためわかりにくくなりがちです。生年月日の入力フォーマットがわかりにくい場合、ユーザーを苛立たせることになります。 わかりにくいフォーマット ユーザーは、誕生月が最初に来るフォーマット（月/日/年）か、誕生日が最初に来るフォーマット（日/月/年）のどちらかに慣れています。そのため、フォームがいつものフォーマットと異なると混乱してしまいます。 生年月日でユーザーがよく見るフォームは、「月/日/年」か「日/月/年」です。「MM」が「月」、「DD」が「日」を表していることを知っているユーザーもいますが、混乱したり無視するユーザーもいます。
入力フォームのプレースホルダーを使ってはいけない
入力フォームのプレースホルダーテキストは、入力欄にどんな情報を入れたのかをユーザーが思い出すことや、エラーのチェック・修正を難しくしてしまう。また、視覚や認知機能に障害のあるユーザーにはさらなる負担となる。 Placeholders in Form Fields Are Harmful by Katie Sherwin on May 11, 2014 日本語版2014年6月17日公開 コンテクストに沿った説明やヒントは、入力フォームのそれぞれに何が入るかを明確にするのに役立つ。その結果、入力が促進され、コンバージョンレートは向上する。ヒントの提供方法はいろいろとある。実装として一般的なのは、入力フォーム内に説明を入れるやり方だ。しかし、残念ながら、入力フォーム内のプレースホルダーはユーザビリティに役立つよりも損なうことのほうが多いことがユーザビリティテストでは繰り返し示されている。 ラベル
お願いだからWebフォームではを正しく使ってユーザビリティを上げてくれ | 初代編集長ブログ―安田英久
今日は、Webフォームが「うわ、使いづらい」となってしまわないようにする、意外と対応されていないことが多いHTMLタグ「<label>」について。 HTMLを自分で書かないWeb担当者さんでも、デザイナーさんが作ったフォームに関して最低限これだけはチェックしておくといいですよ、というお話しです。 コンバージョンの要である「Webフォーム」。アクセス解析での改善やEFO（入力フォーム最適化）をしていると思いますが、意外と忘れられていることが多い「<label>」をご存じでしょうか。 フォームの入力項目それぞれの「ラベル（項目名）」を書くためのHTMLの作法なのですが、これをちゃんと使っているかどうかで、フォームの使いやすさがガラッと変わるのです。 一番わかりやすいのは、ラジオボタンやチェックボックス。<label>をちゃんと使っていると、ボタン部分ではなく文字の部分をクリックするだけで項目を
そのフォーム入力欄は分割する必要があるのか？ | Accessible & Usable
公開日 : 2013年7月3日 カテゴリー : ユーザビリティ Web サイトの入力フォームで、入力欄 (テキストボックスなど) が細かく分かれているのを、よく見かけます。たとえば、以下のような例があります。 住所の入力欄が、「都道府県」「市区町村および番地」「マンション/アパート名および部屋番号」に分かれている。 郵便番号の入力欄が、「前半の3桁」と「後半の4桁」とで分かれている (入力欄の間はハイフンで繋がれている)。 電話番号の入力欄が、「市外局番」「市内局番」「末端の番号」に分かれている (入力欄の間はハイフンで繋がれている)。 氏名の入力欄が、「姓」「名」に分かれている。 メールアドレスの入力欄が、「ユーザーネーム (@ の手前)」と「ドメインネーム (@ の後ろ)」とで分かれている。 今回は、このように入力欄が分かれているフォームについて、ユーザビリティの観点で少し考えてみよう
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
