简洁明了的优秀UI设计原则（4）

上一期链接：《简洁明了的优秀UI设计原则（3）》

今天继续分享Good UI用户界面设计原则的第31-40条。

#31 视觉必须体现层次

没有样式的内容，用户无法区分层次，也无法决定阅读顺序。右图那样一路看下来已经算好的了——多数用户碰到这种排版可是会直接走人的！

---

#32 分组相似的内容

常识。

△ 【左】菜单：打开 保存 建立副本 删除。工作区控制：放大 缩小。
【右】菜单：保存 缩小。工作区控制：放大 建立副本。 散在外边：打开 删除…… （这个有点搞笑了）

---

#33 表单内直接验证，替代传统的提交后返回错误

AJAX时代的新常识。不要忘记就可以。

当然也需要注意：传统的验证方法仍然要作为保底方案设计出来。绝对禁止因为前台有了AJAX后台就不验证。

△ 【左】好的表单 - 直接显示“这个选项是必填的”
【右】不那么完美的表单 - 提交后才显示缺少部分项

---

#34 宽容各种格式的用户输入！

在不引起二义性的前提下，程序员有责任尽可能多的接受各种格式的用户输入。例如信用卡号码、电话号码等数据，就应当自动接受并过滤括号、空格、减号、句点、逗号这些合理的分隔符。

宽进严出是程序设计的一个重要原则。对用户的输入要尽可能的宽容，但对数据的显示和输出（包括对用户输入数据的回显）必须格式严格。这个原则也同样适用于Web程序设计。

△ 几个电话号码中包含了空格、括号、减号、加号
【左】完美的表单 - 统统接受
【右】差强人意的表单 - 只接受带空格的
（不错了……国内多少表单连空格都不让加……程序员的懒惰、无知和自大气死人！）

---

#35 强调紧迫性

明日复明日，明日何其多。我生待明日，万事成蹉跎。不给用户设定时间期限，用户就永远没有行动的动力。该催促就催促。

用户都害怕失去机会，这是个应当合理利用的心理。只是不要欺骗用户——用户发现得了。

△ 【左】还有2天结束 ——　立刻行动
【右】总之行动吧，时间不要紧，今天、明天，反正拖到最后就不做了

---

#36 强调稀缺性

用户往往认为稀缺的东西更有价值，在面对稀缺资源时也更害怕错过。

用户都害怕失去机会，这是个应当合理利用的心理。只是必须再次强调：不要欺骗用户——用户发现得了。

△ 【左】最好的网络课程 - 仅余 2 席。 【右】最好的网络课程。

---

#37 给用户提示，不要让用户凭空回忆

做过调查问卷的都知道，右图那样一个<textarea>要求用户反馈的问题，如果是可选问题那么几乎没人写，如果是必填问题那么所有人都对付。

给用户一些提示去选择，明显比让用户自己从0开始回忆更友善。

△ 【左】请告诉我们您最喜欢的电影 - 这里是最近您看过的一些影片，供您选择。
【右】请告诉我们您最喜欢的电影 - 努力回忆一下吧！你能想起来的！加油！

---

#38 可点击元素做大点儿

小不点的按钮和导航条文字，那已经是上世纪90年代的网页样式了。

尤其是现在的移动时代，小按钮在手机上几乎没法点。请千万做大一点。

---

#39 页面加载做快点儿

几秒钟加载不出来，用户就流失百分之多少，这都是老生常谈的调查结论了。

请合理选择机房，并正确使用CDN、缓存等手段。生产环境的网站很大程度上都忌讳所有内容往主服务器上一堆完事。

---

#40 提供必要的快捷键

例如GMail使用j和k切换上一封/下一封邮件。对开发者群体会尤其受欢迎。

---

来源：GoodUI
SegmentFault原创编译，转载请遵守本站相关声明。
翻译与责任编辑：沙渺