您好,欢迎来到教培网!请登录免费注册选课学习指南
广州
教培网
外语/小语种电脑/IT/设计职业技能学历教育
广州学思电脑培训轮播1广州学思电脑培训轮播2广州学思电脑培训轮播3广州学思电脑培训轮播4广州学思电脑培训轮播5
学校环境校区与课堂实景
查看学校相册

广州学思电脑培训

V2
4.54人评价
室内设计43门课程2个校区208人预约
正规学校助学补贴优质服务多校区资质认证
校区
广州大学城校区、白云同和总校
地址
广州大学城内(大学城外环西路北南亭村坊旁)
电话
18347319277
简介
广州学思电脑培训是教育部批准成立的培训机构,是以职业设计师培训及学历教育为主要发展方向,兼顾设计类职业资格培训工作的专业设计师特训基地,是信息产业部指定培训考证 详情
当前位置:教培网>广州学思电脑培训>学校动态>网页表单设计:怎样提高表单可用性?

网页表单设计:怎样提高表单可用性?

作者:教培网来源:教培网地区:广州

一、信息内容的合理组织。考虑用户填写表单的目的,哪些表单需要填写,去掉没必要的表单项,确定完表单内容。如何组织起来呢?表单项并不是一个个从上到下无序罗列,而是根据表单内容,按照一定的逻辑,经过组织,分成不同的内容组,不同的主题。同时各个逻辑组和同一个主题的表单项,也是按照逻辑顺序或者用户熟悉的模式顺序,使用户浏览和填写自如。如果表单过长时,也可拆解成不同网页,类似于任务拆解,让用户一步步填写。品牌1.0系统,新建订单时,将表单内容,进行逻辑划分为两个内容组:基本信息(重要/必填)和附加信息 (次要/选填),通过分割线区分内容组,结构清晰,易于浏览。考虑区分内容组时,应当考虑采用较少的视觉信息,过多的视觉信息可能会导致注意力分散,给表单带来大量视觉噪音。

新建百度Union账户,表单内容较长,同时有若干主题,一个网页信息量太大,所以采用多个网页来组织表单,分步骤给用户,提供清晰的路径步骤,即清晰又简单。用户在填写时,提供进程指示,避免紧张和疑惑。二、简化表单,突出重点。根据用户使用数据,适当将使用频次不高、或者提供给专业用户的高级表单项隐藏起来。比如品牌1.0的新建创意表单,90%的人不进行曝光监控链接的填写,那么默认收起,保持表单的简洁,让绝大多数用户快速完成,避免大量的表单给用户的焦虑,而又满足了小众用户的需求。三、清晰的浏览线。思考如何设计表单结构和路径时,需要有个基本原则:由始至终提供清晰的浏览线。采用眼动仪实验即可检验用户的浏览线。如标签的对齐方式、输入框的布局等都影响着用户的浏览线。

当提供了垂直单一路径,使用户减少注意力分散,可以迅速对问题作出回答,完成任务所花时间少。四、考虑用户场景,**主流程顺畅。我们在设计表单时,定义了清晰的线性步骤,但很少真正实现。考虑用户场景,**主流程不要中断,将导致人们放弃填写的元素解决。例如,招商银行卡号密码的付款流程,分为三项表单步骤:填写银行卡号、填写其他验证信息、支付成功。但在用户填完卡号和其他验证信息后,经常会发现付款额超出每日限额,以前的流程是,用户中断付款流程,不得不新打开一个网页,招行主页 → 网上个人银行登录 → 选择一卡通(输一卡通卡号、查询密码、附加码)登录后→ 网上支付 → 网上支付额度管理调整额度,然后再次重新支付,使用户在两个操作流程中切换,让用户各种折腾。

而改版后的设计,可谓十分贴心,给予信息提示的同时,用户可在当前流程设置限额,避免了付款流程的中断,同时大大节省了用户的操作成本。还有新建广告位时,选择所属频道,如果没有想要的频道,就需要新建频道,增加额外的页面来添加新频道,而在设计时,考虑到用户的此场景,在下拉选择框旁边,增加“新建频道”按钮,为用户提供便捷,减少了新建广告位流程的打断。五、选择合适的标签对齐方式。“输入框标签应该是顶对齐、右对齐、左对齐还是输入框内标签?”是我们在设计表单时常见的问题。

其实业界有很多针对此问题的实验和研究(Matteo Penzo的眼动实验、Luke Wroblewski的Luke Wroblewski’s findings、Vitaly Friedman的web表单设计之注册表单),都表明每种方式有不同的优缺点,根据具体目标等因素具体考虑。Matteo Penzo的眼动实验发现,顶部标签方式,标签移动到输入框需50毫秒,比左对齐标签方式(500毫秒)快了10倍,比右对齐标签方式(240毫秒)快了5倍左右。总之,顶部标签方式,填表时间短。但如果尽量减少垂直面积,可以考虑右对齐方式。如果希望用户填表时认真浏览标签,了解仔细考虑表单的每个输入框时,可以采用左对齐方式。六、提供帮助。为了用户快地填写表单,一般在难以理解的表单项增加帮助信息,引导用户成功填表。

帮助信息,提示用户应该如何填写,常见的帮助,一般在标签或者输入框旁提供帮助文字,交互方式也有一直展现(即一直出现在输入框右侧、下方或输入框内)、即时帮助(即激活输入框时,帮助文字自动出现)、用户激活的即时帮助(即帮助信息默认不显示、用户鼠标悬浮触发帮助图标来显示帮助)、用户激活的区域帮助(将表单所有的帮助信息统一放在一个位置)等多种方式。

分享到:

相关课程

官方授权声明

尊敬的平台会员您好,[广州学思电脑培训]资料由平台整理展示,资质、课程、校区、图片和文案均可在后台维护。如需了解[广州学思电脑培训]服务明细或申请试听服务,请点击。

公开资料整理 | 待机构认领确认