以下是根据您提供的要求生成的文章:

下面由桔子科技给大家分享一下网站设计的整体规划与布局框架:

一、页面框架

网站的页面框架是指构成完整页面的组织结构,通常包含以下几个部分:Head(头部)、Main(主体)、Foot(脚部)。有些时候,为了满足特定的布局需求,还会在Header区域下方添加用于页面功能导航的Menu(菜单)。

二、布局原则

对于Web应用来说,页面布局与web应用的功能区域相对应,并对页面中各个部分之间的切分比例有以下规则:

1. 用户浏览网页时的视觉流向:首先看到的是Head区域的左边,通常那里放置网站的标识Logo;接着是陈列网站主要功能的Menu,用于页面导航;然后是位于页面左侧的Sidebar(侧边栏),这里同样也是用于页面功能导航的,与Menu相呼应;接下来是处于页面中心位置的内容部分;最后用户的视线落在Foot区域。

2. 页面分割:采用黄金分割比例进行页面设计。将页面按照一定的比例分割,如将高度方向上分为上部、中部和下部三个区域,宽度方向上对左侧区域进行分割,以此确定Sidebar的位置等。

三、页面结构

页面的布局中,各个区域大小的定义方式是不同的。以下是针对不同功能区域的详细说明:

1. Head区域:采用比例方式设置宽度,一般占1%,高度采用固定像素值来设定,一般占据?px,若有Menu区,则调整为?px;
2. Menu区域:配置要求与Head区域一致,同样按照1%的比例设置宽度,高度结合Head的高度来确定;
3. Sidebar区域:宽度结合Content区域的黄金分割比例进行确定,采用固定像素的方式,一般占据?px;高度采用比例方式设定;
4. Content区域:布局时,高度和宽度方向皆按比例设定;
5. Foot区域:宽度与Head区域一致,采用固定像素值来设置高度。

四、页面展现

为了满足不同的需求和条件,以下是一些基本的页面展示要求:

1. 自适应不同分辨率,如14*768、8*6等;
2. 界面层次不超过?层;
3. 默认窗口设置下不应出现水平、垂直滚动条;
4. 当界面内容超出显示区域时,采用浮动层的形式展示;
5. 页面布局中应充分利用用户直视的屏幕对角线相交位置以及页面正上方四分之一处,合理设计网站的Logo、主要功能导航等元素。

五、页面美化

1. 长宽接近黄金分割比例,布局合理,充分利用空间;
2. 同一页面上按钮大小一致,不同页面的按钮尽量相近,避免使用过长名称;
3. 按钮大小与界面大小协调,避免空旷的界面上放置过大按钮;
4. 界面字体大小适中,背景色搭配合理,反差不宜太大;
5. 界面风格保持一致,字的大小、颜色、字体要相同。
6. 如果支持窗体放大或最大化功能,控件也应随之缩放。

六、页面字体

在相应CSS文件中定义页面字体属性,要求采用UTF-8编码。设置具体的字体属性时,中文采用“宋体”,英文采用“rial”或“verdana”。在不同区域的字体大小设置也有所不同。

通过以上六个方面的介绍,相信大家对网站的整体规划与布局有了一定的了解。