谈谈你对HTML语义化的理解。

1.什么是HTML语义化？

基本上都是围绕着几个主要的标签，像标题（h1-h6），列表（li），强调（strong em）等。

根据内容的语义化（内容结构化），选择合适的标签（代码语义化），便于开发者阅读和写出更优雅的代码的同时，让浏览器的爬虫和机器很好的解析。

2.为什么要语义化？

为了在没有css的情况下，页面也能呈现出很好的内容结构和代码结构。
为了提升用户体验，如：title，alt用于解释名词或解释图片信息，lable标签的活用。
有利于和搜索引擎建立良好的沟通。
方便其他设备解析（如屏幕阅读器，盲人阅读器，移动设备），以意义的方式来渲染网页。
便于团队的开发和维护，语义化更具有可读性，是下一步网页的重要动向，遵循W3C标准的团队都遵循这个标准，可以减少差异化。

3.写HTML代码是应注意什么？

尽可能少的使用无语义的标签div和span
在语义不明显时，既可以使用div或者时，尽量用p，因为p在默认情况下有上下间距，对兼容特殊终端有利。
不要使用纯样式的标签，如：b，font，u等，改用css设置。
需要强调的文本，可以包含在strong（加粗）或者em（斜体）标签中（浏览器预设样式，能用css样式就不用它们）
使用表格，标题要用caption，表头用thead，主体部分用tbody包围，尾部要tfoot包围。表头和一般单元格要区分开，表头用th，单元格用td
表单域要用fieldset标签包起来，并用legend标签说明标签的用途。
每个input标签对应的文本框都需要使用label标签，并且通过为input设置id属性，在label标签中设置for=someID来说明文本和相对应的input关联起来

简单来说就是：用正确的标签做正确的事情。html语义化让页面的内容结构化，结构更清晰，便于对浏览器，搜索引擎解析；即使在没有css样式的情况下，也以一种文档格式显示，并且是容易阅读的；搜索引擎的爬虫也依赖于HTML标记来确定上下文和各个关键字的权重，利于SEO；使阅读源代码的人对网站更容易将网站分块，便于阅读维护理解。

巴特西

谈谈你对HTML语义化的理解。

最新文章

热门文章