技术头条 - 一个快速在微博传播文章的方式     搜索本站
您现在的位置首页 --> 用户研究 --> 页面上元素对齐的问题

页面上元素对齐的问题

浏览:1149次  出处信息

    页面上各个元素的对齐,能使页面显得更加规整。以下图为例,能对齐的元素都对齐了,看起来很规整。

    1

    但这也导致了一个问题:阅读线路不清晰――究竟是“Z”型线,还是“N”型线?

像这种过度追求对齐而影响了信息架构的情况,在我们工作中不算少见,我个人不太赞同这种做法。
我比较倾向于适当打破一点对齐关系,但可以使阅读线路更清晰的做法,如下图。

    2

看看Yahoo的首页:
yahoo1
当然,也可以通过设计的处理,比如调整颜色,或者增加中间的间距,来解决这个问题,比如下图。

    3

    4

    但这些处理方式都不如打破对齐来得直接、简洁。

    毕竟,视觉设计是为信息架构服务的,而不能反过来。

建议继续学习:

  1. 小tips: 使用等空格实现最小成本中文对齐    (阅读:3273)
  2. 用TAB缩进, 用SPACE对齐    (阅读:3121)
  3. 为什么我要垂直对齐代码(你也要如此!)    (阅读:1271)
  4. 小tip:中文或英文左右padding一致两端对齐实现    (阅读:845)
QQ技术交流群:445447336,欢迎加入!
扫一扫订阅我的微信号:IT技术博客大学习
© 2009 - 2024 by blogread.cn 微博:@IT技术博客大学习

京ICP备15002552号-1