谷歌前端编码指导

原文见

目的：加强团队协作、提高代码质量、最大化浏览设备对网页的支持。

通用（样式）规则

协议：从嵌入资源URL中省略协议

从URLs中省略协议部分（

http:

，

https:

），除非该资源不是通过前面提到的两种协议请求的。

省略协议部分：使URL以相对地址的方式获得，这样可以避免内容混合，并且可以使文件更小（URL缩短）。

通用格式化代码规则

代码缩进，每次使用两个空格。在缩进时不要使用Tab键或其他个数（非2个）空格缩进。

统一使用小写字母，

CDATA

例外。

删除多余空格，尾部的空格都是没有必要的，并且导致不一致的异同。

Meta规则

编码：使用UTF-8（no BOM）。建议使用

注释：只要需要，在允许的地方添加适当注释。

待完成事项:用

TODO

（中文：待完成）标注未完成工作。

HTML代码规则

文档声明：使用

文档声明。

使用正确的HTML元素（标签）。可以通过W3C HTML校验器进行检测。

注意HTML元素的语义。

提供多媒体元素的候选方案。比如：

将Web前端开发的结构、表现、行为进行严格分离。

不要使用实体引用（比如：&、<）。因为使用UTF-8，它们可以直接编码。

省略掉可选标签。（支持HTML5浏览器）

省略掉CSS、JavaScript文件的类型属性。比如：

HTML规则

每一个block、list、table元素另起一行，并且对子元素进行缩进。

HTML元素属性值使用双引号。

CSS规则

使用合法的CSS规则。可以使用W3C CSS校验器进行检测。

使用有意义、通用的ID、Class名。

ID、Class尽可能进行缩写。

避免元素名和选择器（ID、Class）连接为一个选择一使用。导致网页性能下降。

使用简短CSS属性，这样可读性强、更高效。

属性值为0时，省略属性单位。

省略前导0.

如果可能请使用3个字符的十六进制值。

大项目使用给选择器添加前缀。比如：

.adw-help {} /* AdWords */

添加选择器的ID、Class使用连字符（-）连接。

避免使用Hack。

CSS格式化规则

使用字母声明，并且按照字母顺序排列。

对块内容进行缩进。

每个申明后面使用分号

每个键值对之间，值前添加一个冒号。

每个选择器、样式单独一行。

每个规则间间隔一行。

CSS中值使用单引号，url不使用引号。

CSS Meta 规则

按组添加注释、组织样式。