版式是设计师必备技能之一，怎样安排模块内容都是需要一步步思考再完成的。浏览网页是我们的日常，在打开网页时可以多收藏一些别人的版式，以便做一些参考。 页面版式的好坏给了用户第一印象，好不好使，想不想看内容，要不要收藏为常用页面，设计都起到了决定性作用。
互联网时代的我们，接触最多的应该就是手机和电脑。在用户浏览过程中，页面布局在设计中占了很大一部分。一个好的排版既要令人赏心悦目，同时也要清楚地传达这些关键信息到目标受众。今天小编给大家介绍一些排版的好方法。
首先，页面中的设计元素都有什么？
/// 01 ///
颜 色
颜色是网页开发的一个重要因素，颜色的选择会影响整个网页的设计。文本颜色必须与背景的颜色形成了鲜明对比。浅色文本不要搭配浅色背景或深色也一样。否则，用户将不能读取的文本。
另一个问题是链接的颜色。链接的颜色设置，也要适合的背景色。链接的状态有三个：未被访问、活动链接，鼠标hover上的状态。
/// 02 ///
文 本
文本的属性有这几个：粗体，斜体，下划线和闪烁。在这四种中，粗体是最常用的，它起到强调的作用。有时候，闪烁也是起到强调作用的，但我不建议大家使用，除非闪烁文字少于两个词的情况。因为文本在长时间闪烁状态下不易阅读，而且它通常被用来指示错误或警告。
字体和字体大小在设计中也是很重要的。合理的选择会帮助用户提高文本阅读性。
/// 03 ///
图 像
现在大多数Web上的图形是GIF格式。GIF支持256或更少的颜色，透明色，动画方式和无损压缩。
在Web上常用的另一种图形文件格式JPEG，以减少图形文件的大小。JPEG支持全色（24位）和压缩。
一般情况下，GIF图像被用作图标和动画图像。JPEG图像适合图像较大或者较复杂的情况下使用。
GIF与JPEG功能
功能 | GIF文件 | JPEG文件 |
颜色位 | 8位（256色） | 24位 |
透明色 | 是 | 没有 |
动画 | 是 | 没有 |
压缩 | 没有 | 是 |
那么怎样的展现能给用户带来更好的效果？
/// 01 ///
网格使用
最简单的确保您网页是否平衡的方法是使用网格系统。曾经在纸上的网格近几年也都转变成了数字介质的网格概念，以便应用。
通过网格来确定页面上不同元素的位置，能使你的网页之间连接起来。这可以帮助你提高页面布局质量，从而让用户看到一个清晰的结构，这很重要，因为当你所有页面的元素都相互连通，用户会觉得整体效果更舒适，让他们更易查看页面内容。
/// 02 ///
选择单一焦点
其中最有效的方式之一是用一颗平常心来选择你布局的单一焦点。我们看到的一个很好的例子就是使用大图片作为网页上最大的单一焦点。
强烈的视觉效果可以起到引导作用，也可以在页面中提供结构优势，让周围内容得到用户关注。如果你有多个视觉元素，可以采用格式塔理论的就近原则， 将它们组合在一起来得到优化。
/// 03 ///
使用三分法
使用三分法或者黄金比例。简单地说，三分法规则就是将你的页面垂直和水平换分成为三份，在该网格线相交的点则是天然焦点。通过调整你的关键要素到这四点，会让你的页面更赏心悦目。
黄金比例
黄金比例在网页中的应用——twitter
黄金比例在网页中的应用——habitat
就其本身而言，三分法不会神奇为你平衡布局，但通过延长原理来从这个天然焦点发散，可以帮助你平衡布局。
/// 04 ///
使用空白
新手设计师在做一个页面时，填充页面上每一个空隙，充分利用每一个间隙填内容到满。而有经验的设计师会知道，有时候将元素适当舍弃会更好。
在打印中，利用空白的最常见的方式是通过扩大页边距来实现。而在网页中，提供大量的周围的空间可以帮助布局感平稳和协调，当你有一个清晰的结构，通过网格与内容结合起来，使用负形效果会更好。但如果引入不恰当，空白可能会使页面与元素脱节。
/// 05 ///
重复设计元素
可重复的组合元素来建立连接与协调页面。这个方式通过重组图案或进行设计来使整个布局协调，也可以让用户感到即使领域不同，但相互也有联系，是一个整体。
重复给出了一个网站，强化了鲜明的地方感一致的视觉形象，这使得网站更令人难忘。通过一致的方法来布局和导航可以使用户能很快适应的设计，并在该网站的网页能够自信地预测信息和导航控件的位置。
/// 06 ///
使用等级制
建立结构和层次清晰感是一个关键的方法来调整布局。既然谈到了结构，你要知道在页面中传达不同内容的重要层级是非常重要的。例如，一个标题，应该比段落的内容更直观更重要。
通过看不同的元素表现方式就知道你的网页中的重要层级关系，从而有了结构等级制。
/// 07 ///
元素大小与比例
合理调整元素大小可以实现布局的视觉平衡。通过使一些元素大于其他，来形成层次感。这有助于帮你创造一个舒适的布局，因为用户会先看布局中较大的元素，然后继续阅读较小的元素。
这一原则也适用于增加对比度，通过页面上的元素对比，让用户第一眼聚焦在重点上。在结构上和布局上都有了些优化。
大小对比做得好的话，可以使得元素从整体布局中脱颖而出。
版式是设计师必备技能之一，怎样安排模块内容都是需要一步步思考再完成的。浏览网页是我们的日常，在打开网页时可以多收藏一些别人的版式，以便做一些参考。