« 回到主页
HTML 语义化
1 什么是HTML语义化？
- 内容语义化：内容的结构化。
- 代码语义化：选择合适的标签。
2 为什么要语义化？
- 在没有CSS的情况下，页面也能呈现出很好的内容结构、代码结构。
- 更好的用户体验，如title、alt用于解释名词或图片信息以及label标签的使用。
- 有利于爬虫抓取更多的有效信息：爬虫依赖于标签来确定上下文和各个关键字的权重。
- 方便屏幕阅读器、盲人阅读器、移动设备等其他设备渲染网页。屏幕阅读器、盲人阅读器会完全根据标记来“读”网页，如果使用含语义的标记，屏幕阅读器、盲人阅读器会根据标签来判断网页的内容，而不是一个字母一个字母的拼写出来；PDA、手机等设备可能无法像PC浏览器一样来渲染网页，因为它们对CSS的支持较弱，使用语义标记可以确保它们以一种有意义的方式来渲染网页。
- 提高可读性，减少差异化的东西，提高开发效率，甚至实现模块化开发，便于团队开发和维护。
3 写HTML代码时应注意什么？
- 少使用无语义的标签，如div和span。
- 可以使用div或p时，尽量用p，因为p在默认情况下有上下间距。
- 不要使用纯样式标签，如b、font、u等，用CSS设置。
- 需要强调的文本，可包含在strong（加粗，不要用b）或em（斜体。不要用i）标签中，但尽量用CSS。
- 使用表格时，标题用caption，表头用thead，主体用tbody，尾部用tfoot包围，表头和一般单元格要区分开，表头用th，单元格用td。
- 表单域要用fieldset标签包起来，并用legend标签说明表单的用途。
- 每个input标签对应的说明文本都要使用label标签，并通过为input设置id属性，在lable标签中设置for=id来让说明文本和对应的input关联起来。
« 回到主页