12个PC网页的UI设计趋势（上）

3.中对齐

1栏布局的一个问题是文字换行吧。文字充满整个宽度时候会显的很长，很难保持布局的美观。如果1行的文字数量超过40个字，人们就会觉得难以阅读。不能因为是1栏就什么也都不考虑，宽度被文字占满，是不可避免的。

解决这个问题的一个思路就是中间对齐。说到宽度很宽1栏的布局，中对齐和左对齐如何很好的组合，变成设计的要点。

中对齐的正确使用有一些值得注意的点。首先，必须避免用户的视线忽视中间。例如，如果长文本中对齐，文章的开始点就会因此改变，变得难以阅读。如果使用中对齐，短文章不必要换行，长文章必须左对齐。

还有，接近元素宽度充满的时候，虽然用中对齐，也不能很好的解决。但是,宽度被占满的情况是不存在的，看到中对齐不完整的位置就像悬浮一样。为此，必须要在运用盒子和边缘等下功夫，中对齐才不会出现违和感。

4.固定的顶部和顶部的超薄化

固定的顶部也很普遍。在很多的时候，这里搭载的是导航条。无论能进入页面内哪个位置，都能立即回到主要部分。固定顶部的UI没有侧边导航，当页面较长时，能确保使用的敏捷度。

但是，固定的顶部没必要的时候，会有占据一些空间的缺点。因此，顶部只能加工的变薄。像曾经PC网站的外观那样，采用多段式并且较厚的顶部是很困难的。

这就意味着必须在页面内限定元素。如果元素容纳的多，页面就会变厚，很难被固定化。菜单的数量应该被限定，相对于以前，这方面的意识必须要加强。

5.固定的左边导航

近年可以看到一些布局将导航条设置在左侧。说起来也与曾经2栏布局为主流时代的左导航在构造和功能上有所不同。

画面左边被固定，最近有很多追随滑动的按钮。另外，内容部分基本使用1栏布局，跟随画面宽度的进行伸缩的液态布局被使用的数量也很多。

这样的设计会带来应用程序的操作感。另外，有容易应对多设备的特点。移动端优先的设计，响应式网站和液态布局即是使用PC也能对应多种情况，有采用这样的构造的倾向。

但是，必须注意的是这样新式布局，对于一般的用户有很难留下第一印象的危险性。另外，对于菜单的多层级化的时候，连接和鼠标经过引出下一级菜单的操作是必要的，因此提高了操作的难易度。

从使用能力，全部的构造等固定左导航的缺点来看，有必要搞清导入的妥当性。

6.液态布局

在设备多样化中，画面的分辨率呈现前所未有的变化。以前，宽度符合960~980px就可以解决问题的这个规律变得难以通用。对于分辨率多用化的一个回答就是，符合画面宽度的布局也就是液态布局。

液态布局是，元素和图片不是用像素而是使用%。因此，无论看到什么样的尺寸，分辨率的画面，都会被布局成有一定的平衡。可以解决符合小画面的时候的缺点和符合大画面的时候的缺点。

必须留意的是，对各个页面"最合适化"的布局是不存在的。设想一下各种各样的分辨率的画面，汇集了最少破绽并被认为是有共同的妥协点的布局手法。有些特定的尺寸会感到平衡被打破，有些程度是必须被允许的，意味着会布局成像网页的网页。

未完待续...

FEVTE编注：更多平面设计理论学习请访问飞特网平面设计理论知识栏目，地址：https://www.fevte.com/plan/shejililun/