【翻译】日期输入表单区域：用户体验设计规范

原文地址：https://www.nngroup.com/articles/date-input/

总结：通过使用正确的设计模式，日期输入区域必须是不含糊和支持任务完成的。小的设计改变可以预防用户的错误。

格式化一个日期输入的区域看上去可能是一个很小的细节，然而，如果运用不当即使是一个小的交互也可能导致一个流程的阻塞。设计糟糕的日期输入会导致用户沮丧和恼羞成怒——冒着完全放弃这个形式的风险。更糟糕的是，假如用户指定了错误日期，整个交易将会是一场灾难——试想一下，举个例子：假如你满怀期待的出现在一个新剧的电影院里，结果你发现你买的票是另外一天的，此时的你作何感想？

为了移动端的用户以及全球的观众着想，必须考虑到提升这种虽然小但是基础的输入。本文讨论日期区域的常见输入模式，错误处理和国际输入。

日期输入模式

日历选择器是一次性完整展示一个月的控件元素。他们通常在顶部展示了一周日子，然后匹配上了台历或者是挂历的隐喻。

手机上日历选择器案例，Google日历应用

日历选择器应该被用在接近当下时间的事件——少于一年。然而，这可能会让那些选择比较提前日期的用户觉得不爽，因为网站要求用过多的导航才能得到想要的输入，对于这些用户，简单的输入年份可能更便捷些。

日历选择器对于选择日期范围更有用。在那些情况下，他们经常将两个月并排显示。

Expedia用了一种浅蓝色来表达选中的出发和回程的日期范围，出发和回程日期在日历里用不同的颜色区分出来。

在手机移动端滑动日期是很普遍的，但如果选择器包含了太多的日期也会很烦。那些情况下，在一个狭小的地方滑动时很慢且效率不高的，最好让用户直接输入日期。

在Todoist应用中，用户可以用一个无止尽的转轮给每个任务输入一个截止日期。假如截止日期就发生在周五或周六的话，这不是一个问题（如下所示）。然而，假如截止日期是几周之后，那么用输入日期来替代对用户而言会更加容易。

在iPhone的Todoist应用中，他们允许用户转动和输入日期，注意将当前日期标明为‘今天’，它消除了任何用户可能不记得今天日期的可能性。

将日期用选择器分成年、月、日需要很多不必要的步骤，这个方法通过额外的点击和滑动增加了交互成本，我们建议不要使用这个格式。

DeviantArt给日期区域的每个部分提供了选择器

输入日期对于日期输入是最基本的选项，在很多情况下这是最有效率的方式。特别是在日期很远的情况下（如出生日期）。我们建议你允许用户输入日期即使其他输入方法可用。

日期输入设计指南

对于有限数量的日期选择，提供一列可用的日期。在一些情况下，用户只能选择少许的一些日期。例如，谷歌快递，一个线上的快递服务，让用户可以在线上预定商品后安排一个递送时间。比起提供一个空白的时间区域或是一个无限制的日期选择器，谷歌快递提供了一个简短的日期选择列表。不能选的日期已被置灰和禁用了。（或者，不能选的日期甚至可以不出现在列表里）