设计表单的标签和输入区
作者:波希米亚 来源:b3inside.com 发布时间:2009-04-27 16:16:00
标签:设计,表单,标签,注册
重读LukeW的《Web Form Design:Filling in the Blanks》感触很深,除佩服LukeW的钻研精神外,更多的是学习他对设计细节的执着和理解。我把对本书的理解,与工作生活中遇到的实际问题结合起来,作为今后设计工作的指导和规范。
有一些元素,看着很简单,设计起来却很头疼。往往这样的元素都具有一个共同的特点——变化多,表单的设计就是如此。你说见过20、30种以上不同的表单,我并不惊讶,产品需求、风格不同,必然五花八门。当然,换了设计师,表单的样式也可能会不同。然而,不能让这种情况继续下去,表单不是艺术展。不要让你的才华阻碍了别人的前进。
表单就是一扇门
古有大禹,三过家门而不入;今有用户,看到表单犯糊涂。难道大禹遇到的是这样的门?
表单,尤其是注册表单,就像一扇门,穿过他才能看到完整的产品。所以千万别做这种门,自己费事不说,用户也不会买账。这个设计最糟糕之处,就在于它有悖常理。好的设计应当遵循于其自然规律,这样一来符合人们预期,使用起来也就顺畅。
表单中标签与输入区的4种对齐方式
标签垂直顶对齐
标签水平右对齐
标签水平左对齐
标签在输入区内部
《Web Form Design》一书中对标签和输入区组合进行了一些研究,我整理了一份数据比较的表格:
标签垂直顶对齐
标签和输入区垂直依次排列,从而降低了对页面宽度的要求。如果你的页面没有富裕的空间用于标签和输入区的横向排列,这种组合是个不错的选择。
眼动轨迹表明,用户自上而下的扫描表单,焦点多集中在左侧一列,且跳动较小。
0
投稿
猜你喜欢
- 下面直接记录下配置主从库的操作:(本文用的是mysql5.0以上)1.在主库建立要同步的数据库,建立主库的帐号和修改主库配置首先连接上数据库
- 大家好,我叫斑马纹列表中使用两种相同的样式但颜色不同的背景,来间隔显示的内容。当然这个释义我是借鉴《designing interfaces
- 网站域名一般都会选简短易记的,因为这对于网站宣传来说也可以省不少力。而被很多网站忽视的站内Url结构则在一定程度上反映出网站的整体架构。当设
- 微软的SQL Server 2005中用来替代数据传输服务(DTS)的SQL Server综合服务(SSIS),包含了很多工具用于导入数据并
- 制作圆角导航其实跟制作圆角边框是一样的道理,有一种很常见的方法就是使用CSS绝对定位,切四个圆角的小图片,然后分别定位在四个角,这样就可以实
- 在Google Reader上看到网友分享的一个链接,真的发现自己已经out了。上面的这张图,是纯CSS实现的,没有背景图、没有Javasc
- 完成了UI,我们就需要对数据进行处理了。在开始“数据”的本地存储之前,我们先来了解一下client-side database storag
- 是建立一个数据集 前面应该先定义此数据集 dim rs as adodb.recordset 然后就可以用 set rs=server.Cr
- 最近看到好多人说到tns或者数据库不能登录等问题,就索性总结了下面的文档。首先来说Oracle的网络结构,往复杂处说能加上加密、LDAP等等
- 如果是感应触发.就选onmouseover如果是点击触发.就选onclick [把它们两互相替换,就可随时变为感应
- 网上的SQL优化的文章实在是很多,说实在的,我也曾经到处找这样的文章,什么不要使用IN了,什么OR了,什么AND了,很多很多,还有很多人拿出
- 首先澄清一个应用场景问题。研究(1)中指出,对于结构复杂的网站,不少设计师们喜欢采用960固定宽度布局。但要注意的是,960并不是万能钥匙,
- 如果我们的web应用有大量的异步请求,而这些异步请求是在web服务器认证的情况下,那当我们请求发生在服务器认证失效下,服务器自动302到登录
- 由于系统自带的MySQL默认字符集不是gbk,因此给数据库的推广应用以及中文程序的开发带来极大的不便,在没完没了的GBK和UTF8的转换过程
- 在这篇文章中,我将努力揭开Mobile Web开发的神秘面纱,换句话说,也就是为了移动设备上的用户体验可以被接受,代码得怎么设计。我将阐述“
- 将Excel中的数据导入到Access中,前提是在Access中的表已经建好。 dim conn dim co
- 一、从外部文档中粘贴时,如果只要文字而不想要其格式,可以使用“Edit→paste as text”命令,不要直接用Ctrl+V。二、当有浏
- 你是否对获得MySQL数据库与表的最基本命令的实际操作感到十分头疼?如果是这样子的话,以下的文章将会给你相应的解决方案,以下的文
- ISNULL 使用指定的替换值替换 NULL。 &nb
- 一直以来,我们大多使用js来实现弹出菜单,可是根据 w3c 的css标准,根本就没有这个必要。只需要简单得使用css+html就可以做出一个