Web页面设计规范
编号:版本号:受控状态:作者:分发号:
f文档修改历史记录
文档修改记录
日期
版本号
更改人
更改内容
文档审核记录
日期
版本号
审核人
审核意见
f目录
1
引言6
11目的6
12范围6
13缩略术语6
14参考资料6
2
WEB页面框架内容6
21页面框架6
22页面布局6
221布局原则6
222布局要求7
2221页面分割7
2222页面结构8
2223页面展现9
2224页面美化10
23页面字体11
24边距11
25表格12
26段落排版1327Frame1328其他页面元素14
3
页面风格
15
31风格分类15
32页面风格应用15
第3页共37页
f4
WEB页面交互
15
41页面元素焦点切换16
411信息填写16
412鼠标交互响应16
42页面信息交互18
421操作结果确认18
422其他规则18
43页面信息提示19
44键盘响应支持21
5
WEB页面通用规范22
51一般页面功能22
511新增22
512修改22
513删除22
514查询23
515取消23
516保存23
517重置23
518返回23
519分页23
5110全选24
52一般页面规则24
521默认值24
522必填值24
第4页共37页
f523界面传递25
524窗口嵌套25
525输入框操作25
526在线帮助功能25
527菜单功能要求26
528快捷键功能27
529快捷键的限制27
5210页面的规范性28
5211系统易用性29
5212输入安全性要求
30
5213独特性要求31
5214多窗口的应用与系统资源31
6
页面编程技术使用规范
32
61页面元素命名32
62DHTMLx控件35
63Flex控件35
7
页面资源规格说明35
71图标35
72图片36
73多媒体36
8
附录37
81基于DHX的CSS规格示例37
811表格CSS示例37
82典型应用的页面示例37
第5页共37页
f引言目的本文用于规范我公司所开发的商业软件中对于web页面的设计工作,明确在设计中所要遵循的准则和方法,web页面中各个元素的规格要求,确保所实现的web页面在风格、结构和功能上的统一,提升商业软件的外在品质。范围本规范适用于公司所有的商业软件产品。缩略术语DHMLX:web页面的UI控件参考资料
WEB页面框架内容页面框架WEB的页面框架是指构成完整页面的组织结构。通常是由以下三部分构成:Head,Mai
,Foot,有些时候出于布局的需要,在“Head”下面还会加上用于页面功能导航的“Me
u”。如图:
图1
页面布局布局原则
第6页共37页
f对于WEB应用来说,页面布局是和web应用的功能区相对应的,并且对于页面中各个部分之间的切分比例也需要遵守一定的规则。页面布局的设计,首先需要考虑用户在浏览web页面时视觉流向r