web-dev-qa-db-ja.com

モバイルデバイスで日付を入力するためのベストプラクティス

いくつかのオプションのうち、モバイルデバイスで表示されるWebサイトで「生年月日」セレクターを使用するための最もユーザーフレンドリーな方法は何でしょうか。ほぼすべてのユーザーは'85年頃からですが、技術的にはどの日付でもかまいません。

  1. テキストボックス
  2. 複数のテキストボックス(DD、MM、YYYY)
  3. 複数の選択ボックス
  4. 日付ピッカー

検討していない他のオプションはありますか?

2
evandentremont

これは非常に簡単です。適切な設計ガイドで概説されているように、プラットフォームごとに標準の日付ピッカーコントロールを使用する必要があります。

AndroidクラスリファレンスiOSクラスリファレンス 、および Windows Phoneクラスリファレンス を次に示します。

Webアプリで作業している場合でも、ネイティブの日付ピッカーを使用してユーザーの混乱を最小限に抑え、一貫したエクスペリエンスを提供することをお勧めします。これは、inputタグのHTML5属性を使用して行うことができます。

あなたはフォローしたいかもしれません:

5
dnbrv

私の作業中に、ほとんどの人(私を含む)は、単一フィールドとフォーマットヘルパーラベル(_____ DD/MM/YYYY)が最も好きであることがわかりました。

入力は簡単で高速であり、誰もがフォーマットのヒントを取得する必要があります。さらに、プログラムで後で評価して操作するのも簡単です。おまけ:ほとんどのモバイルデバイスでは、数字入力モードのときにキーボードに共通の区切り記号(/ ,.)が表示されます。

2
assiprinz

再:他のオプションと考慮事項...

航空会社やホテルの予約などの日付(通常は今年の後半)の場合、個人的には、テキストを入力したり、ポップアップカレンダーから選択したりする同時機能を好みます。 Webアプリの場合、これをかなりうまく実行できるjQueryプラグインがあるか、ネイティブのdatePickerコントロールを使用するだけです。これは、人々が理解していて、かなり簡単に使用できます。

デバイスに関係なく考慮すべきもう1つの問題:日付形式のローカリゼーション。
ユーザーに基づいて、考慮する必要がある月の名前、カレンダーシステム、または非ラテン系のアルファベットはどれですか。

「DD/MM/YYYY」の使用は、ほとんどのヨーロッパ諸国で問題なく機能しますが、(何らかの理由で)人々がMM/DD/YYYYとして日付を記述することが多い米国では混乱する可能性があります。

たとえば、日本ではこれらは同じ日付であり、ヨーロッパ標準とは逆になっています。

1985年10月12日(YYYY/MM/DD)

昭和60 10月12日(GGYY/MM/DD、ここで「G」は年を数える帝国の時代)

もちろん、ほとんどの人は明確にラベル付けされた入力フィールドを理解しているでしょうが、対象読者によっては検討する価値があるかもしれません。

ネイティブモバイルアプリの場合、OSは通常、ユーザーが選択したデバイス設定に合わせて情報をフォーマットするのに役立ちます。 Webアプリの場合、単一のオプションを入力フィールドにハードコーディングするのではなく、 Moment.js またはPHPソリューションのようなものを検討してください。異なるフォーマットを処理すると、個別に操作できるように個別のフィールドが必要になる可能性があります(単一行の入力を標準形式に解析する可能性は高いですが、特定のロケール内でもタイプミスとバリエーションが発生しやすくなります)。

1
mc01