交互设计七大定律之新乡重夫:防错原则

最近在整理交互设计七大定律,发现了这篇老文,内容很精彩,翻译下与大家分享。

最近在整理交互设计七大定律,文章要系统的看。

目录:【交互设计七大定律】关于交互设计法则“除非有更好的选择,否则就遵从标准——交互设计之父阿兰·库珀”

 

表单重复提交是在多用户Web应用中最常见、带来很多麻烦的一个问题。有很多的应用场景都会遇到重复提交问题,比如:点击提交按钮两次。
点击刷新按钮。
使用浏览器后退按钮重复之前的操作,导致重复提交表单。
使用浏览器历史记录重复提交表单。
浏览器重复的HTTP请求。交互设计七大定律之新乡重夫:防错原则

几种防止表单重复提交的方法

禁掉提交按钮。表单提交后使用Javascript使提交按钮disable。这种方法防止心急的用户多次点击按钮。但有个问题,如果客户端把Javascript给禁止掉,这种方法就无效了。

我之前的文章曾说过用一些Jquery插件效果不错。

Post/Redirect/Get模式。在提交后执行页面重定向,这就是所谓的Post-Redirect-Get (PRG)模式。简言之,当用户提交了表单后,你去执行一个客户端的重定向,转到提交成功信息页面。

这能避免用户按F5导致的重复提交,而其也不会出现浏览器表单重复提交的警告,也能消除按浏览器前进和后退按导致的同样问题。

在session中存放一个特殊标志。当表单页面被请求时,生成一个特殊的字符标志串,存在session中,同时放在表单的隐藏域里。接受处理表单数据时,检查标识字串是否存在,并立即从session中删除它,然后正常处理数据。

如果发现表单提交里没有有效的标志串,这说明表单已经被提交过了,忽略这次提交。

这使你的web应用有了更高级的XSRF保护。

在数据库里添加约束。在数据库里添加唯一约束或创建唯一索引,防止出现重复数据。这是最有效的防止重复提交数据的方法。

防止错误、重复、冗余等等情况都属于放错原则,大家可以根据个人的项目经验进行开发。

防错原则认为大部分的意外都是由设计的疏忽,而不是人为操作疏忽。通过改变设计可以把过失降到最低。该原则最初是用于工业管理的,但在交互设计也十分适用。如在硬件设计上的 USB 插槽;而在界面交互设计中也是可以经常看到,如当使用条件没有满足时,常常通过使功能失效来表示(一般按钮会变为灰色无法点击),以避免勿按。

1417413400201220

如上图所示评论功能快,在留言框没有内容或邮箱格式不正确的时候是无法获取验证码的,只有两者都满足了才可以。

防止错误数据录入是所有程序设计的必要过程,下面这段就需要有研发经验的人才能看懂了,不过设计师了解一下也不错

表单重复提交是在多用户Web应用中最常见的一个问题,很多场合都会遇到这种情况,下面与大家分享下防止表单重复提交的几种策略

原创文章,作者:ioued,如若转载,请注明出处:https://www.iamue.com/8923/

(0)
iouedioued
上一篇 2015-08-27
下一篇 2015-08-27

相关推荐

  • 除了灵感,还有什么方法能帮你想出新的idea【UXRen译#174】

    作者: Mind Tools Editorial Team |  翻译:Chen Jing,校审:包子   “我们要 think differently!”“这个得有些新想法!”“我们要更有创意!”这些声音是否在你工作的场所越来越多? 面对复杂,开放和不断变化的挑战…

    交互专题 2017-08-07
  • 【颜值已爆表】00io.com-盘点2014最精彩的移动APP动画UI

    原文导读: On the third day of The Highlight 2014, we’re bringing you our picks of some of the best UI animations we’ve seen in apps and across the web. Apps have been a UI playground for quite some …

    2015-01-14
  • 交互设计的未来

    数十万互联网从业者的共同关注!译者:小媛作者:Terry Cao ,发表于DESIGN & DEV译文地址:http://www.jianshu.com/p/daaa353e6d95译者授权早读课发表,转载请联系译者。欢迎投稿到早读课,投稿邮箱:mm@zaodu…

    2017-08-04
  • 如何机智地向外行人解释交互设计到底做什么的

    破除对交互设计师的三大误解,交互设计师不等于视觉设计师不等于美工,且不会几分钟做个logo,机智向外行解释交互设计师到底做什么

  • Sketch 4.0 改进矢量编辑&下载地址

    Sketch 4.0 改进矢量编辑&下载地址

    2016-09-22
  • 能够带来更好体验的“浅交互设计”,是对人机交互设计方式的全新思考

    原文地址:https://www.smashingmagazine.com/2016/03/getting-disconnected-shallow-interaction-design-deeper-human-experiences/本文由设计夹设计研究小组 成员杨梦龙翻译校对我们的一切都被连接起来了。我的手…

    2017-08-02
  • 中国App设计真好!—— 一个美国人到中国当产品经理的心得

    导读:应用软件层出不穷,各个国家的人为自己生活的便利设计出各款的应用。然而,同样的应用,是否会因为中西方文化的差异,或者是生活方式的不同,导致相同应用的设计有所不同吗?是的,有的!Dan Grover 现在是腾…

    2015-02-10
  • 交互设计之寻求设计需求点

    交互设计师如何进行设计需求分析?首先看交互设计的职责,协助产品经理进行需求分析,进行交互稿绘制,与视觉设计师对接。交互设计必须懂得进行需求的分析,不仅仅是用户需求,还有业务需求的分析,也就是来自产品的诉求,企业做这个产品的目的是什么。因此一个方案如果不能满足业务需求、用户需求和一个好的用户体验,那么它就不是一个好的方案。在这篇文章主要介绍的是如何进行需求分析和关键因素分析,找到设计的需求点。在这里主要分为了四个步骤:分析业务需求、分析用...

    2018-04-30
  • 用户体验让生活更美好

    我们赤裸裸的来到这个世界,最后赤裸裸的离开,来人世走一遭就是来体验来了。图片来源:亚朵官网-Life is Atour周四晚上拉着应用体验部的穆老师在产品交互问题上聊了一个多小时,深受启发,再结合上周末去天津游玩,入住了梁宁老师在得到里推荐的非常注重用户体验的亚朵酒店,所以我觉得今天有必要在这里和大家聊聊用户体验的话题。图片来源: Scorch先声明用户体验设计不是视觉设计或UI设计,后者只能算是前者的组成部分。“用户体验”一词是Don...

    2018-04-02
  • 淘宝2017-提示信息的情感化设计

    作者:要白 明飒   开端:做一个有故事的 现如今,消费者对产品的需求从追求高性价比更多地转为高品质,虽然手机只是一个机器,但用户与产品之间当然是能有情感传递的,不然就只是一个冷冰冰的工具而已,能让用户在…

    交互专题 2017-08-07