/// 01 ///
网格使用
简单的确保您网页是否平衡的方法是使用网格系统。曾经在纸上的网格近几年也都转变成了数字介质的网格概念,以便应用。
通过网格来确定页面上不同元素的位置,能使你的网页之间连接起来。这可以帮助你提高页面布局质量,从而让用户看到一个清晰的结构,这很重要,因为当你所有页面的元素都相互连通,用户会觉得整体效果更舒适,让他们更易查看页面内容。
/// 02 ///
选择单一焦点
其中有效的方式之一是用一颗平常心来选择你布局的单一焦点。我们看到的一个很好的例子就是使用大图片作为网页上大的单一焦点。
强烈的视觉效果可以起到引导作用,也可以在页面中提供结构优势,让周围内容得到用户关注。如果你有多个视觉元素,可以采用格式塔理论的就近原则, 将它们组合在一起来得到优化。
/// 03 ///
使用三分法
使用三分法或者黄金比例。简单地说,三分法规则就是将你的页面垂直和水平换分成为三份,在该网格线相交的点则是天然焦点。通过调整你的关键要素到这四点,会让你的页面更赏心悦目。
黄金比例
黄金比例在网页中的应用——twitter
黄金比例在网页中的应用——habitat
就其本身而言,三分法不会神奇为你平衡布局,但通过延长原理来从这个天然焦点发散,可以帮助你平衡布局。
/// 04 ///
使用空白
新手设计师在做一个页面时,填充页面上每一个空隙,充分利用每一个间隙填内容到满。而有经验的设计师会知道,有时候将元素适当舍弃会更好。
在打印中,利用空白的常见的方式是通过扩大页边距来实现。而在网页中,提供大量的周围的空间可以帮助布局感平稳和协调,当你有一个清晰的结构,通过网格与内容结合起来,使用负形效果会更好。但如果引入不恰当,空白可能会使页面与元素脱节。
/// 05 ///
重复设计元素
可重复的组合元素来建立连接与协调页面。这个方式通过重组图案或进行设计来使整个布局协调,也可以让用户感到即使领域不同,但相互也有联系,是一个整体。
重复给出了一个网站,强化了鲜明的地方感一致的视觉形象,这使得网站更令人难忘。通过一致的方法来布局和导航可以使用户能很快适应的设计,并在该网站的网页能够自信地预测信息和导航控件的位置。
/// 06 ///
使用等级制
建立结构和层次清晰感是一个关键的方法来调整布局。既然谈到了结构,你要知道在页面中传达不同内容的重要层级是非常重要的。例如,一个标题,应该比段落的内容更直观更重要。
通过看不同的元素表现方式就知道你的网页中的重要层级关系,从而有了结构等级制。
/// 07 ///
元素大小与比例
合理调整元素大小可以实现布局的视觉平衡。通过使一些元素大于其他,来形成层次感。这有助于帮你创造一个舒适的布局,因为用户会先看布局中较大的元素,然后继续阅读较小的元素。
这一原则也适用于增加对比度,通过页面上的元素对比,让用户眼聚焦在重点上。在结构上和布局上都有了些优化。
大小对比做得好的话,可以使得元素从整体布局中脱颖而出。
版式是设计师必备技能之一,怎样安排模块内容都是需要一步步思考再完成的。浏览网页是我们的日常,在打开网页时可以多收藏一些别人的版式,以便做一些参考。