html的元素、属性和属性值有特定的语义(semantic)。这些语义有助于让浏览器、搜索引擎等html处理者在不同的上下文中展现出一致的文档结构。
- 优势
- 代码结构清晰,方便阅读,有利于团队合作开发。
- 方便其他设备解析(如屏幕阅读器、盲人阅读器、移动设备)以语义的方式来渲染网页。
- 有利于搜索引擎优化(SEO)。
- 最佳实践
-
titile
提升搜索引擎排名,搜索引擎会将title作为判断页面主要内容的指标,有效的title应包含与内容紧密相关的关键字。 - 在语义不明显时,既可以使用
div
或者p
时,尽量用p
,因为p
在默认情况下有上下间距,对兼容特殊终端有利; - 强调文本使用
strong
(不要用b
)或em
(不要用i
); - 使用表格时,标题要用
caption
,表头用thead
,主体部分用tbody
包围,尾部用tfoot
包围。表头用th
,单元格用td
; - 表单域要用
fieldset
标签包起来,并用legend
标签说明表单的用途; - 每个
input
标签对应的说明文本都需要使用label
标签,并且通过为input
设置id
属性,在lable
标签中设置for=someld
来让说明文本和相对应的input
关联起来。
-
网友评论