第32章　企业网站布局

本章开始演示企业主题的网站布局。本实例是一个企业网站主页的布局。在企业网站的组成结构中，网页数量比较少，而且页面风格都是相同的。可以把本实例看成一个模板页，对其他页面的布局，只需在“模板页”上添加或删除部分文字即可，把这些页面放到一个目录下，就可以组成一个企业网页了。

企业网站主要表达的是一个企业的信息，而企业信息都分成几个模块，如公司简介、联系我们、产品展示等，本实例主要以互联网上最常用的公司网站布局做介绍，如想制作更漂亮的网站，美术方面一定要细致，然后通过HTML+CSS在页面中表现出来。

学习完本章，将会学到以下内容：

❑企业主页的规划；

❑用DIV布局出标记；

❑CSS实现页面体；

❑调整网页中的CSS代码以兼容不同浏览器；

❑其他网页的制作。

32.1　企业主页规划

企业主页用来表达企业信息，这是企业网站的主要目标。如何做到在一个网页中可以表达企业更多信息，如何在页面内容和外观上吸引用户，使之浏览更多内容，这都需要对页面的规划下工夫，而本小节来讲解实例网站中的企业规划，从功能模块上分，主要分成以下几个模块：

❑首页；

❑公司简介；

❑管理团队；

❑游戏产品；

❑招纳贤才；

❑法律声明；

❑联系我们。

上面的七个模块都是企业网站常包含的功能模块，当然，还有一些模块并没有列出，但网站的页面或多或少都会存在一个模板页面，以确定该网站的风格页面。本实例就来制作这样的模块页，对于其他页面，在前面介绍过，只需要添加或删除部分文本或图片即可。

确定了页面模块，需要对网页的构思和风格花点儿工夫，即对网页的布局，首先考虑到这是企业性质的网站。按目前流行的网站风格来讲，有上、中、下模式，上指的是页面的头部；中指的是页面的中间部分；下就是网页的下部信息部分。

对页面的构思可以按上、中、下的模式进行，然后分别在上、中、下模式上设置内容。如页面的头部主要放置公司的LOGO，而且LOGO放在左边位置，右边可以设置468*60标准的广告宣传栏，当然这不是为了做广告，而是公司自己的宣传栏，为了表现页面头部美观性，在页面头部右边放几个文字链接，如中文版|英文版之类的链接。

页面的中部也是很重要一个模块，在本实例中的中间部分，模块分成左右两部分，其中左边显示企业网站的各功能模块，如首页、公司简介等，右边是左边功能模块的对应内容，如公司简介放置的内容是企业的信息，在布局方面，左边的宽度明显会小于右边。左边只是表现出按钮的效果，而右边显示其内容，对内容的长度没有限制。

底部就是页面的页脚，放置一些公司信息、不太常用的链接和国家信息产业部的备案号等，这部分内容每张网页都是一样的。在做模板页时可以确定其内容，以便网页修改，页面效果如图32.1所示。

图　32.1　企业网站布局效果

技巧　也可以在页面头部和页脚单独做一张网页，然后在其他网页链接该页面就可以表示页面头部和脚部了。修改一处可以应用到所有的网页，这样更方便，更容易管理，门户上的广告多采用这种方式。