zoukankan      html  css  js  c++  java
  • h5 语义话标签的意义

    使用语义话标签的意义
      语义类标签对开发者更为友好,使用语义类标签增强了可读性,即便是在没有 CSS 的时 候,开发者也能够清晰地看出网页的结构,也更为便于团队的开发和维护。
      除了对人类友好之外,语义类标签也十分适宜机器阅读。它的文字表现力丰富,更适合 搜索引擎检索(SEO),也可以让搜索引擎爬虫更好地获取到更多有效信息,有效提升
      网页的搜索量,并且语义类还可以支持读屏软件,根据文章可以自动生成目录等等。

    对于语义标签的态度是:“用对”比“不用”好,“不用”比“用错”好。

    常用标签集合:

       header: 通常出现在前部,表示导航或者介绍性的内容
        nav:    定义导航链接的部分
        footer: 通常出现在尾部,包含一些作者信息、相关链接、版权信息等。
        section: 代表某一个区域,分区,页面或者文档的一部分区域,有独立的内容,但结构相近,就可以用section,范围比div大,语义比div更强,可以包含header、h1-h6……凸显语义的标签
        hgroup: 用于对网页或区段(section)的标题进行组合
        eg:
            <section>
                <hgroup>
                    <h1>this is h1 of my article</h1>
                    <h2>this is h2 of my article</h2>
                </hgroup>
                <p>The rest of the content...</p>
            </section>
        article:定义外部的内容。比如来自一个外部的新闻提供者的一篇新的文章、或者来自 blog 的文本、或用户评论、或者是来自论坛的文本。亦或是来自其他外部源内容。
        aside:  表示跟文章主体不那么相关的部分,它可能包含导航、广告等工具性质的内容,很容易被理解为侧边栏,实际上二者是包含关系,侧边栏是 aside,aside 不一定是 侧边栏。
        time:    定义日期或时间,或者两者。
        video:   定义视频,比如电影片段或其他视频流.
        canvas:  定义图形,比如图表和其他图像。这个 HTML 元素是为了客户端矢量图形而设计的。它自己没有行为,但却把一个绘图 API 展现给客户端 JavaScript 以使脚本能够把想绘制的东西都绘制到一块画布上。
        audio:   定义声音,比如音乐或其他音频流。
        address:表示“文章(作者)的联系方式“
        datalist:定义可选数据的列表。与 input 元素配合使用,就可以制作出输入值的下拉列表。
        details: 用于描述文档或文档某个部分的细节
        summary: 包含 details 元素的标题,”details” 元素用于描述有关文档或文档片段的详细信息。”summary” 元素应该是 “details” 元素的第一个子元素
  • 相关阅读:
    MVC架构模式
    Promise对象
    Trick:如何去掉html标签点击时的蓝色边框
    动态REM
    Ajax 详解及CORS
    数据预测之BP神经网络具体应用以及matlab代码
    Pearson相关系数
    Java linux lame .wav音频转mp3 并且压缩
    JavaWeb向浏览器返回一个音频流
    Tomcat 运行 idea 编译好的 .class JavaWeb 项目
  • 原文地址:https://www.cnblogs.com/ralapgao/p/10823728.html
Copyright © 2011-2022 走看看