语义化标签的好处
可以创建清晰明确的网页结构,减少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> | 定义菜单列表 | 列出表单控件 |