页面组的工作流程：
需求→设计方案→确认→页面制作→程序开发→测试
一．设计需求：（叶面设计前需提交给UI页面组）
1.系统设计需求文档。

2.系统结构文档（例如栏目划分，目录结构，导航方式等）。

3.较复杂页面表现形式草图（手绘或相关软件绘制）。

4.较复杂业务流程文档。

5.如有可能提供参考和示例站点。

6.与程序员沟通部分页面实现方法。

二．页面制作需求：
1.经过确认的美术设计的方案图。

7.系统设计需求文档等，较复杂业务流程文档。

2.所需页面脚本需求，与程序员沟通部分页面实现方法。

三．提交给程序的内容包括：
1.静态模板页：首页以及二级页面htm文件、css样式单、以及相关页面JavaScript
代码，可用于直接嵌入代码。

栏目的命名规则与程序协商，建立统一的规范。

2.所有统一的按钮图标。

3.部分容易混淆颜色的色值。

4.图片统一放在《images》目录下，如果二级栏目内容较多，可在放在二级栏目的
《images》下。

命名规则：栏目英文名称_在页面位置_编号.gif。

例如sys_top_01.gif
界面测试：（页面组提交给测试组包括：）
1.经确认的设计方案图。

2.静态模板页面。

以上二项均为便于查看嵌入程序后的叶面情况。

3.常出现的界面错误：图片错误，页面不美观，布局不合理，与原先设计不符，文字
错误，HTML代码错误，页面程序错误。

4.界面bug测试报告：
附表：
另附录：校园网办公系统界面规范
1、主窗体初始状态为最大化显示，标题为：“跃龙门校园网应用管理系统”；并保证在
1024*768与800*600分辨率下内容显示完全。

2、系统中所有图标统一为：透明水晶按钮图片。

3、Banner广告区
保证在800*600及1024*768为充满状态。

4、菜单导航条区
按钮的尺寸为：高42 pixels,宽148 pixels。

二级内容标题按钮的尺寸大约为：高25 pixels,宽134 pixels。

此处为Gif透明图。

背景为#D5D5D5-#FFFFFF的渐变色。

5、尾标区：
宋体; 12px; color: #000000，文字内容为：TCL教育互联事业部版权所有及产品版本号相关。

6、功能数据区
A．数据区统一使用黑字，字体统一为宋体12 pixels
B．表格高度为25 pixels。

C．链接样式：
整条变色，鼠标划上显示为小手状。

文字链接：鼠标划上变为红色下划线效果#CC0000，点击过后为#666666。

D．表格内字段,保证显示情况下限制字段数，如果超长以省略号显示，鼠标划上有对话框全文显示。

另建议在保证浏览速度的情况下，请程序判断当前分辨率，确定显示字段数量。

如内容文字过长，建议采用竖式表格项。

7、表格内容列表
如无特殊情况，请使用下列标准：
A、标题字体用宋体，12px，加粗，不带下划线，居左对齐。

B、表体部分用宋体，12px，不带下划线，对齐情况见“对齐情况处理”
文本、日期、备注,编号居左。

数值、金额居中。

布尔、自动编号居中。

表格的行高：为25 pixels。

8、分辨率
为了尽量减少屏幕分辨率改变对软件操作带来的不良影响,要求各产品必须解决以下问题:
1）在1024*768状态下效果最佳(800*600状态下也能测试通过)
2）背景图片(如主界面)在其他分辨率下大小成比例缩放
3）在"大字体"状态下所有文字提示不能超出原定范围
9、功能按纽排序
为统一风格，现对按钮排列和状态规范如下：
图标排列规定
[增加修改删除 ][ 查询统计 ][ 打印][......]
10．文件命名规：
文件命名规：与程序技术规范的命名规范统一。

页面内图片命名按如下规则:页面名称_区域_编号(index_top_01.gif)。