网页布局的基本类型

　网页布局的基本类型

　　网页的布局不可能像平面设计那么简单，除了上文提到过的可操做性外，技术问题也是制约网页布局的一个重要因素。虽然网页制做已经摆脱了HTML时代，可是尚未彻底作到挥洒自如，这就决定了网页的布局是有必定规则的，这种规则使得网页布局只能在左右对称结构布局、“同”字型结构布局、“回”字型结构布局、“匡”字型结构布局、“厂”字型布局、自由式结构布局、“另类”结构布局等几种布局的基本结构中选择。

1　左右对称结构布局

     左右对称结构是网页布局中最为简单的一种。“左右对称”所指的只是在视觉上的相对对称，而非几何意义上的对称，这种结构将网页分割为左右两部分。通常使用这种结构的网站均把导航区设置在左半部，而右半部用做主体内容的区域。左右对称性结构便于浏览者直观地读取主体内容，可是却不利于发布大量的信息，因此这种结构对于内容较多的大型网站来讲并不合适，如图1所示

图1 左右对称结构布局的网站

2　“同”字型结构布局

　　“同”字结构名副其实，采用这种结构的网页，每每将导航区置于页面顶端，一些如广告条、友情连接、搜索引擎、注册按钮、登录面板、栏目条等内容置于页面两侧，中间为主体内容，这种结构比左右对称结构要复杂一点，不但有条理，并且直观，有视觉上的平衡感，可是这种结构也比较僵化。在使用这种结构时，高超的用色技巧会规避“同”字结构的缺陷，如图2所示

图2 “同”字型结构布局的网站

3　“回”字型结构布局

　　“回”字型结构其实是对“同”字型结构的一种变形，即在“同”字型结构的下面增长了一个横向通栏，这种变形将“同”字型结构不是很重视的页脚利用起来，这样增大了主体内容，合理地使用了页面有限的面积，可是这样每每使页面充斥着各类内容，拥挤不堪，如图3所示

图3 “回”字型结构布局的网站

4　“匡”字型结构布局

　　和“回”字型结构同样，“匡”字型结构其实也是“同”字型结构的一种变形，也能够认为是将“回”字型结构的右侧栏目条去掉得出的新结构，这种结构是“同”字型结构和“回”字型结构的一种折中，这种结构承载的信息量与“同”字型相同，并且改善了“回”字型的封闭型结构，如图4所示

图4“匡”字型结构布局的网站

5. “厂”字型布局
“厂”字型结构布局，就是指页面顶部为横条网站标志+广告条，下方左面为主菜单，右面显示正文信息，总体效果相似“厂”字，因此称之为“厂”字型布局。这是网页设计中用的最普遍的一种布局方式，通常应用于企业网站中的二级页面。这种布局的优势是页面结构清晰、主次分明，是初学者最容易上手的布局方法。缺点是规矩呆板，若是细节色彩上不注意，很容易让人看之无味。

6　自由式结构布局

　　以上4种结构是传统意义上的结构布局。自由式结构布局相对而言就没有那么“安分守己”了，这种结构的随意性特别大，颠覆了从前以图文为主的表现形式，将图像、Flash动画或者视频做为主体内容，其余的文字说明及栏目条均被分布到不显眼的位子，起装饰做用，这种结构在时尚类网站中使用的很是多，尤为是在时装、化妆用品的网站中。这种结构富于美感，能够吸引大量的浏览者欣赏，可是却由于文字过少，而难以让浏览者长时间驻足，另外起指引做用的导航条不明显，而不便于操做，如图5所示

图6 自由式结构布局的网站

7　“另类”结构布局

　　若是说自由式结构是现代主义的结构布局，那么“另类”结构布局就能够被称为后现代的表明了。在“另类”结构布局中，传统意义上的全部网页元素所有被颠覆，被打散后融入到一个模拟的场景中。在这个场景中，网页元素化身为某一种实物，采用这种结构布局的网站多用于设计类网站，以显示站长的前卫的设计理念，这种结构要求设计者要有很是丰富的想象力和很是强的图像处理技巧，由于这种结构稍有不慎就会由于页面内容太多而拖慢速度，如图6所示

图7“另类”结构布局的网站

此文章摘自 《精通Web标准建站:标记语言、网站分析、设计理念、SEO与BI(附光盘) 》