美文心理个人纠纷职场创业
创业阅读
新闻投稿
创业工作
技能技术
职场职业
社会安全
纠纷案例
幽默乐趣
个人母婴
家庭家居
心理治疗
作文范文
美文笔记
历史解密

简化输入让网页表单更亲切

12月24日 栀璃鸢投稿 造句
  大部分人不喜欢填表单,因为人们来到网站,主要目的不是填表,而是浏览或者购买。精心设计的表单,使输入变得流畅让人心情愉悦,而糟糕的设计让人扶墙吐血。那怎样才是优秀的表单呢?页面的布局、逻辑组织、视觉样式等都是值得关注的细节,其中简化输入是最近常被提及的,在这里我分享下自己工作中的心得
  1、更高大的输入框
  增加输入框高度,加粗字体,可以让网页上的输入框看起来更容易填写和阅读。随着电脑显示器尺寸变大,这样的输入框也显得更大气。
  2、添加选取器。
  与其让人输入不如提供选择,选取内容只要点几下,就自动填充进输入框,不但可以减少输入障碍,还能预防出错。可以把任何希望的数据做成选取器,比如日期、颜色、地址或者历史记录等等。
  举个例子:前面的“对方开户姓名”输入框,需要填写对方的姓名,如果对方名字里有汉字不认识该怎么办呢?于是我们可以加上一个生僻字的选取器,如图:
  打开字库,可以根据模糊读音选取汉字填入输入框。另外,姓名输入框有校验,选取完成后不要忘记对输入框内容进行再一次校验。
  3、预置文字。
  采用预置文字来简化输入经常在手机上看到,现在在网页上也常使用。比如微博上发言的输入框,会保留你上一次未发出的内容,可以重新编辑。
  在网上也会看到把“输入提示”与“预置文字”混用。当然,你怎样称呼他们都是可以的,但要明白这是两种交互方式。输入提示的目的是指导填写的,聚焦输入框后文本消失;而预置文字是属于待修改的正式内容,字体样式应与正式输入的样式相同,聚焦后文本是不会消失的。
  当表单输入遇到选填与必填难以抉择时,考虑预置文字会是一个不错的折中方案。比如在一个申请付款的表单中,对用户来说主要需填写的是“对方账号”和“付款金额”,付款说明是一个选填项。但对系统来说,又必须采集付款说明,作为交易凭据之一,这个付款说明怎样处理呢?比较下面3个方式,显然复选框的方式不适合,因为用户若不填写我们就无法收集到数据,而输入提示的方式还是需要用户去填写,所以意义也不大。折中了业务和用户两方面,预置“转账”两字还是不错的,不想填写的人完全可以跳过它。
  4、设备读取。
  摄像头读取、语音输入最近,各种智能录入方式在手机上甚是流行,网页上也不甘心示弱,纷纷添加了这些功能还有人脸识别,不知道不久后会不会流行起来呢?
  5、设置输入属性。
  现在比较靠谱的还是Html5提供的一些表单类型属性。除了限制输入类型之外还有一些有意思的设置。拖放属性,可以从桌面上直接拖进相应的输入框里。在邮箱中拖入附件,若主题为空还可自动填写主题。而range和number属性,可以直接替换掉输入框,对数值输入很有用,在chrome里显示如图:
  6、额外输入渐进展开
  当遇到需要增加高级或额外的选项时,可以采用即时添加删除的方式。不需要填写时,可以完全忽略,需要填写时点击一下就会显示。
  7、利用输入反馈。
  除了校验填写是否正确,输入反馈也可以帮助简化用户填写,其中有不少窍门。
  比如在手机充值表单里,需要重复输入一遍号码才能确认提交。再重复输入一次,好像认定你肯定会出错。增加了号码归属地的反馈(配合历史记录)可以避免这种让人有点烦躁的方式。
  下面这个例子将校验获得的推荐邮政编码填写到输入框中,让电脑变得更聪明一些。推荐的内容减少了思考和填写过程。
  在反馈的显示方式上,也值得挑剔一下。比如数值输入框里被输入了字母,格式错误。如果对最简单的提供错误提示不满意,可以试试让输入的字母先显示1秒,然后即被删除,这样比单纯的限制输入类型要更容易理解。另外,还可以自动修改显示格式:号码输入完成后,自动增加空格,可以方便阅读。在需要强调时这样使用还可以提示用户进行检查,但是在普通的输入框中就不需要那么复杂了。
  给金额自动补全小数,比如下面的例子服务费是有小数的,自动补全金额的小数,可以消减顾虑,而且挺有趣。
评论 转载

造句:简化输入让网页表单更亲切
造句:简化输入让网页表单更亲
MartyCagan谈产品探索的意义和流程导航是网页设计中不可缺少的部分,它是网站访问者获取所需内容的快速通道和途径。导航让网站的层次结构以一种有条理的方式清晰展示,并引导用户毫不费力地找到并管理信息,达到有效传递。同……Clear。手势的未来?这是一篇迟到的短文,缘起上上周Clear惊艳上市。完全的手势操作,没有采用iPhone标准的导航设计规范,反而有一些WP7MetroUI的风格。不敢说这款应用在todo上会有多……比苹果更懂搜索还得比Google更懂UI:Metro、HubWindowsPhone操作平台作为微软进军移动领域的先锋军,给用户留下了“流畅”“快捷”“稳定”等印象,而用户也是形象的将WindowsPhone操作平台MetroUI的核心……我们需要什么样的导航网站?一、什么是导航网站?导航网站又称网址导航,网址导航就是一个集合较多网址,并按照一定条件进行分类的一种网址站。网址导航方便网友们快速找到自己需要的网站,而不用去记住各类网站……如何在Google成为一名优秀的产品经理?有用户在Quora提问:优秀的Google产品经理需要具备哪些素质?前Google工程师EdwardHo回复了这个问题。伯乐在线编译Edward的回答,全文如下:在Goo……如何让有用的产品更好用我们常听的一句话说:“永远不要把别人当傻瓜”。“不管你信不信,反正我是信了”,尤其是当涉及到别人的切身利益时,一毛钱也会要掰开来分成两半。但是有些时候我们却愿意做“傻瓜”,当然……一个页面重构工程师眼中的“用户体验”在工业化设计融入人们生活的现今,用户体验一词就常常出现在人们的视线里,随着互联网web2。0时代的到来,大大小小的网站设计中也都开始关注用户体验的方面,对什么是用户体验(百度这……简化输入让网页表单更亲切大部分人不喜欢填表单,因为人们来到网站,主要目的不是填表,而是浏览或者购买。精心设计的表单,使输入变得流畅让人心情愉悦,而糟糕的设计让人扶墙吐血。那怎样才是优秀的表单呢?页面的……浅谈移动互联网广告设计目前移动互联网发展趋势迅猛,随之而来的移动互联网广告也以迅雷不及掩耳之势飞速发展,据市场研究公司Gartner称,2011年全球移动广告收入预计将达到33亿美元,比2010年的……浅谈草图设计“转眼间已经在CDC生活了快两年的时间。从一名电子商务毕业生到一位职业的交互设计师,经历了许多的坎坷。常常会面对各种困难和压力,当发现有太多未知的领域,只有在学习、思考、实践中……工具型网站首页的设计思考什么是工具型网站我们先从wikipedia上了解三组概念:工具:是指能够方便人们完成工作的器具。application:用来帮助用户完成某个单独的或是一组相关……为iOS5设计消息通知通知中心作为iOS5的重大更新内容之一,可以将用户的iOS设备里的所有的通知集中放在一个地方,大大方便用户查看和管理。如果用户收到一封新邮件、一条短信,或者是一个添加好友的请求……
见客户时,产品经理与销售如何分工?浅谈软件项目规模估计怎么估?我是如何用产品思维做一款窗桌的(1。0)浅析如何面对不友好需求平台型产品经理如何突破进阶中级瓶颈?仰望星空,脚踏实地4个方面,聊聊如何做一次更高效的可用性测试新浪微博PM:为什么微博不像微信一样设计得简洁?需求分析:它从哪里来,到哪里去?如何运用科学的方法进行产品管理?爱因互动创始人王守崑:AI时代产品经理的机遇和挑战从产品的角度思考,一款“工具技能内容”产品知识付费的可能前1与前10的产品经理差距在哪?
游济宁太白湖初中作文500字宋徽宗和明英宗都被外敌俘虏,却一生一死,背景强弱很重要治疗痤疮心得郑爽从和网友互怼到道歉,是该学学景甜的不回应和黄晓明的自嘲了田伯光个人简介田伯光是哪一部小说中的人物我的奥运情结初中生作文我的梦幻之旅童话作文聪明的小熊职场人际交往中要避开的九大禁忌NND,笑面人生坐井观天续写藏元汇平台2020年度亮点(三)
©2025网站地图最近更新文明上网我要投诉