常见 web 布局都包含什么？

从头开始制作页面的时候，页面空白一片以至于会让人觉得没有方向感。而同时如果你没有太多经验，这也许会让你感到不知所措。这也是为什么我们要讨论 web 设计的原因：我们有 25 年以上的经验并且会告诉你很多关于设计站点的常用规范。

几乎所有的主流站点——包含如今的新焦点：移动端 web——都由以下几点构成：

可以在每个页面的顶部看到。包含所有页面的相关信息（包括站点名字或 logo）以及一个便于使用的导航系统。

最大的区域，展示了当前页面的内容。

包括：1、主要内容的补充部分；2、信息分享列表；3、单选导航栏。实际上，任何可以在当前页面展示又没有写入主要内容的部分都是可以划分在这的。

可以在每个页面的底部看到。和头部一样，包含一些对于整个页面而言不是很重要的信息，例如法律声明和联系信息。

这些要素在所有组成元素中是相当普遍的，但是他们可以以多种形式被展示。下面是一些例子（1 表示“头部”、2 “页脚”；A “主要内容”；B1、B2 “边缘内容”）：

“单列”布局。这种布局在手机浏览时显得极为重要，因为这样肯定不会导致混乱。

“双列”布局。一般针对于平板，因为屏幕尺寸适中。

“三列”布局。只适合大屏幕的桌面程序（即使很多时候用户更倾向于用小窗口浏览）。

当你把上述布局灵活运用到一块的时候会非常赏心悦目：

……

看完上述的例子，想必你在自己布局时会更加得心应手。你可能注意到了，“头部”和“页脚”永远是固定在顶部和底部；“主要内容”占有最大的空间以突出作用。

面对复杂的设计和非常规情况，你可以利用很多设计规范。在别的文章中，我们会介绍根据屏幕尺寸、或者根据不同页面来动态变化的布局方式。但是现在，还是都保持统一为好。