第三十天：前端开发的规范之html编码规范

这个总结，首先感谢一下我的同事，能认真的指教我书写的不规范之处，和对我自己遇到的问题无私的帮助。

1.原则

1.1规范,保证您的代码规范，趋html5，远xhtnl保证结构表现行为的相互分离

1.2简洁,保证代码的最简化，避免多余的空，空行，保持代码的语义化，尽量使用具有语义的元素，避免使用样式属性和行为。任何时候都要尽量简单，尽量少的元素解决问题。

1.3实用,遵循标准,但是不能以牺牲实用性为代价

1.4忠诚,选择一套规范，然后始终遵循，不管代码多少人参与，都始终看去看像一个人写的一样

2.语法

2.1小写：html标签，htnl属性全部小写

2.2嵌套：所有元素必须正确嵌套

2.3闭合：双标签必须闭合，单标签不闭合

3.注释

3.1详尽注释，解释代码解决问题，解决思路，是否为新方案等

3.2模块注释，github建议不适用模块结束注释，太丑了。。。。

3.3待办注释，todo

4.属性

4.1双引号属性值，不要使用单引号。

4.2省略type属性，使用style,link,script,不用指定type属性，因为text/javascript分别是他们的默认值

4.3省略boolean属性值，boolean属性不用添加取值，disabled,checked,selected等

4.4省略url类属性资源协议头

4.5属性顺序，html属性应该按照特定的顺序出现，以保证易读性。

4.6多媒体元素添加替代属性，图像增加alt属性，音视频增加替代文字。

4.7不手动设置tabindex属性，让浏览器自动设置

5.元素

5.1避免多余的标签

5.2避免js生成标签

5.3段落文字应用<p>避免使用<br>

5.4列表项放<ul>,<ol><dl>

5.5<input>使用for属性绑定<label>

5.6使用<label>标签包裹radio或者checkbox和它们的文字,不用再使用for属性

5.7使用单选复选替代下拉菜单

5.8form button应该制定type类型

5.9首要的表单按钮首先出现在dom中，尤其是多个提交按钮的场合

5.10有效的使用<thead><tfoot><tbody><th>，可以把<tfoot>放<tbody>前提高加载速度

6.格式

6.1soft tab

6.2嵌套缩进

6.3删除行位空格

6.4块元素，列表元素，表格元素都放在新行

6.5inline元素视情况换行

6.6努力保持每行长度小于80行，如果太长可以换行