网页布局大致可分为“国”字型、拐角型、标题文本型、左右框架型、上下框架型、综合框架型、封面型、Flash型、变化型等几种。

1.“国”字型布局

“国”字型也可以称为“同”字型，是一些大型网站经常使用的类型。这种布局最上面是网站的标题及横幅广告条，中间是网站的主体内容，左右分列两个栏目，最下面是网站的一些基本信息，如联系方式、版权声明等。这种布局是网上最常见的一种布局结构，如图2-2所示。

图2-2　“国”字型布局

2.拐角型布局

拐角型布局与“国”字型布局相比，缺少最右侧的栏目，给主内容提供更多空间。该布局最上面是标题及广告横幅，接下来左侧是一列链接等内容，右面是很宽的主体正文，最下面也有一些网站的辅助信息。在这种布局中，左侧一般是导航链接，如图2-3所示。

图2-3　拐角型布局

3.标题文本型布局

标题文本型布局是指页面内容以文本为主，最上面是标题或类似的一些东西，下面一般是正文，例如，一些文章页面或注册页面等就属于这种类型，如图2-4所示。

图2-4　标题文本型布局

4.左右框架型布局

左右框架型布局是指网页分为左、右两部分，一般左面是导航链接，有时最上面会有一个小的标题或标志，右面是正文。大部分大型论坛和网页教程都使用这种布局，有一些个人网站和企业网站也喜欢采用这种布局。这种布局结构非常清晰，一目了然，如图2-5所示。

图2-5　左右框架型布局

5.上下框架型布局

上下框架型布局与左右框架型布局类似，区别仅仅在于这种布局分为上、下两部分，如图2-6所示。(www.daowen.com)

图2-6　上下框架型布局

6.综合框架型布局

综合框架型布局是左右框架型布局与上下框架型布局的结合，相对较复杂，类似于拐角型布局，只是采用了框架结构，如图2-7所示。

图2-7　综合框架型布局

7.封面型布局

封面型布局一般出现在一些网站的首页，由一些精美的平面设计结合一些小的动画组成，在页面中放上几个简单的链接或者仅仅是一个“进入”的链接，甚至直接在图片上加上链接而没有任何提示。这种布局如果精心设计，能给人带来赏心悦目的感觉，如图2-8所示。

图2-8　封面型布局

8.Flash型布局

Flash型布局与封面型布局类似，只是这种布局采用了目前流行的Flash技术。由于Flash功能强大，页面所表达的信息更丰富，因此其视觉效果和听觉效果更能吸引浏览者的访问，如图2-9所示。

图2-9　Flash型布局

9.变化型布局

变化型布局实际上就是上面几种布局的组合与变化，在视觉上可能接近于拐角型布局，但所实现的功能实质上是上、左、右结构的综合框架型布局。

以上介绍了常见的网页布局，在实际应用中可以根据自己的情况进行具体分析。如果网页要表达的内容很多，可考虑用“国”字型或拐角型布局；如果内容不太多，而且只是一些说明性的东西，可考虑标题文本型布局；框架结构的一个共同特点就是浏览方便，速度快，但结构变化不灵活；如果是一个企业网站想展示自己的企业形象，或者个人主页想展示个人风采，可首选封面型布局；Flash型布局更灵活一些，好的Flash大大丰富了网页，但是它不能表达过多的文字信息。在实际设计中，设计者只有不断地尝试，才会提高布局技术。