acronymabbrappletobjectbstrongdirulstrikedelbasefontbigcenterfontisindexttu
```
### 2.2 属性大小写
**【强制】**属性名应该小写，不允许大写或大小写混合；
示例：
```html
`元素和`
```
### 3.4 避免过时标签
**【强制】**不允许使用过时的旧标签，请使用新标签或者CSS代替：
请参详：http://www.w3schools.com/tags/
**[[⬆]](#)**
## 4 head设定
### 4.1 doctype
**【强制】**doctype使用 HTML5 的 doctype 来启用标准模式。
其中 `doctype` 建议使用大写的 DOCTYPE； [关于doctype该使用大写还是小写的讨论](http://stackoverflow.com/questions/7020961/uppercase-or-lowercase-doctype)
示例：
```html
```
### 4.2 页面编码
**【强制】**页面必须明确指定字符编码，让浏览器快速确定适合网页内容的渲染方式。指定字符编码的 meta 必须是 head 的第一个直接子元素。建议使用无 BOM 的 UTF-8 编码；
示例：
```html
```
### 4.3 兼容模式
**【建议】**PC端启用 IE Edge 模式，并针对360浏览器启用webkit渲染模式；
示例：
```html
```
### 4.4 引入CSS
**【强制】**引入 CSS 时必须指明 rel="stylesheet"；
建议在 head 中引入页面需要的所有 CSS 资源，因为在页面渲染的过程中，新的CSS可能导致元素的样式重新计算和绘制，页面闪烁；
示例：
```html
```
### 4.5 引入JavaScript
**【建议】**JavaScript应当放在页面尾部；出于性能方面的考虑，如非必要，请遵守此条建议；
示例：
```html
```
### 4.6 favicon
**【强制】**保证 `favicon` 可访问；
在未指定 favicon 时，大多数浏览器会请求 Web Server 根目录下的 favicon.ico 。为了保证favicon可访问，避免404，必须遵循以下两种方法之一：
1. 在 Web Server 根目录放置 favicon.ico 文件;
2. 使用 link 指定 favicon;
示例：
```html
```
#### 附：工作流中默认的PC端head设定
```html
```
#### 附：工作流中默认的移动端head设定
```html
```
注意：当该项目有相关的app在app store中，设置meta`apple-itunes-app`，如上面最后一条，并填上对应的`app-id`。详细请看：[Promoting Apps with Smart App Banners](https://developer.apple.com/library/ios/documentation/AppleApplications/Reference/SafariWebContent/PromotingAppswithAppBanners/PromotingAppswithAppBanners.html)
更详细的meta属性设置可以参详：https://github.com/hzlzh/cool-head
**[[⬆]](#)**
## 5 图片
**【强制】**禁止 `img` 的 `src` 取值为空；延迟加载的图片也要增加默认的 `src`；
`src` 取值为空，会导致部分浏览器重新加载一次当前页面，参考 [Yahoo performance rules](https://developer.yahoo.com/performance/rules.html#emptysrc)
**【建议】**为重要图片添加 `alt` 属性；
可以提高图片加载失败时的用户体验。
**【建议】**添加 `width` 和 `height` 属性，以避免页面抖动；
**【建议】**有下载需求或者预期会灵活变动的图片采用 `img` 标签实现，无下载需求的图片采用 CSS 背景图实现；
* 用户头像、用户产生的图片等有潜在下载需求的图片，以 img 形式实现，能方便用户下载；
* 无下载需求的图片，比如：icon、背景、代码使用的图片等，尽可能采用 css 背景图实现。
**[[⬆]](#)**
## 6 表单
**【强制】**有文本标题的控件必须使用 `label` 标签将其与其标题相关联；
有两种方式：
1. 将控件置于 label 内;
2. label 的 for 属性指向控件的 id。
推荐使用第一种，减少不必要的 id。如果 DOM 结构不允许直接嵌套，则应使用第二种。
示例：
```html
```
**【建议】**尽量不要使用按钮类元素的 name 属性；
由于浏览器兼容性问题，使用按钮的 name 属性会带来许多难以发现的问题。具体情况可参考 [此文](http://w3help.org/zh-cn/causes/CM2001)；
**【建议】**在针对移动设备开发的页面时，根据内容类型指定输入框的 `type` 属性；
根据内容类型指定输入框类型，能获得能友好的输入体验。
示例：
```html
```
**[[⬆]](#)**
## 7 注释
**【建议】**对**超过10行**的页面模块进行注释, 以降低开发人员的嵌套成本和后期的维护成本。建议使用结尾注释方式，例如：
当模块代码量较少时，可以省略 `start`。
```html
acronymabbrappletobjectbstrongdirulstrikedelbasefontbigcenterfontisindexttu