当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > 网页表单标签水平右对齐更适合中文网站

CSS样式表
50个强大璀璨的CSS3/JS技术运用实例
table建站,XHTML建站和DIV建站的不同
根据W3C的CSS3草案翻译的CSS3参考手册
RoundedCornr:生成圆角图片的好用的简单工具
CSS教程:彻底了解haslayout
CSS3的简单又实用的3个属性
CSS教程:-moz-inline-box和-moz-inline-stack
css3阴影属性box-shadow注意事项
css3文本阴影属性text-shadow说明
CSS3的border-radius(圆角)
border边框属性在浏览器中的渲染方式
CSS属性:text-shadow,box-shadow,border-radius
再论清除浮动的空DIV方法
YUI网页布局:自适应宽度的输入框
学习web标准:Web标准中的特殊字符
优化浏览器渲染:将样式表放在页面顶部
优化浏览器渲染:指定图片尺寸
优化浏览器渲染:避免CSS expressions
CSS3 Please:在线生成跨浏览器的CSS3代码
CSS实例教程:制作漂亮的网页表单

CSS样式表 中的 网页表单标签水平右对齐更适合中文网站


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-28   浏览: 47 ::
收藏到网摘: n/a

找了国内30个比较著名的网站的注册表单做样本,对标签和输入区对齐方式做了统计,得到了一个结论:标签水平右对齐更适合中文网站,或者说右对齐更适合中文的表现。设计师们闲下来后最大的喜好莫过于看看国外网站的流行趋势,感叹一下这个精致,那个大气,然后就开始往自己的设计里融入新元素。

不过想必大家都遇到过同样的情况,“用英文咋看咋漂亮,一换中文那种味道就表现不出来了…”。其一,因为中文是方块字,一行看上去很平;而英文有大小写之分,且词与词之间有间隔,看上去有韵律。其二,可用在网页中的中文字体太少,宋体、雅黑,用别的字体一来看着不习惯;二来不一定谁机器里都有那个字体;三来中文字体太大,动则就几十兆,不便于加载。

综上,中文网站中的文字运用要更考究。在注册表单中,水平右对齐已成为公认的方案,从统计中可以很直观的看到:

对齐方式各占比例

如果你已经读过之前一篇关于《设计表单的标签和输入区》的文章,应该对什么是标签“垂直顶对齐”,“水平右对齐”和“水平做对齐”有一定认识了。LukeW的书中列举的都是国外的例子,在《设计表单的标签和输入区》的回复中也有朋友提到在中文网页中的表现情况,比如“垂直顶对齐”比较少见等,对于我们常见的网页来说,确实很少,在 我的30个样本 中,只有百度的注册表单采用“垂直顶对齐”:

百度

采用“水平左对齐”的也比较少,只有3个:谷歌、土豆和CCTV。其余26个都采用的“水平右对齐”,而其中盛大通行证的注册表单就很带有“中国特色”,用空格填充,让2个字的标签与4个字等宽:

盛大

要把中文网站设计得美观漂亮,除了借鉴一些科学的方法外,更要考虑中文元素的特点。不然就像用人头马的瓶子装陈醋,看着好,品着怪。

原文:http://blog.b3inside.com/userexperience/right-justified-are-more-adapt-to-chinese-sites/