一、命名规则
文件名称统一用小写的英文字母、数字和下划线的组合,其中不得包含汉字、空格和特殊字符;命名原则的指导思想一是使得你自己和工作组的每一个成员能够方便的理解每一个文件的意义,二是当我们在文件夹中使用“按名称排列”的命令时,同一种大类的文件能够排列在一起,以便我们查找、修改、替换、计算负载量等等操作。
A、HTML 的命名原则
html文件后缀名统一为.html,优先使用简短有意义的英文名命名,不要使用中文字符名称,同时将对应界面搞放于同目录中,若界面搞命名为中文名,请重新命名与html文件同名,以方便后续添加功能时查找对应页面;
引文件(首页)统一使用default.html、default.aspx文件名(小写)。
例如:
1. 关于我们 \ aboutus
2. 信息反馈 \ feedback
3. 产 品 \ product
功能性页面以性质_描述,描述可以有多个单词,用“_”隔开,性质一般是该页面的概要。
B、图片的命名原则
图片的名称分为头尾两部分,用下划线隔开,头部分表示此图片的大类性质。
例如:广告、标志、菜单、按钮等等。
1. 放置在页面顶部的广告、装饰图案等长方形的图片取名:banner
2. 标志性的图片取名为:logo
3. 在页面上位置不固定并且带有链接的小图片我们取名为:btn
4. 在页面上某一个位置连续出现,性质相同的链接栏目的图片我们取名: menu
5. 装饰用的照片我们取名:pic
6. 不带链接表示标题的图片我们取名:title
范例:
功能 | 样例1 | 样例2 |
广告/装饰/长图 | banner_xxxx1.gif | banner_xxxx2.gif |
连续(菜单)菜单图 | menu_aboutus.gif | menu_ feedback.gif |
标题图 | title_news.gif | title_ product.gif |
标志图 | logo_police.gif | logo_national.gif |
装饰图 | pic_xxxx1.jpg | pic_xxxx2.jpg |
小图标 | ico_xxxx1.gif | ico_xxxx2.jpg |
导航图片 | nav_xxxx1.gif | nav_xxxx2.jpg |
按钮图 | btn_xxxx1.gif | btn_xxxx2.gif |
鼠标感应效果图片命名规范为"图片名+_+on/off"。例如:menu_xx_on.gif menu_xx _off.gif
C、css命名原则
以性质_描述,描述可以有多个单词,用“_”隔开,性质一般是该功能的概要。
范例:
功能 | 样例1 |
共用 | base.css |
首页 | index.css |
全站 | core.css |
复位 | reset.css |
频道全局 | stock_global.css |
D、javascript 的命名原则
以性质_描述,描述可以有多个单词,用“_”隔开,性质一般是该功能的概要。
范例:
功能 | 样例1 | 样例2 |
广告条 | 功能_banner1.js | 功能_banner2.js |
弹出窗口 | pop_default.js | pop_stock.js |
共用 | common.js | — |
全局 | global.js | — |
E、动态语言文件命名原则
使用简短有意义的英文名命名
范例:
功能 | 样例1 | 样例2 |
注册页面 | register.aspx | register.aspx |
专题页面 | topic.aspx | topic.aspx |
具体可参照HTML命名规则。
二、文件夹及文件存放位置规范
目录结构主要分为四类,需要注意的是,所有命名必须为小写英文,不能大写或中文。
目录的命名尽可能使用英文或者全拼表达目录内的页面作用(语义化),需要注意的是不要使用中文词组简拼(eg: 目录--> ml)。简拼容易出现重复、或者目录结构复杂的时候容易出现混乱,给后期维护带来很大的麻烦。
范例:
功能 | 文件夹 | 说明 |
图片 | images | 存放图片文件 |
脚本 | js | 存放Javascript脚本 |
样式 | css | 存放css样式脚本 |
包含文件 | inc | 存放include文件 |
Flash | flash | 存放flash文件 |