系统界面设计规范.docx

系统界面设计规范
B/S 系统界面设计规范
引言
界面美观、操作易用性、维护成本低是评价B/S系统的关键。本规范参考了一些成熟产品科学的开发方法，将开发过程中的方式、规则等强行的约束。希望藉此来分组，所在区域主题（Title）标注该区域的名称，类似功能页面间布局保持一致。
7． 建立数据表格关系包含数据的表格使用户在视觉上理解相互间关系，如序列、父子表等。
8． 页面留白页面有明显留白区域，且不同群组之间距离保持一致。
9． 分辨率适应页面布局以保证在低分辨率[800*600]下的正确显示为前提，适应高分辨率情况使用表格宽度等参数使用百分比方式自动适应；
. 对程序设计及编码的要求
1 表格作为控件物理上包含的容器和内部包含的控件之间的属性定制互不影响，即实现其无关性，这样才能完整的保证页面的基本结构在局部修改时不发生变化。
2 力求样式表实现页面格式全部控制，废弃如<font>、<backcolor>等内嵌标记，实例化坐标位置的<div>标记、页面中控制布局的标记修饰含
style属性的内嵌样式修饰，便于使用第三方页面维护工具修改页面。
3 页面基本HTML及服务器端控件扩展标记等均保持代码干净整洁，便于检查和控制；
4 含有复杂嵌套结构的,<tr>,<td>标记在行间留白及结构的缩进，便于今后的维护。
5 非数据操作使用客户端脚本实现，减少非必要的服务器[WEB 服务器、数据库服务器]负载；
. 交互设计
a) 控件控制
1 第三方服务器端控件的使用要保证具有广泛兼容性和安全性，且具有完备的接口指定外观属性和交互方式。
2 复杂的应用程序中非标准交互控件给出详细的操作方法的提示。
3 页面中尽量使用统一的导航类型，如使用基于点击“图形”的链接、 “文字”的链接或文字图形混合其中一种方式。
举例：
4 页面按钮作为基本交互控件，提倡使用有鼠标响应状态变化和禁用状态的BUTTON 按钮，
除特殊界面需要，不提倡使用图形按钮，而且保证同一应用程序内只使用一种外观的按钮。
5 拖放的服务器端控件在页面表格Table 里在执行过程中不能破坏页面原布局。
中CANLENDAR控件建议在弹出的子窗体内独立使用。
6 包含数据的表格使用中没有数据的情况有文字标注[无**数据]]，表头字段名用区别于数据行的格式显示。
7 分栏目的主题名称使用用户容易理解的，以用户第一人称角度的命名方式，减少生硬的称谓给用户带来的不友好感。
8 B/S应用程序允许含有类似拖放操作的非标准交互控件，但是需增加操作的说明。
b) 表单控制
1 页面内部有必要的前后文帮助信息，将页面主要任务目标、注意事项等描述在表单前申明，便于用户及时获得导引。
2 页面在交互控制中添加完整的状态控制，操作中灰显特定组合的控件来实现用户的准确操作，及时的刷新表单中遗留的数据。
3 表单内任务无关的信息、较少使用的选项等可以通过DHTML 技术、服务器端控件的隐藏等减少用户操作中的干扰因素。
4 表单内在特定的字段域附近给出必填信息提示，并用醒目颜色标注，提醒用户注意，验证的错误提示要给出准确恰当的指导；为提高用户填写的效率，建议使用客户端验证；复杂逻辑的验证使用服务器端验证。
5 信息显示过滤可能出现的用户不能识别的HTML特殊字符。
6 表单中用户在交互过程中保证用户方便的切换编辑、浏览状态，方便用户用最快的速度获取需要的信息，提高操作效率。
7 经常使用的工具按钮（如新增、编辑等功能按钮）保证在页面经单向拖曳浏览后，不需来回拖曳滑竿即可操作；长页面可以考虑页首、页尾均放置工具按钮。
8 主详细表及父子表关系的查看方式使用联动式导航到下级数据，即点选主项目或父项目记录时系统自动查询并显示出关联的详细信息、子表数据，无需点选任何按钮。
c) 窗体控制
1. 使用具有广泛兼容性的j***ascript控制客户端交互和简单导航,，除服务器控件部分自动扩展到客户端的Jscript 外，程序员手动控制脚本不推荐使用Jscript 和VBscript。
2. 操作过程中有清晰分界的子任务使用弹出窗体实现，保证完成后向主任务窗体返回必要的结果，及时刷新主任务窗体，使用户看到操作完成的结果，并且通过控件获取焦点等措施突出显示该结果。
3. 弹出窗体的页面主题、栏目标题（Title）等资料与关联的父窗体保持上下文一致，方便用户理解并做出处理策略。
4. 采用框架结构的应用程序，要充分考虑不同分辨率下的自动扩展，不同框架之间同步通讯及时，方便用户快