语义化标签的好处
可以创建清晰明确的网页结构，减少css的代码量，便于搜索引擎的抓取，至于ARIA属于另一个方面
语义化标签
| 标签 | 语义 | 内容 |
|---|---|---|
| <header> | “网页”或“section”的页眉 | h1-h6，hgroup，标题，目录，搜索框，nav，logo |
| <footer> | “网页”或“section”的页脚 | 基本信息 |
| <hgroup> | 代表“网页”或“section”的标题 | 元素有多个层级时，可以将h1到h6元素放在其内 |
| <nav> | 导航链接区域 | 定义页面的主要导航部分 |
| <aside> | 在article内表示主要内容的附属信息 article之外使用作为页面或站点全局的附属信息部分 |
当前文章有关的相关资料、标签、名次解释等 日志串连，其他组的导航，甚至广告 |
| <section> | 文档中的“节”或“段” | |
| <title> | 页面标题 | 搜索引擎会将title作为判断页面主要内容的指标 |
| <h1-6> | 分级标题 | 标题与搜索词匹配，就会有高权重 |
| <main> | 页面主要内容 | 一个页面只能使用一次 |
| <article> | 代表一个在文档，页面或者网站中自成一体的内容 (帖子，文章，评论，小工具) |
标题，header，footer |
<small> |
指定细则，输入免责声明、注解、署名、版权 | |
<strong> |
定义重要的文本 | |
<em> |
呈现为被强调的文本 | |
| <mark> | 突出显示文本 | |
| <figure> | 与文档流无关的图片布局 | |
| <figcaption> | figure的标题 | |
<cite> |
指明引用或者参考 | 如图书的标题等的名称，报纸、或法律文件等 |
| <blockquoto> | 定义块引用 | |
| <time> | 标记时间 | |
| <abbr> | 通过对缩写进行标记 | |
| <dfn> | 定义一个定义项目 | |
<code> |
定义计算机代码文本 | |
| <samp> | 定义样本文本 | |
| <address> | 作者、相关人士或组织的联系信息 | 放在footer里。不能包含文档等其他内容 |
| <del> | 已经删除的内容 | |
| <ins> | 新插入的内容 | |
| <meter> | 表示分数的值或者已知范围的测量结果 | |
| <progress> | 完成进度 | |
| <menu> | 定义菜单列表 | 列出表单控件 |
网友评论