关于HTML语义化

标签的语义

通过标签判断内容语义，例如根据h1标签判断出内容是标题，
根据p标签判断内容是段落、< input >标签是输入框等；

判断标签是否语义化

去掉样式，看网页结构是否组织良好有序，是否仍然有很好的可读性；

为什么标签要语义化

1、搜索引擎友好；
2、更容易让屏幕阅读器读出网页内容；
3、去掉或样式丢失的时候能让页面呈现清晰的结构；
4、便于团队开发和维护；

如何使标签更具语义化

标题内容型
标题使用h标签而不是div class=h2，段落使用p标签，锚点使用a标签；
表单
分组表单用 fieldset 标签包起来，并用 legend 标签来说明的用途；
每个 input 标签对应的说明文本都需要使用 label 标签，并且通过 input 设置id属性，在<label>标签中设置“for=someId”来让说明文本和响应的<input>关联起来；
表格
表格标题要使用<caption>,表头使用<thead>包围，尾部使用 tfoot 包围，表头和一般单元格要区分开，表头用 th 一般单元格用 td；
应注意的问题

• 尽可能减少使用无语义标签div和span；
• 语义不明显，可以用p也可以使用div的情况下，尽量用p；
• 不要使用纯样式标签，例如：b、font 和 u等，改用CSS设置；
• 使用HTML5的结构元素（HTML5新特性）。