Web项目开发流程及规范

Web項目开发流程及规范

标准规范2009-07-29 16:17:52 阅读392 评论0 字号：大中小订阅

开发流程及规范：Web 开发的分散性和交互性，决定了Web 开发必须遵从一定的开发规范和技术约定。

只有每个开发人员都按照一个共同的规范去设计、沟通、开发、测试、部署，才能保证整个开发团队协调一致的工作，从而提高开发工作效率，提升工程项目质量。

一、项目的角色划分

如果不包括前、后期的市场推广和产品销售人员，开发团队一般可以划分为项目负责人、程序员、美工三个角色。

项目负责人在我们中国习惯称为"项目经理"，负责项目的人事协调、时间进度等安排，以及处理一些与项目相关的其它事宜。程序员主要负责项目的需求分析、策划、设计、代码编写、网站整合、测试、部署等环节的工作。美工负责网站的界面设计、版面规划，把握网站的整体风格。如果项目比较大，可以按照三种角色把人员进行分组。

角色划分是Web项目技术分散性甚至地理分散性特点的客观要求，分工的结果还可以明确工作责任，最终保证了项目的质量。分工带来的负效应就是增加了团队沟通、协调的成本，给项目带来一定的风险。所以项目经理的协调能力显得十分重要，程序开发人员和美工在项目开发的初期和后期，都必须有充分的交流，共同完成项目的规划和测试、验收。

二、开发工具的选取

不象C/S结构程序开发，可以一门语言从头到尾，你用Delphi，就是Delphi 程序员，你用VC++，你就是VC程序员。B/S结构的Web开发工作，工具的选择是一件痛苦的事情。从Windows到Linux，从IIS到Apache，从J2EE 到 .NET，从COM到.NET到EJB组件......还有Asp、https://www.360docs.net/doc/de17100785.html,、Jsp、Php、Perl、Javascript、Vbscript......

美工也轻松不了多少，什么"网页三剑客" "新网页三剑客"、FrontPage、Photoshop、CorelDraw......谁都说自己是最强大的！

我们的经验是，选用工具时最好是统一的，比如美工统一用DreamwaverMX 制作网页，程序员全部用文本编辑器书写代码。统一工具的好处是可以保持同一个项目文档的一致性，便于开发人员的交流和文档的保存。

但是也不必刻意强求一致，比如美工可以使用任何自己熟悉的图形处理软件，只要最后能生成浏览器支持的图片就可以了。正是Web开发工具的多样性，才成就了今天互联网多姿多彩的局面。

只要程序员的纯Html和Javascript 代码的功夫足够过硬，就能胜任最后的网站整合工作。

三、项目开发流程

如果项目真正谈下来了，就需要正式确定前阶段的需求分析，该补充的步骤必须补上。然后进行详细的总体设计，其实也基本是前阶段工作的重复和完善。

产生各栏目文件夹的结构图（一些公共文件夹如images、scripts、styles 等需要固定存放，共同调用）。

然后由美工根据内容表现的需要，设计静态网页和其它动态页面界面框架，该切分的图片要根据尺寸切割开来。给需要程序动态实现的页面预留页面空间。制定字体、字号、超级链接等CSS样式等。

在美工设计页面的同时，程序员着手开发后台程序代码，做一些必要的测试。

美工界面完成后，由程序员添加程序代码，整合网站。由项目组共同联调测试，发现bug，完善一些具体的细节。

制作帮助文档、用户操作手册。向用户交付必要的产品设计文档。然后进行网站部署、客户培训。

最后进入网站维护阶段。这一阶段也可以不包括在该项目中，而作为公司的服务内容。

以上的每一部都会产生一些阶段性成果，项目经理需要及时进行监督、审核，发现问题及时纠正。为了控制项目的进度，应当实施填写"项目进度表"制度，即每天填写工作日志，记录当天的工作细目和工作量，以及需要解决和已经解决的问题。

四、一些技术规则

1，数据库命名约定(参考了"匈牙利命名法")

数据库(Database)：格式[db]_[ desc]。

表(Table)：格式[tab]_[desc]。表名长度不能超过30个字符，单词首写字母大写，多个单词间不用连接符号。

字段(Field or Column)：格式f_[type]_[desc]。f：表明这是一个字段名称；type：可选，表明字段类型，字符型为c，整型为i，逻辑型为b，货币类型为m,浮点型为f，日期型为d，时间型为t，二进制为bl。如果类型为字符型，可以省略。desc：对字段属性的有意义的描述，可以用英语单词、单词缩写、汉语拼音、字段实际含义的拼音缩写等，单词之间可以用单词首字母大写软分割（推荐），也可以用"_"隔开。

举例：

f_name (姓名)

f_c_ UserInfo 或f_c_ User_Info

f_xm (姓名)

f_grp_id (组标识)

索引(Index)：格式[idx]_[desc]。

视图(View)：格式[View]_[表A]_[表B]_[表C]...，其中View表示"视图"。这个视图由几个表产生就用连字符"_"连接几个表的名，如果表过多可以将表名适当简化。

存储过程：格式[sp]_[表名]_[存取过程名(缩写)]，比如sp_User_Delete。

触发器(Trigger)：格式[trg]_[d][i[[u]_[desc]。trg 代表触发器；d，i，u表明触发器类型(Delete，Insert，Update)定义，书写顺序为d、i、u；desc是表的名称，表明触发器所在的表。

数据库设备(Database Device)：格式[dev]_[desc]。

约束(Constraint)：格式[cns]_[desc]。

2，SQL语句书写规范

SQL语句中，SQL关键字全部大写，其它的遵照"数据库命名约定"。

例如：

SELECT * FROM tabNewsInfo WHERE f_UserName='' ORDER BY f_i_autoid

3，文件夹命名约定

公共文件夹：

/images 公共图片

/styles 样式表

/scripts 脚本

/ftps 下载

/doc 网站相关素材、文档

/readme.txt 网站说明文档

/helps.htm 网站帮助文档

/mylogs.txt 网站维护记录

其它栏目的命名，可以用拼音首字母简称，也可以用英文单词。全部文件夹的含义在readme.txt文件中说明。

4，对象及变量命名约定：每个变量名必须先定义，再使用。

在ASP文件的最开头添加语句<%Option Explicit%>可以强制变量定义。代码块必须采用缩进格式。每个函数前必须标明函数的功能、输入参数、返回值的相关信息。

变量类型缩写前缀

String str 或s

Integer Int

Date Dt

Object obj或o

Boolean bol或b

Byte Byt

Double Dbl

Error Err

Long Lng

Single Sng

5，图形对象约定

图片的格式：最后生成jpg，gif，png，swf 格式的图形文件。

图片的字节大小：最大不能超过30k。

图片的尺寸：根据需要确定，最好使用小图片，大的图片必须切割成小图片使用。

图片的留白：图片的边界不能留白，图片只包含有效的色彩元素。

6，媒体对象约定

流媒体的格式：asf，wmv，wma，rm，不建议使用avi 格式的动画文件。7,页面布局的基本约定

中文段落必须有2个汉字的缩进。字间距采用默认大小。行间距为16pt~20pt。文字布局必须留有"天""地""左""右"，不能把版面占满。

页面布局必须保持色彩平衡。

注意上下、左右的呼应。注意页面的整体协调。提倡画面和文字的融合，而不是画面和文字的明显分离。要按照设计广告的要求来设计网页页面，特别是一些产品展示性的页面。

五、一些经验和教训

1，能用静态网页表现的内容，尽量不用程序代码动态实现。

2，设计阶段，必须和用户进行充分的交流，完全、准确的了解用户的需求。

既不能歪曲用户的意思，也不能一味迎合用户的非正当需求，也不能对自己没有把握的技术甚至不可能实现的技术夸下海口。需求分析是一个沟通、交流、引导、教育、斗争、妥协的过程。需求分析结果要有文字资料存档。

3，技术参数必须了解准确。

比如用户的软件平台是linux系列，那你的系统就要考虑用Java或者Php 加MySQL开发了，这时候你的https://www.360docs.net/doc/de17100785.html,技术就用不上了。

4，最好让用户对已经确定的需求内容签字，盖章。

5，任何交流，必须有书面记录。

对一些喜欢"健忘"-实际上是懒惰的开发人员，要求他必须每天花10分钟写工作日志。

6，每个项目的有关文档，全部、统一集中归档。

web项目开发流程-01

任何一个项目或者系统开发之前都需要定制一个开发约定和规则，这样有利于项目的整体风格统一、代码维护和扩展。由于Web项目开发的分散性、独立性、整合的交互性等，所以定制一套完整的约定和规则显得尤为重要。本文档将定制一系列约定和规则，他们分别包括组件团队、文件夹命名规则、文件名命名规则、程序代码编程风格、数据库设计约定。这些规则和约定需要与开发人员、设计人员和维护人员共同讨论定制，将来开发都将严格按规则或约定开发。每个团队开发都应有自己的一套规范，一个优良可行的规范可以使我们工作得心应手事半功倍，这些规范都不是唯一的标准不存在对与错，也许有些地方与你当前使用的习惯相驳，很多地方都有争议。比如很多人习惯设计数据库时采用自动增长字段，而有些人（像我这样的人）就坚决反对，各自都有比较充分的理由阐述自己的观点，所以只好根据具体情况来采用相应的策略。

非常明显在Web项目开发中有前后台开发之分，前台开发主要是指非程序编程部分，主要职责是网站AI设计、界面设计、动画设计等。而后台开发主要是编程和网站运行平台搭建，其主要职责是设计网站数据库和网站功能模板的实现。下面的这些规范主要是从这2个方面来定制的，这些规范是我这几年学习工作中总结的一点小经验，本文档比较适合中小型网站或者Web项目的开发规范。

1.组建开发团队

在接手项目后的第一件事是组建团队。根据项目的大小团队可以有几十人，也有可以是只有几个人的小团队，在团队划分中应该含有6个角色，这6个角色是必须的，分别是项目经理，策划，美工，程序员，代码整合员，测试员。也许你的团队还没有6个人，没有关系一个人可以有多个角色，比如项目经理还可以有策划这个角色，如程序员还可以含有代码整合和测试这2个角色，如果你的项目够大人数够多那就分为6个组，每个组分工再来细分。下面简单介绍一下这6个角色的具体职责。

项目经理，项目总体设计，开发进度的定制和监控，定制相应的开发规范，负责各个环节的评审工作，协调各个成员(小组)之间开发。策划，提供详细的策划方案和需求分析。还包括后期网站推广方面的策划。美工，根据策划和需求设计网站AI，界面，Logo等。程序员，根据项目总体设计来设计数据库和功能模块的实现。代码整合员，负责将程序员的代码和界面融合到一起，代码整合员可以制作网站的相关页面，测试员，负责测试程序。

2.开发工具

Web开发工具主要分为3部分，第一部分是网站前台开发工具，第二部分是网站后台开发环境，第三部分是项目管理和辅助软件。下面分别简单介绍这三部分需要使用的软件。

网站前台开发主要是指Web界面设计。包括网站整体框架建立、常用图片、Flash动画设计等等，主要使用的相关软件是：Adobe Illustrator 、Adodb Photoshop、Dreamweaver MX、Flash MX等。

网站后台开发主要指网站动态程序开发、数据库建模，主要使用的相关软件是：PowerDesigner（数据库建模），PowerDesigner在数据库设计方面应用非常强大，用它可以快速创建数据库概念和物理模型，我最喜欢的还是它生成数据库Report的功能太方便了，设计数据库强烈推荐用它。Rational Rose（程序建模），如果你的项目功能模块不是特别复杂那就剩了它吧，这样会节省一些时间和开发的复杂度，不过我个人认为不管是大项目还

是小项目都应该画画Rose图。

网站项目管理主要指对开发进度和代码版本的控制。开发进度用Microsoft Project 来制定，代码版本控制采用Visual SourceSafe，当然还有其他的选择比如CVS和Rational ClearCase。网站测试采用https://www.360docs.net/doc/de17100785.html,的附带工具Microsoft Application Center Test，它可以进行并行、负载测试等。程序文档编写采用Word，如果你非常怀旧用WPS也可以。

3.网站开发流程

在项目开始实施之前应该有一个工作步骤也就是工作流程，在项目开发中最需要时间的是总体设计和系统测试，而程序编写代码所占的时间并不多，但有的团队就急于开发写代码，先把程序写出来再说，没有注重评审和测试这2个环节，结果造成返工，我在一家比较大的公司中都遇到多次这种情况。所以项目来了不要急于开工写代码，应该一步一步慢慢来，只有走的慢才能走得稳走得远。图1的开发流程比较好地体现开发的整个环节。

图1

从图1可以看到2条主线，这2条主线分别是前台开发和后台开发。前后台开发在项目开发早期互相没有交叉，当然不是绝对没有，Web策划和需求分析都是互相有关系的，一个是网站表现形式和风格的策划另一个是网站功能的策划，它们是衣服和躯干的关系。到了开发后期就需要把界面和功能模块结合起来形成一个统一，也就即将发布的网站。

4．数据库开发

数据文件命名采用系统名+_+文件类型，比如系统名为kupage,则数据库文件命名为kupage_database.mdf，有的数据库文件有多个，比如SQL Server就有2个，一个是数据库文件，另一个是日志文件，那么他们的文件命名分别为kupage_database.mdf，kupage_log.log。文件名全部采用小写。

数据库表命名规范，表名长度不能超过30个字符，表名中含有单词全部采用单数形式，单词首写字母要大写，多个单词间不用任何连接符号。若库中有多个系统，表名采用系统名称+单词或多个单词，系统名是开发系统的缩写，系统名称全部采用小写英文字符,如bbsTitle,bbsForumType。若库中只含有一个系统，那么表名仅用一个单词或多个单词。单词选择能够概括表内容的一个或多个英文单词，如UserInfo,UserType。关连表命名规则为Re_表A_表B,Re是Relative的缩写，如：Re_User_ArticleType, Re_User_FormType。

数据库字段命名规范，数据库字段名全部采用小写英文单词，单词之间用”_”隔开，命名规则是表别名+单词，如：user_name,user_pwd。表别名规则，如果表名是一个单词，别名就取单词的前4 个字母；如果表名是两个单词，就各取两个单词的前两个字母组成4 个字母长的别名；如果表的名字由3 个单词组成，你不妨从头两个单词中各取一个然后从最后一个单词中再取出两个字母，结果还是组成4 字母长的别名。

视图名采用规则View_表A_表B_表C,View表示视图。这个视图由几个表产生就用”_”连接几个表的名，如果表过多可以将表名适当简化，但一定要列出所有表名。

存储过程命名规则P_表名_存取过程名(缩写)，比如P_User_Del，

P_ArticleType_AddData。

SQL语句编写规则，关键字必须大写，其他书写按上述命名规则，比如：

Select user_id, user_name FROM User Where user_id = …tom?

5.文件夹文件名命名规范

文件夹命名一般采用英文，长度一般不超过20个字符，命名采用小写字母。除特殊情况才使用中文拼音，一些常见的文件夹命名如：images(存放图形文件)，flash（存放Flash 文件），style(存放CSS文件)，scripts（存放Javascript脚本），inc(存放include 文件)，link（存放友情链接）,media(存放多媒体文件)等。

文件名称统一用小写的英文字母、数字和下划线的组合。命名原则的指导思想一是使得你自己和工作组的每一个成员能够方便的理解每一个文件的意义，二是当我们在文件夹中使用“按名称排例”的命令时，同一种大类的文件能够排列在一起，以便我们查找、修改、替换、计算负载量等等操作。

1、图片的命名原则名称分为头尾两部分，用下划线隔开，头部分表示此图片的大类性质例如广告、标志、菜单、按钮等等。

放置在页面顶部的广告、装饰图案等长方形的图片取名：banner

标志性的图片取名为：logo

在页面上位置不固定并且带有链接的小图片我们取名为button

在页面上某一个位置连续出现，性质相同的链接栏目的图片我们取名：menu

装饰用的照片我们取名：pic

不带链接表示标题的图片我们取名：title

下面是几个范例：banner_sohu.gif 、banner_sina.gif、menu_aboutus.gif 、

menu_job.gif、title_news.gif、logo_police.gif、logo_national.gif 、pic_people.jpg 。

2、动态语言文件命名规则性质_描述，描述可以有多个单词，用”_”隔开，性质一般是该页面得概要。

范例：register_form.asp，register_post.asp,topic_lock.asp

6.程序代码编程规范

一个良好的程序编码风格有利于系统的维护，代码也易于阅读查错。在此只讨论ASP的编程风格和约定。在ASP中所有变量是弱变量，无需定义就可以直接使用，而且代码不区分大小写。但其他语言一般这些都要定义的，为了养成良好的编程习惯，编写代码务必按照一下规则。

1、每个变量名必须定义，在ASP文件的最开始添加语句，强制定制每个变量。

2、出于易读和一致性的目的，在代码中使用以下变量命名约定：

子类型

前缀

示例

Boolean

bln

blnFound

Byte

byt bytRasterData

Date (Time) dtm

dtmStart

Double

dbl dblTolerance

Error

err errOrderNum

Integer

int intQuantity

Long

lng lngDistance

Object

obj objCurrent

Single

sng sngAverage

String

str strFirstName

3、程序代码需要有缩进，缩进采用键盘Tab键，不采用空格键。并且”＝”或者链接字符串时需要左右空一格，如下：

4、函数过程编写的约定。函数或者过程命名采用动作+名词，每个函数需要给出相应的注释，函数功能，传入变量，以及作者和修改相关信息。如下面函数:

<%

'[功能] 返回一个参数的值

'[参数] strParameterName 参数名称

'[作者] icefire 2002/8/20 am

Function GetParameterValue(strParameterName)

Dim objRS, strSQL, strParameterValue

strSQL = "Select ParameterValue FROM damsParameters Where ParameterName = '" & strParameterName & "'"

.

.

.

GetParameterValue = strParameterValue

Set objRS = Nothing

End Function

5、ASP内置对象区分大小写。如下代码片断

strUserName = Request.Form(“UserName”)

Set conn = Server.CreateObject("ADODB.Connection")

6、数据库连接一个库只能有一个数据库连接文件，创建数据库对象得原则是尽可能晚地打开数据库，尽可能早地关闭数据库。创建数据库对象调用统一地创建函数。如下：Sub OpenConn(ByRef conn)

Dim strDBPath, strDBConnection

strDBPath = Server.MapPath("database/tax.mdb")

strDBConnnection = "Driver={Microsoft Access Driver (*.mdb)}; DBQ=" & strDBPath

Set conn = Server.CreateObject("ADODB.Connection")

conn.Open strDBConnnection

End Sub

7、当一个对象不在使用时要释放对象资源，比如objFSO,objRS对象等。采用统一函数调用。函数如下：

Sub CloseObj(ByRef obj)

If IsObject(obj) Then

obj.Close

Set obj = nothing

End If

End Sub

8、时间全部以字符串的形式保存到数据库中，这样做能够是日期在不同的数据库中都能良好地保存，也方便数据库地迁移。时间用14位字符串保存，日期用8位字符串保存。

________________________________________________________________

很久以来，网站开发过程中，最大的问题是沟通，前台与后台，项目经理与项目实施人员，项目经理和客户，都苦于良好的沟通方式。我觉得问题的根源就在于传统的网站开发方法，说白了，就是非标准的开发方式导致的沟通的困难。

具体地说，一个网站开发小组，通常要配备一下人员：网站总体策划师，网页设计师（美工），网站制作，程序员。看似分工明确，却往往效率低下，原因在于网站开发本身就没有实现内容、结构、表现、行为的分离，却把人员分工分的如此的明确，这本身就是人力资源运用的败笔：根本没有可能实现“各司其职”，又怎么会有良好的效率保证？

web标准究竟有何意义？由此看来标准带来的不仅仅是技术上的统一规范，它处处体现出人文关怀的意味（508条便是明证），更重要的是，它极力要改变的是网站从业人员的思路，是适应现代社会发展分工需要的规范。

现在，我们尝试着用web标准来指导我们的网站开发流程，会是什么样子？

我不得不在此提出一个新的网站开发职位：网站内容结构设计师。web标准强调内容的结构化，认为网站是建立在内容的基础上，没有内容谈不上表现。由此看来，内容结构的设计的重要性不言而喻。遗憾的是目前的网站开发团队并没有这样一个职位，或是说这样的职位总被其他的职位兼顾着（一般都是网站策划师），但我这里所言的网站结构设计师并不仅限于现在策划师所作的。

目前的策划师往往仅仅是策划出网站风格、栏目、功能，但我这里谈及的网站结构设计师所作的工作并不仅限于此，他所要做的是将客户提供的信息归类，将信息内容结构化，使客户提供的整个文档具备高度的可读化（就像组织一本书，要分好章节、项目、段落等等）。这样的职位要求从业人员有较高的逻辑思维能力和语文基础，并熟知xhtml中的结构化标签，可利用这些标签最终形成内容高度结构化的网页。这个工作是整个网站构建的基础。

有了这样一个网站内容设计师，我们整个的工作就简单而明了了。我们需要以下人员：

网站项目经理：负责与客户沟通，采集客户的需求，确定网站的风格、栏目、功能，制定网站策划书、指派监督任务，与项目实施人员沟通协调，测试网站，最终促使项目水利完成。网站内容结构设计师：根据项目经理提供的项目材料，生成高度结构化的文档，并形成初始网页（不含任何样式）。

网页设计师（美工）：根据项目经理提供的策划书和内容结构师制作的初始网页，进行网页效果图的设计，包括首页、栏目页、内容页、功能页等。

网站样式设计师（网站制作）：参照网页设计师的效果图以及内容设计师的初始网页，编写网页样式，须保证样式的高效简洁。最终实现符合效果图的网页。

网站程序员：根据项目经理的网站功能设计策划，编制实现功能的后台程序。需要在页面

输出的，就将页面的静态内容换成动态输出的。要求了解web标准。

这样的人员分配，保证了每个项目人员都能专心的发挥本身的长处，内容设计师只要具备良好的逻辑思维和语文基础，不需要去考虑网页的表现；网页设计师只要是个平面设计高手，具有良好的形象思维，良好的美学观念，良好的艺术创造力，不需要繁琐的网页设计知识，毕竟网页设计也要有一定的逻辑思维，这对专业的艺术设计人员来说是可怕而费时的；网站样式设计师（网站制作），只要照着效果图实现效果就可以了，工作性质类似于工匠，要求有细心仔细的工作作风，只需要了解样式的编写，不需要再去考虑创作上的问题，某种意义上说也是一种解脱。

由此看来，在应用标准进行设计的过程中，能够顺利地实现项目的明确分工，的确是有利于开发效率的。