帐号: 密码:
// 设为首页 // 收藏本站 // 请您留言 // 网址导航
远方教程-满足你的求知欲!
站内搜索:
HTML ASP PHP CSS DIV Dreamweaver Photoshop Word Excel PPT SEO技巧
您当前位置:网站首页 >> HTML入门 >> Dreamweaver进阶教程 >> 阅读文章

设计表单的标签和输入区

来源:远方教程 作者:远方教程 发布时间:2014-11-08 查看次数:5048 访问[新版]

  标签水平左对齐
  标签左对齐和输入区水平排列,同样降低了对页面高度的要求。标签左对齐有利于用户对问题标签的扫描,但不利于填写答案,因为标签距离输入区较远,要重新定位到右侧输入框,确实要消耗一点时间。

标签水平左对齐

眼动轨迹表明,用户花在定位输入区上的时间比看清标签更长,从而影响了整个表单的完成时间。

左对齐的眼动轨迹

  标签在输入区内部
  这种方式虽然具备垂直组合的优点,但仍应谨慎使用。当焦点移入输入区后,标签消失,看不到问题,可能会忘记要回答什么,很郁闷,不得不清掉输入好的字,把“问题”还原出来。这种组合比较适合只有一两个输入框的简短表单,而且人们对他很熟悉,不用费力去记住标签提出的问题,比如:搜索框。

输入框内标签

当你真的选择用这种表单的时候,注意,让标签和真实内容区分开来,一些约定俗成的做法是减淡标签字色,在后面打上“…”;下拉菜单则在默认选项两侧打上“-”,以示区别:

下拉菜单

设计要有一条主线,贯穿于整个产品,别让人用着感觉像是几个设计师干的事。认真思考一遍,就会有新一层的理解,这对我的工作有极大的帮助。

第1页 第2页 第3页
打印 打印 | 关闭 关闭 评论
相关文章
图片新闻
站内搜索  
搜索
猜您喜欢  
最新更新  
阅读排行  
关于我们 | 联系方式 | 大事记 | 免责声明 | | 给我留言
部分广告源自金山联盟2345联盟 QQ咨询 站长之家QQ群:232617873
Copyright 2024 远方教程 © All Rights Reserved.

回顶部