整理网站开发规范(zhuan)

今天在收拾资料的时候，看见了以前最早做网站时的开发规范。给大家拿出来。如果有需要的可以参考一下！谢谢！

一，概述
不论是最古老的HTML，还是最近流行的AJAX，网站开发始终是一个综合了多种最新技术的实验场。作为个人工作室，成员屈指可数，多为手工作坊，往往一个人要担任多个角色，既是前台美工，又是后台程序员，既做整体策划，又做数据库详细设计……为了在个人能力和客户需求之间取得平衡，中小型网站(Web项目)的开发成为个人工作室们的首选。
因为一套良好的开发规范，可以让手工作坊也拥有软件工厂般的强大竞争力。唯此我们才会不遗余力地把各种原属高端的开发技术去芜存精，一一武装到手工作坊之中。
网络的本质就是共享。本开发规范由深度工作室 (www.deepcast.net)深瞳(server#deepcast.net)所制作，并在www.deepcast.net上发布最新版本，依照 Creative Commons Attribution-ShareAlike 1.0 授权条款显示、欢迎复制、散布及使用，惟需提及原作者；同时源自本网站之衍生著作亦需遵照此授权条款。

二，工作室的五个基本角色(按他们在网站开发周期出现的顺序)：往往一人兼多个角色。
(1)系统架构师(Software Architect策划)：进行需求分析，提供详细的策划方案(解决方案)，还包括后期网站推广方面的策划。
(2)项目经理(Project Manager)：项目总体设计，开发进度的定制和监控，定制相应的开发规范，负责各个环节的评审工作，协调各个成员(小组)之间开发。还要面向股东。
(3)开发人员(Software Developer)：
A，美工：根据策划和需求设计网站AI，界面，Logo等。
B，程序员：根据项目总体设计来设计数据库和功能模块的实现。
C，代码整合员：负责将程序员的代码和界面融合到一起，代码整合员可以制作网站的相关页面，
(4)测试人员(Software Tester)：负责测试程序。
(5)解决方案架构师(Maintainer维护)：项目布署与变更，技术支持，项目维护，网站版本控制，项目文档维护，提供报表，项目跟踪。

三，常用开发工具

1，美工常用工具：
网页编辑软件 Dreamweaver MX/Frontpage: 制作网站框架，制作网页
图像软件 Adodb Photoshop/Imageready/Firework等设计效果图，二维图片处理
网页动画软件 Flash MX:动画
Adobe Illustrator:矢量图片处理
网页制作其他工具：Cool360制作全景图，Swish制作Flash文字特效，使用CuteFTP发布。
网页特效的具体技术实现：AJAX技术：Javascript + DHTML技术

2，程序员常用工具：
建模可用传统的PowerDesigner/Rational Rose，数据库管理也可考虑使用短小精悍的Case Studio，也可使用MS Visio。
IDE根据需要选择，Dreamweaver/Visiual Studio.net/VS.net Express等

3，项目管理工具：
Microsoft Project: 制定开发进度
Visual SourceSafe: 代码版本控制，当然还可以使用CVS或者Rational ClearCase。

4，测试工具：VS.net的附带工具Microsoft Application Center Test，它可以进行并行、负载测试等。

5，文档工具： Word/WPS。

另外，MS最新的Visual Studio.net 2005 Team Suite整合了IDE/建模/测试/项目管理/文档/MSF等团队开发功能，正待期待。

四，系统分析技术：
1，开发流程：
我们的目标是确定一套轻快而又标准的开发流程。
为了追求速度与质量的平衡，专业工作室花在总体策划设计和系统测试的时间都比编写代码用的时间要多得多。 体现在下图就是评审和测试这2个环节。
网站开发流程图：

 

其实前后台开发两条主线在项目开发早期并非如图完全独立，Web策划和需求分析往往需要系统架构师综合考虑，一个是网站表现形式和风格的策划，另一个是网站功能的策划，它们是衣服和躯干的关系。到了开发后期前后台就合二为一了。

　　2，系统分析：
需求分析：非常重要，需要策划人员的经验与交流
网站建设方案与报价：设计草图，策划结构图，制作费用，本公司简介
网站建设详细说明：美工设计(栏目，版式等)，后台策划(模块分析，数据库设计等)，部署网站，规范目录
网站整体风格定位：网站类型，行业大致风格走向(色调，笔触)
   整体形象设计：标准字，LOGO，标准色彩，广告语。
   首页设计(1-3个，请客户签名确认一个)：风格设计(版面，色彩，图像，动态效果，图标)；模块设计（banner，菜单，标题，版权）。

　　3，开发制作：按800*600屏（实际为778*434）制作，标准页面为A4(8.5*11inch)，小Banner为88*31，小图标可采用120*90，120*60等。

　　4，测试维护
　　5，SEO与网站推广：设置适当的META标签，登录Google，友情链接，

五，美工设计
(一)色彩搭配在网站中的应用
1，基础知识
2，配色方案
3，配色选择
4，色彩的4种功能角色
5，使用色彩给网站进行定位
(二)设计用户界面
1，美工方面的考虑：基础知识包括空间构成(平面构成，立体构成)，时间构成
(1)，文字：
标题：通过加大加粗，使用高色阶(鲜艳色)或者留白等使标题一目了然。
字体：宋体横细竖粗，工整清晰，可用于排版标题(粗体)和正文(细)。黑体横竖同粗，工整严肃，可用于排标题。圆体圆润饱满，丰满艺术，可用于正文，标题和装饰。另外美术体，书法体等可用于标题，广告和装饰。
粗细：细字优美冷静阴柔，粗字有力热情阳钢。正文用标准字体最好。
字号：大字有力自信，小字纤密紧凑。标题放大则页面活跃，缩小则页面凝重。
(2)，色彩：配置合适的色调与页面主题相和谐，如灰色调的素雅，鲜艳色调的健康活泼。
(3)，形状(图片)：生动的插图和照片可以直接表现页面主题。用相片增加故事性，用插图增加印象性。
(4)，版式：用对称(上下左右，注意留白)的均衡型表现典雅稳重，用多文少图的检索型表现丰富充实，用刻写生活的相片来表现生活与自我(可使用同色系来表现幻想与封闭)，用几乎全图的美工型表现超印象。用左右对齐式表现理智公开；用分散全景式表现自由轻松；用卫星式表现家庭稳定；用包围式表现限定；用散开式表现流动与自由，优雅与轻松；
(5)，页面结构：使用留白和色块对页面信息进行分组显示，使页面结构清晰。

2，实用性设计：
(1)，表现欢迎：可用花朵/笑脸等图片；可用鲜艳色(活力)，亮色调(愉悦)，柔色调(平静)；可用喜庆场面图案(新春，生日，花环，桃心，京剧形象)。
(2)，传达信任感：可用美图，可用自然合理的鲜艳配色，可用整齐平衡的版式。
(3)，加强说服力/亲和力：可用相关的插图相片，可用摆POS的人物造型。

(三)，广告的设计
1，设计原则：醒目美观，内容有说服力，数目合理设置，与整个页面协调
2，标准尺寸(单位：象素 pixel)
300*250中等矩形，250*250正方形，可用于页面内部
130*300垂直矩形，120*600垂直通栏，可与正文混排
360*300大矩形，可用于弹出窗口
468*60通栏广告，234*60半栏广告
88*31链接用LOGO标志
120*60按钮样式，120*240垂直按钮，125*125正方形按钮，可用于大量客户的小幅广告

五，使用层/表格/框架/模板/行为/JavaScript/CSS/数据库技术等综合技术：

六，开发规范

　　为了项目的整体风格统一、代码维护和扩展，克服由于Web项目开发的分散性、独立性、整合的交互性等所带来的风险，每个团队都将严格按规则或约定开发。

1，数据库开发

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

[数据库表命名] 表名长度不能超过30个字符，表名中含有单词全部采用单数形式，单词首写字母要大写，多个单词间不用任何连接符号。若库中有多个系统，表名采用系统名称_ 单词或多个单词，系统名是开发系统的缩写，系统名称全部采用小写英文字符,如bbs_Title,bbs_ForumType。若库中只含有一个系统，那么表名仅用一个单词或多个单词。单词选择能够概括表内容的一个或多个英文单词，如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’


2，文件夹文件名命名规范

[文件夹命名]一般采用英文，长度一般不超过20个字符，命名采用小写字母。除特殊情况才使用中文拼音，

* 一些常见的文件夹命名如：images(存放图形文件)，flash（存放Flash文件），style(存放CSS文件)，scripts（存放 Javascript脚本），inc(存放include文件)，link（存放友情链接）,media(存放多媒体文件)等。

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

[图片的命名原则] 性质_描述，两部分用下划线隔开，头部分表示此图片的大类性质，例如广告、标志、菜单、按钮等等 。
*放置在页面顶部的广告、装饰图案等长方形的图片取名： 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 。

[动态语言文件命名规则] 性质_描述，描述可以有多个单词，用”_”隔开。性质一般是该页面得概要，范例：register_form.asp，register_post.asp,topic_lock.asp


3，程序代码编程规范

[总概] 一个良好的程序编码风格有利于系统的维护，代码也易于阅读查错。

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

1、每个变量名必须定义，在ASP文件的最开始添加语句<%Option Explicit%>，强制定制每个变量。
2、出于易读和一致性的目的，在代码中使用以下变量命名约定：

子类型     |前缀       |示例               |我喜欢的前缀
 
Boolean    |bln        |blnFound          |bl
 
Byte       |byt        |bytRasterData     |bt
 
Date (Time)|dtm        |dtmStart          |da
 
Double     |dbl        |dblTolerance      |db
 
Error      |err        |errOrderNum       |er
 
Integer    |int        |intQuantity       |in
 
Long       |lng        |lngDistance       |lg

Object     |obj        |objCurrent        |oj
 
Single     |sng        |sngAverage        |sg
 
String     |str        |strFirstName      |st
 

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

*例如：
<%
stMessage = “你好”
stMessage = stMessage & “再见”
%>

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

*例如：
<%
'[功能] 返回一个参数的值
'[参数] stParameterName 参数名称
'[作者] icefire 2002/8/20 am
Function GetParameterValue(strParameterName)
Dim objRS, strSQL, strParameterValue
stSQL = "SELECT ParameterValue FROM damsParameters WHERE ParameterName = '" & strParameterName & "'"
.
GetParameterValue = strParameterValue
Set objRS = Nothing
End Function

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

*例如：
stUserName = Request.Form(“UserName”)
Set conn = Server.CreateObject("ADODB.Connection")

6、[数据库连接] 一个库只能有一个数据库连接文件，创建数据库对象的原则是尽可能晚地打开数据库，尽可能早地关闭数据库。创建数据库对象调用统一地创建函数。

*例如：
Sub OpenConn(ByRef conn)
Dim strDBPath, strDBConnection
stDBPath = Server.MapPath("database/tax.mdb")
stDBConnnection = "Driver={Microsoft Access Driver (*.mdb)}; DBQ=" & stDBPath
Set conn = Server.CreateObject("ADODB.Connection")
conn.Open stDBConnnection
End Sub

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

*例如：
Sub CloseObj(ByRef obj)
If IsObject(obj) Then
obj.Close
Set obj = nothing
End If
End Sub

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

八，术语解释
　　在Web项目开发中有前后台开发之分，
　　[网站前台开发]主要是指非程序编程部分，主要职责是网站AI设计、界面设计、动画设计等,主要是指Web界面设计,包括网站整体框架建立、常用图片、Flash动画设计等等。
　　而[网站后台开发]主要是编程和网站运行平台搭建，其主要职责是设计网站数据库和网站功能模板的实现。主要指网站动态程序开发、数据库建模。
　　另外还有[网站项目管理]主要指对开发进度和代码版本的控制。
[开发规范]任何一个项目或者系统开发之前都需要定制的一个开发约定和规则

九，参考文章：
　　<<dreamweaver mx 2004 完美网页设计 商业网站篇>>
　　色彩搭配在网站中的运用
　　http://spaces.msn.com/members/silicn/Blog/cns!1pfXlHnGZHUEkwmtieQk9NGA!2453.entry
　　http://download.winzheng.com/SoftDown.asp?ID=27696
　　搜索引擎优化（SEO）知识完全手册
　　www.sowang.com/Resources/2005_hbj_seo.pdf
  漫谈网站开发规范
　　http://3rgb.com/b/?act=viewthread&category=3&threadid=216&Page=2