html语义化

html语义化

根据内容的结构选择合适的标签

优点

增加代码可读性，结构清晰，便于开发和维护对机器友好，文字表现力丰富，有利于SEO。SEO(Search Engine Optimization)是搜索引擎优化，为了让用

户在搜索和网站相关的关键词的时候，可以使网站在搜索引擎的排名尽量靠前，从而增加流量。

方便设备解析（如盲人阅读器等），可用于智能分析在没有 CSS 样式下，页面也能呈现出很好地内容结构、代码结构

常见的语义化标签

title：页面主体内容 header：页眉通常包括网站标志、主导航、全站链接以及搜索框。

nav：标记导航，仅对文档中重要的链接群使用。

section：定义文档中的节（section、区段）。比如章节、页眉、页脚或文档中的其他部分。

main，帮助到搜索引擎以及搜索工程师找到网站的主要内容，本身并不承载特殊的功能和意义。

article：定义外部的内容，其中的内容独立于文档的其余部分。

aside：定义其所处内容之外的内容。如侧栏、文章的一组链接、广告、友情链接、相关产品列表等。

footer：页脚，只有当父级是body时，才是整个页面的页脚。

address：作者、相关人士或组织的联系信息（电子邮件地址、指向联系信息页的链接）。

meta标签

meta标签用来描述一个HTML网页文档的属性，例如作者、日期和时间、网页描述、关键词、页面刷新等。

meta标签的作用有：搜索引擎优化（SEO），定义页面使用语言，自动刷新并指向新的页面，实现网页转换时的动态效果，控制页面缓冲，网页定级评价，控制网页显示的窗口等。

meta分类

1）页面描述信息(NAME)：常用的选项有Keywords(关键字)，description(网站内容描述)，author(作者)， robots(机器人向导)等。

2）HTTP标题信息(HTTP-EQUIV)：可用于代替name项，常用的选项有Expires(期限)，Pragma(cache模式)， Refresh(刷新)，Set-Cookie(cookie设定)，Window-target(显示窗口的设定)，content-Type(显示字符集的设定)

等。

3）content项：根据name项或http-equiv项的定义来决定此项填写什么样的字符串。

HTML5特性

新增

新的选择器 document.querySelector、document.querySelectorAll 媒体播放的 video 和 audio 标签