下面由桔子科技为大家分享高效企业网站页面布局设计与优化策略：

一、页面框架

企业网站的页面框架是指构成完整页面的组织结构。通常包括Head、Main和Foot三部分，有时为了满足布局需求，在“Head”之下还会加入用于页面功能导航的“Men”。

二、布局原则

对于企业网站来说，页面布局需要与网站的功能区域相对应，并对各个部分之间的分割比例遵循一定规则。首先，要考虑用户浏览网页时的视觉流向：从上到下，用户首先看到的是“Head”部分的左面，通常那里是标识这个WEB应用的Logo；然后是陈列主要功能的“Men”，用于页面导航；接着是位于页面左侧的“sidebar”，通常也用于功能导航，与“Men”的位置相呼应，这里的内容可以通过类似树状结构的方式展示更为详细的职能；然后是处于页面中心位置的内容部分；最后用户的视线落在WEB页面的底部。

三、页面分割

以常见布局方式为例，结合黄金分割比例的方法：首先将页面按照1:2:1的方式进行分割。在高度方向上，对上部1/3区域按黄金分割方法分出Head和Men区域；在宽度方向上，对中部左边1/3区域按黄金分割方法分出Sidebar区域，剩余空间留予Content区域；在高度方向上，对下部1/3区域按黄金分割方法分出Foot区域。

四、页面结构

页面的布局中，各个区域大小的定义方式不同。对于各个功能区域的分割是按照“像素”和“比例”来进行的。以1280x768分辨率作为基准，其中：Head区域宽度按比例设置，高度采用固定像素值确定；Men区域同Head配置要求；Sidebar区域宽度结合Content区域的黄金切分比例确定，高度按比例设置；Content区域高度和宽度方向布局均按比例设置；Foot区域高度采用固定像素值确定。

五、页面展现

除了上述要求外，还需考虑以下方面：能自适应1280x768、800x600两种分辨率；界面层次不超过4层；默认窗口设置下不应出现水平、垂直滚动条；当界面内容超出显示区域时，以浮动层的形式展示；用户直视位置是屏幕对角线相交，页面正上方四分之一为易吸引用户注意力的位置。

六、页面美化

界面应大小适中，符合美学观点，感觉协调舒适，在有效范围内吸引用户注意力。长宽接近黄金分割点比例，布局合理，充分利用空间；按钮大小一致，与界面相协调；字体大小与界面大小相匹配，前景与背景色搭配合理；界面风格保持一致。

七、页面字体

页面文字编码要求是UTF-8，在设置字体属性时，中文采用“宋体”，英文采用“Arial”或“Verdana”。对于不同内容级别设置不同的字体大小，通常：“Head”中标题文字px；“Men”中的导航文字14px；“Sidebar”中的文字1px；“Content”中的正文、标题1px或14px；“Foot”中的文字1px或1px。