H5新特征-新的语义标签

系统管理员 2023-10-10 15:58 27阅读 0赞

### H5新特征 ###

#### 何为语义标签 ####

语义标签 -> 标签可以看出其作用

例如 img table form

#### **新的标签** ####

新的标签包括:

<table> 
 <thead> 
  <tr> 
   <th>标签</th> 
   <th>语义</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>article</td> 
   <td>定义文章</td> 
  </tr> 
  <tr> 
   <td>aside</td> 
   <td>定义页面内容以外的内容</td> 
  </tr> 
  <tr> 
   <td>details</td> 
   <td>定义用户能够查看或隐藏的额外细节</td> 
  </tr> 
  <tr> 
   <td>figcaption</td> 
   <td>定义 figure 元素的标题</td> 
  </tr> 
  <tr> 
   <td>figure</td> 
   <td>规定自包含内容，比如图示、图表、照片、代码清单等</td> 
  </tr> 
  <tr> 
   <td>footer</td> 
   <td>定义文档或节的页脚</td> 
  </tr> 
  <tr> 
   <td>header</td> 
   <td>规定文档或节的页眉</td> 
  </tr> 
  <tr> 
   <td>main</td> 
   <td>规定文档的主内容</td> 
  </tr> 
  <tr> 
   <td>mark</td> 
   <td>定义重要的或强调的文本</td> 
  </tr> 
  <tr> 
   <td>nav</td> 
   <td>定义导航链接</td> 
  </tr> 
  <tr> 
   <td>section</td> 
   <td>定义文档中的节</td> 
  </tr> 
  <tr> 
   <td>summary</td> 
   <td>定义 details 元素的可见标题</td> 
  </tr> 
  <tr> 
   <td>time</td> 
   <td>定义日期/时间</td> 
  </tr> 
 </tbody> 
</table>

#### 好处 ####

*  代码结构得到了优化，使结构完整、清晰，更加方便阅读和理解
 *  有利于搜索引擎的优化
 *  爬虫依赖标签确定关键字的权重，可以帮助爬虫爬出更多有效信息

#### 怎么语义化 ####

*  少用无语义的标签, 例如标签 div、span
 *  用对有语义的标签 可参上面的新的 -> 新的标签

#### 感谢 ####

Photo by [mos design][] on [Unsplash][]

[Semantics（语义） - 术语表 | MDN][Semantics_ - _ _ MDN]

[HTML5 语义元素][HTML5]

[什么是 HTML 语义化，有什么好处 - 肥晨 - 博客园][HTML _ - _ -]

[什么是语义化标签，常见的语义化标签介绍\_.慢慢亦漫漫的博客-CSDN博客\_语义化标签  
][._-CSDN_]

[HTML5新增了哪些特性？ - 掘金][HTML5_ -]

[mos design]: https://unsplash.com/@mosdesign?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText
[Unsplash]: https://unsplash.com/?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText
[Semantics_ - _ _ MDN]: https://developer.mozilla.org/zh-CN/docs/Glossary/Semantics
[HTML5]: https://www.w3school.com.cn/html/html5_semantic_elements.asp
[HTML _ - _ -]: https://www.cnblogs.com/naitang/p/15737057.html
[._-CSDN_]: https://blog.csdn.net/weixin_43183219/article/details/122392412
[HTML5_ -]: https://juejin.cn/post/6988039257587712008