WEB开发规范初稿.doc

《WEB开发规范初稿.doc》由会员上传分享，免费在线阅读，更多相关内容在应用文档-天天文库。

1、WEB开发规范初稿目录一整体页面效果2二表单类4三表格类5四控件外观类6五代码类8六SQL类9七命名类10八自行测试类11一整体页面效果1所有页面都要具有和本页标题相同的title。2所有中文页面都要加上语言设置语句。3所有页面要在1024*7681440*900两种分辨率下运行通过，其中宽屏如客户无特殊要求采用居中方式不变形即可。4所有页面要在IE6.0以及7.0下运行通过没有脚本程序错误。5界面设计原则：风格必须统一，界面风格依据美工原始效果图。6B/S结构开发原则：使用框架。7页面使用表格（Table）进行格式设置：表格百分比定宽，

2、居中，隐藏边框。8主页面Body设置：bgcolor="#FFFFFF"。9框架子页面Body设置：bottomMargin="0"leftMargin="0"。10冒号必须是在中文输入状态下键入。11控件外观在CSS内设置，主要包括：链接，表格，文本框，数据集。12一般性项目开发的主框架是三个，其命名规则如下：顶部框架：_topFrame左侧框架：_leftFrame主框架：_mainFrame13登录界面完成用户身份和权限识别的功能，要求界面简单明了，美观大方。界面功能键包括登录、取消和重置。若输入密码有问题，需要提示重新输入，提示规

3、范请参考下一节。部分项目提供图形验证码功能。14整体界面背景颜色设为白色，大部分字体采用黑色。整个WEB程序采用统一的CSS样式表来控制界面风格。15字体一般情况下中文采用楷体；英文采用Arial。16字形一般情况下应采用常规字型，仅当特殊需要时才考虑其他字型(如下划线、粗体字、斜体字等)。17按钮形状统一由CSS样式表控制。18相同类别的按钮应放在一起，组成按钮组，按钮组之间保持适当的距离，“确定”、“取消”、“退出”等按钮归为一类；“新增”、“修改”、“保存”、“删除”等按钮归为一类；“查询”、“打印”、“下载”等按钮归为一类；“各类

4、按钮按以上列出的顺序从左向右排放，例如第一类中“确定”按钮放在最左边、“退出”按钮放在最右边、“取消”按钮放中间。按钮的排放顺序遵循常用和重要的放左边的原则。19菜单层次一般采用两层菜单。设计原则是将常用的、需单独处理的功能模块作为主菜单；将可归并为主菜单上的某一项、功能上相近或相关的作为二级菜单。20滚动条采用自动方式，只在窗口的宽度和长度小于数据显示所需宽度或长度时才滚动条，而且只在主框架和左侧框架中出现，顶部框架不允许出现滚动条。21界面布局统一为“顶部和左侧的嵌套框架”形式进行界面设计，顶部框架放置LOGO、BANNER和一些公共

5、功能，如返回主页、退出等，左侧框架放置系统菜单和各子菜单，右侧框架作为主显示窗口。每个框架的显示内容都应占据整个页框架的可用部分，不应留下空白。22顶部框架占页面高度的15-20%。23左侧框架占页面宽度的15-18%，呈目录树结构。24主框架要求：主框架第一行显示当前选择的功能界面名称且尽量按导航方式显示。按钮放在框架的底部中间或右侧。字段排列的优先顺序为从左到右，从上到下。需要用户输入或点选操作的字段应优先排放，并要求按主关键字、索引关键字、其他字段的顺序依次排放，使用频率高的字段排在前面，按TAB键的时候能按次序跳到下一个字段。不允

6、许用户输入或点选的字段应明显表示，采用背景变灰的方式。25链接路径全部采用相对路径。26用DreamWeaver设计网页的时候，自动产生的代码可能比较乱，可以用“适应源文件格式”来进行整理。27所有的字号都应该用样式表来实现，禁止在页面中出现标记。28页面，表格都应该有边距，避免紧贴边沿的情况发生，最小边距值为“3px”，默认边距值应在CSS中设定。29页面内容信息应铺满整个框架页面并适当留白方便阅读，严禁出现大片空白的页面设计。二表单类1输入类控件textbox都需要制定maxlength属性默认值为数据库中对应

7、的字段的长度或该类型字段常规长度。2所有不可更改的信息都要使用readonly属性。3所有form都要指定提交前需要的检查程序或对应JS校验代码。4所有form都要有对应的resetbutton。5控件的命名采用控件类型缩写（小写）+英文单词（第一个字母大写）的方法。比如button：btn+英文单词。6所有控件的属性值都要使用双引号或者单引号包括起来。7所有错误信息全部使用中文提示错误信息，标点使用中文半角符号，格式如下："错误："+提示信息+"！"。8所有成功信息全部使用中文提示成功信息，标点使用中文半角符号，格式如下："成功："+提

8、示信息+"！"9所有进行过增、删、改的操作按钮必须给出操作成功或错误的信息提示。10所有需要有返回的页面须有页面的返回链接，使用链接不用按钮。11保证提交前的数据都会通过JavaScript进