web界面设计规范

web界面设计规范

一.页面设计部分

1.img控件

alt：所有展示类图片都要具有能简要描述图片内容的文字说明。

2.Input控件

maxlength：所有INPUT控件都需要制定maxlength属性，默认值为数据库中对应的字段的长度。

readonly：所有不可更改的信息都要使用readonly属性。

3.Form控件

action：所有Form都要指定action，如果提交给本身就指定action=""

method：执行不可逆动作使用POST,可逆动作使用GET

onsubmit：所有form都要指定提交前需要的检查程序。

所有form都要有对应的resetbutton。

4.button控件

onclick：form中用于提交的button不容许使用此方法，所有数据检查通过form的onsubmit激活。

5.title属性

所有页面都要具有和本页标题相同的title。

6.控件的命名

采用控件类型缩写（小写）+英文单词（第一个字母大写）的方法。

开发中控件基本涉及一下几类

button：btn

form：frm

select：sel

textarea：txt

input：ipt

7.语言设置

所有中文页面都要加上如下语句：

<metahttp-equiv="Content-Language"content="zh-cn">

<metahttp-equiv="Content-Type"content="text/html;charset=gb2312">

8.控件属性赋值

所有控件的属性值都要使用双引号或者单引号包括起来。

二.客户端程序部分

1.错误提示信息的处理（2-1）

所有错误信息全部使用中文提示错误信息，标点使用中文半角符号，格式如下：

"错误："+提示信息+"！"

2.成功提示信息的处理（2-2）

所有成功信息全部使用中文提示成功信息，标点使用中文半角符号，格式如下：

"成功："+提示信息+"！"

3.页面的返回

所有需要返回上一页的时候使用history.back();不使用history.go(-1);

需要返回前n页（n>1）时使用history.go(-n)；

所有返回都使用连接的方式而不是button。

4.提交前数据的判断

保证提交前的数据都会通过J***aScript进行数据类型以及长度的判断

是否为数字：使用函数isNaN()

长度判断:长度要判断去掉前后空格后的实际长度

为空判断：所有不容许为空的输入字段都要在去掉前后空格后进行判断，同时如果该字段为查询条件则必须不能为空

如果判断条件发现数据错误，则通过（2-1）提示错误信息，然后通过方法focus()聚焦错误字段。

5.删除数据前的提示

所有涉及删除的操作，在用户选定以后都要再进行一次确认操作。

三.服务器端程序部分

1.数据的取得

通过Get，Post，连接传递过来的数据在使用前都要通过trim去掉数据前后的空格。

2.数据的判断

通过request的得到的参数数据需要再次进行空，类型，和长度的判断。

3.对象的关闭

所有数据库和文件对象都要在使用后尽可能早的close，同时赋nothing。

4.提示信息

所有错误提示信息使用J***aScript提示，保证使用者看不到任何内部错误信息。（如1-1）

涉及数据库Update，Del，Insert的操作成功都要提示。（如1-2）

5.变量的使用

所有变量在使用前都需要声明，并且赋初值。

6.变量的命名

采用变量类型缩写（小写）+英文单词（第一个字母大写）的方法。

开发中变量基本涉及一下几类

整数：i

小数：f

字符:s

布尔：b

日期：d

特殊的：

循环依次采用i，j，m，n；

数组用ary

指针p，q

临时变量tmp

七.SQL语句

1.排序

order时应该尽量提前使用建立索引或者主键的字段排序。

2.select

select时避免使用*，即使需要所有字段也应尽量一个一个按照使用的顺序罗列出来。

3.尽量避免使用in和notin

八.测试

所有页面要在800*600,1024*768两种分辨率下运行通过。

所有页面要在IE5.0,5.5以及6.0下运行通过没有J***aScript错误。