资产命名约定（图像，CSS，JS）？
我仍然努力寻找资产，如我的web项目中使用的图像，js和css文件的良好命名约定。
所以，我目前的情况是：
CSS： style-{name}.css
例子： style-main.css ， style-no_flash.css ， style-print.css style-no_flash.css等
JS： script-{name}.js
例子： script-main.js ， script-nav.js等
图片： {imageType}-{name}.{imageExtension}
{imageType}是其中的任何一个
- 图标（例如帮助内容的问号图标）
- img（例如通过
<img />元素插入的标题图片） - button（例如graphics提交button）
- bg（图像被用作css中的背景图像）
- 精灵（图像被用作背景图像在CSS中，并包含多个“版本”）
示例名称为： icon-help.gif ， img-logo.gif ， sprite-main_headlines.jpg ， bg-gradient.gif等
那么，你怎么看， 你的命名规则是什么？
我把CSS文件放在一个文件夹的css ，JavaScript的js ，图像中的images ，…你认为合适的添加子文件夹。 在单个文件级别上不需要任何命名约定。
我注意到很多前端开发人员正在从css和js转向styles和scripts因为通常还有其他的东西，比如.less ， .styl和.sass ，还有一些.coffee 。 事实是，即使每个人都这样做，在select文件夹组织方式时使用特定的技术选项也是一个坏主意。 我将继续使用我从这些备受尊敬的开发人员那里看到的标准：
-
src/html -
src/images -
src/styles -
src/styles/fonts -
src/scripts
和他们的目标生成等价物，有时根据他们正在build设什么前缀有dest ：
-
./ -
images -
styles -
styles/fonts -
scripts
这允许那些想要把所有文件放在一起（而不是分出一个src目录）来保持这些文件，并且保持与那些发生冲突的文件相关联。
我实际上有点进一步补充
-
scripts/before -
scripts/after
其中的smooshed成两个main-before.min.js和main-after.min.js脚本，其中一个用于标题（例如normalize和modernizr基本元素，例如必须提前运行）以及after因为该JavaScript可以等待的身体。 这些不是为了阅读，就像Google的主页一样。
如果有脚本和样式表是有意义的，因为在构build规则中考虑了特定的cachingpipe理方法，所以可以单独缩小和离开链接。
如今，如果您不使用某种构buildstream程（如吞噬或咕噜咕噜） ，则可能无法达到您应该考虑的大多数以移动为中心的性能目标。
/资产/
/ CSS的
/图片
/ Javascript（或脚本）
/精缩
/资源
是我见过的最好的结构，也是我喜欢的结构。 有了文件夹，你并不需要在描述性的名字前加CSS等。
对于css可能定义大量背景图像的大型网站，这些资产的文件命名约定在稍后进行更改时非常方便。
例如：
[component].[function-description].[filetype] footer.bkg-image.png footer.copyright-gradient.png
我们还讨论了添加元素types，但我不知道这是多么有用，可能会误导未来所需的更改：
[component].[element]-[function-description].[filetype] footer.div-bkg-image.png footer.p-copyright-gradient.png
首先，我分成文件夹： css ， js ， img 。
在css和js中，我用项目名称加前缀文件，因为您的站点可能包含js和css文件，这就清楚了文件的具体位置，或者与插件有关的地方。
css/mysite.main.css css/mysite.main.js
其他文件可能是这样的
js/jquery-1.6.1.js js/jquery.validate.js
最后，图像被他们的使用分开。
-
img/btn/submit.png一个button -
img/lgo/mysite-logo.png一个标志 -
img/bkg/header.gif背景 -
img/dcl/top-left-widget.jpg一个贴花元素 -
img/con/portait-of-something.jpg内容图片
保持图像的组织是很重要的，因为可以有超过100个，并且可以很容易地完全混合在一起，并且混淆命名。
我倾向于避免任何通用的东西，比如smdrager的build议。 “mysite.main.css”并不意味着什么。
什么是“mysite”？ 我正在做这个？ 如果真的那么显而易见的话，但是它已经让我思考它可能是什么，如果这是明显的！
什么是“主”？ “Main”这个词在编码人员的知识范围之外没有任何定义。
虽然在某些情况下可以，但也应避免使用“top”或“left”这样的名称：“top-nav.css”或“top-main-logo.png”。
您可能最终想要在其他地方使用相同的东西，并将图像放入页脚或名为“top-banner.png”的主页内容中，这是非常令人困惑的！
我没有看到有大量的样式表的问题，以允许一个体面的命名约定来描述给定文件中的CSS是什么。
有多less完全取决于网站的大小，function是什么，以及网站上有多less个不同的区块。
我不认为你需要在CSS文件名中声明“CSS”或“STYLE”，因为它是在“css”或“styles”文件夹中，并且扩展名为.css ，主要是因为这些文件只是曾经在<head>区域打过电话，我清楚地知道它们是什么。
这就是说，我用库，JS和configuration（等）文件做到这一点。 例如libSomeLibrary.php或JSSomeScript.php。 由于PHP和JS文件被包含或用于其他文件中的各个区域，并且知道该文件在文件名中的主要用途是有用的。
例如：查看文件名require('libContactFormValidation.php'); 是有用的。 我知道这是一个库文件（lib），并从它的名字。
对于图像文件夹，我通常有images/content-images/和images/style-images/ 。 我不认为有必要进一步分离，但这又取决于项目。
然后，每个图像将被相应地命名为它是什么，我不认为有任何需要定义文件是文件名称内的图像。 尺寸可以是有用的，特别是当图像具有不同的尺寸时。
网站徽标150×150.png
网站徽标35×35.png
商店结帐button，40×40.png
店铺删除项，20×20.png
等等
一个很好的规则是：如果一个新的开发者来到这个文件，他们会坐着几个小时，或者他们可能会理解什么事情，只需要一点时间研究（这是不可避免的）？
然而，像这样的事情，最重要的规则之一就是坚持不懈 ！
确保你遵循相同的逻辑和模式，尽pipe你所有的命名约定！
从简单的css文件名到PHP库文件到数据库表和列名。
英国广播公司有很多关于networking发展的标准。
他们的标准对于CSS文件来说相当简单：
http://www.bbc.co.uk/guidelines/futuremedia/technical/css.shtml
您可能能够在主站点上find有用的东西：
你可以这样命名：
/ assets / css / – 用于CSS文件
/ assets / font / – 用于字体文件。 （大多数情况下，你可以去谷歌字体search可用的字体。）
/ assets / images / – 对于图像文件。
/ assets / scripts /或/ assets / js / – 用于JavaScript文件。
/资产/媒体/ – video和杂项。 文件。
您也可以用“资源”或“文件”文件夹名称replace“资产”，并保留其子文件夹的名称。 那么像这样的命令文件夹结构并不是非常重要的唯一重要的是，你只需要通过它的格式来安排你的文件。 比如为CSS文件创build文件夹“/ css /”或者为图像文件创build“/ images /”。
