一些HTML代码的编写风格建议小结

省略资源文件的协议

建议省略掉图片, 媒体文件, 样式和脚本 URL 中的协议部分 (http:, https:), 省略掉协议部分后, 资源文件将继承页面 URL 的协议. 不但可以防止内容混用的问题, 还可以减小页面的尺寸. 比如: 引用一个 JavaScript 文件可以用下面建议的方式来写.

为什么 h4, h5, h6 标签很少用到?

标题标签包括 h1 到 h6, 我们常用 h1, h2, h3, 但极少用到 h4, h5 和 h6.

在一个合理语义化, 敢于裸奔 (不使用 CSS 进行布局) 的网站里面, 标题标签除了语义化, 还带有一些样式作用. 但在 CSS 普及的今天, 用 h1 和 h6 其实没有太大区别, 反正外观也能随便套.

作为标题标签, 有更牛逼的功能, 标题元素意味着页面上高权值的关键词, 所以 h1, h2 和 h3 被频繁利用来为关键词加权. 而 h4, h5 和 h6 的权值并不高, 甚至比不上 strong 和 em, 所以很少被用到. 估计他们权限层次如下:

h1 > h2 > h3 > strong > em > h4 > h5 > h6

什么时候使用 thead, tbody 或 tfoot?

我本来认为 thead 作为表头用来放表格标题单元, 如 th; 而 tbody 是放表格内容, tfoot 是表格说明. 其实我的理解不太正确, 这几个标签其实是可有可无的.

因为浏览器一般需要整个表格下载完才开始显示, 在以 table 为布局的时代影响用户阅读. 所以这几个标签是用来将表格划分成多个表格部分, 下载完成部分即可显示. 另外, 也为了打印长表格时的时候表头和表尾可以在每一页出现.

省略掉可选的标签

用过 Dreamwave 的同学应该有印象, 当你创建一个 HTML 文件, 默认有代码如下.

我们会将 title, 外部 CSS 和 JavaScript 引用放在 head 区域, 在页面上展示的内容放在 body 里面, 但其实 html, head 和 body 都是可省略的标签.

将这些可选标签删除之后, 看起来很怪, 但页面显示正常, W3C 检测也能通过. 我已经在博客上这样处理了. 但有一点需要注意的, 如果你希望用 XHTML 编写页面, 那么请保留 html 标签, 因为你仍需要下面这句代码作为声明.

b 标签和 i 标签

很多人以为 b 标签和 i 标签的命运和 u 标签一样, 被 W3C 归类为 "不推荐使用标签". 但 HTML5 规范中, 这两个标签还是推荐使用的. 这一点我一直清楚, 还跟朋友为这事争执过. 但我一直不明白 HTML5 中如何定义它们.

hr 标签