首页  韩国资源  酷站加油  我的展厅  设计名站  古典元素  推荐下载  设计欣赏  每周专访  招募精英  人才专区  网页教程  平面设计  编程开发  设计竞赛
当前位置:首页 > 网页教程 > 网页理论 > 正文
Google
输入表单的三种布局
来源:蓝色理想 作者:WindyJ 2007年06月22日 12:25 网友评论:0条 点击:

原文:http://dedream.blogbus.com/logs/5992307.html

关于输入表单的三种常用布局,大家应该都比较熟悉了,

第一种是这样,称为右对齐/左对齐,左边的标签右对齐,右边的输入框左对齐(来自yahoo):

按此在新窗口浏览图片

第二种是左对齐/左对齐,左边的标签左对齐,右边的输入框左对齐(来自Google):

按此在新窗口浏览图片

另一种方式是标签在上,输入框在下(来自豆瓣):

按此在新窗口浏览图片

(以上源页面版权归各网站所有,红色或绿色的指示线为作者添加。)

这三种方式各有什么不同呢?

从视觉流来看,右对齐/左对齐强调的是标签和输入框这一对元素之间的关系(从左到右,它们在距离上最接近),缺点是,如果左边的标签长短差别很大,就会造成参差不齐很难看的页面;左对齐/左对齐的布局削弱了这种标签-输入框的对应关系,但是很方便从上到下浏览所有的输入标签,当然,如果左边的标签长短差别大,也会造成距离过远,难看的页面;上下布局则兼顾了标签和输入框之间的关系,以及从上到下的很好的逻辑顺序,它的缺点是,不适合输入框太多的情况。

左右两种布局在中文界面上也许可以取得一致,即,让所有的标签长度一致,在左对齐的同时也右对齐,中文真是一门奇妙的语言,在英文页面上,就很难做到这一点了。

 问题:

  1. 什么时候应该采用右左布局,什么时候应该采用左右布局?
  2. 为什么我说上下布局不适合输入框太多的情况?

西贝的回答:

  1. 右左布局:当输入框为多个并且类别相同,字段长短较一致时,建议采用右左布局;
  2. 左右布局:当输入框多,但类别不一致时采用;
  3. 上下布局:当输入框较少,但是引发的提示或帮助较多时,建议采用;不适合输入框多的情况,因为页  面占用较大,跨度较大;连贯性不强,但是易于区分;
上一篇:非设计师谈设计之Apple改版   下一篇:Jakob Nielsen:十大严重的网站设计错误
收藏此页】【打印】【关闭
 相关文章  我要点评
·一种通用的JSP表单数据存储方法
·ASP预防重复多次提交表单的方法
·关于对表单操作的程序
·ASP 几行代码解决防止表单重复提交
·实用递交表单的客户端函数
·避免表单的重复提交的方法
·天天体验:注册表单
·Web 表单设计原则和实践

免责声明:本站刊载此文不代表同意其说法或描述,仅为提供更多信息,也不构成任何建议。对本文有任何异议,请联络:68design#163.com
转载要求:作者及来源信息必需保留。转载之图片、文件,链接请不要盗链到本站,且不准打上各自站点的水印。



关于我们 | 在线反馈 | 广告报价 | 友情链接 | 联系我们 | 免责声明 | 在线投稿 | 网站地图
Copyright © 2003-2007 68design.net, All Rights Reserve 【找网页设计师,当然上网页设计师联盟】