精华内容
下载资源
问答
  • web语义化及其好处

    千次阅读 2017-12-12 13:39:47
    Web语义化是指使用语义恰当的标签,使页面有良好的结构,页面元素有含义,能够让人和搜索引擎都容易理解。如果可以在合适的位置使用恰当的标签,那么写出来的页面语义明确,结构清晰,搜索引擎也可以认出哪些是页面...

    Web语义化是指使用语义恰当的标签,使页面有良好的结构,页面元素有含义,能够让人和搜索引擎都容易理解。如果可以在合适的位置使用恰当的标签,那么写出来的页面语义明确,结构清晰,搜索引擎也可以认出哪些是页面重要内容,予以较高的权值。

    web语义化的好处

    1. 去掉或者丢失样式的时候能够让页面呈现出清晰的结构
    2. 有利于SEO:和搜索引擎建立良好沟通,有助于爬虫抓取更多的有效信息:爬虫依赖于标签来确定上下文和各个关键字的权重;
    3. 方便其他设备解析(如屏幕阅读器、盲人阅读器、移动设备)以意义的方式来渲染网页;
    4. 便于团队开发和维护,语义化更具可读性,是下一步吧网页的重要动向,遵循W3C标准的团队都遵循这个标准,可以减少差异化。

    展开全文
  • Web 语义化

    2021-01-20 14:23:21
    Web 语义化 单词语义化表示了它的意义。 事物的语义化意味着事物。 Web 语义化 = Web的意义。 什么是 Web 语义化? 什么是语义化?其实简单说来就是让机器可以读懂内容。 甲壳虫乐队是一个来自利物浦受欢迎的...
  • 谈谈你对web语义化理解

    千次阅读 2016-03-11 13:30:22
    学术届将web语义化称为Web3.0的核心,目标是将当前的网页提升为计算机能够“理解”和处理的网页。 核心思想是标注网页对象使其对应本体中的实体,并通过逻辑等手段进行自动推理。 作用在于更好整合网络上的资源,使...
    学术届将web语义化称为Web3.0的核心,目标是将当前的网页提升为计算机能够“理解”和处理的网页。 核心思想是标注网页对象使其对应本体中的实体,并通过逻辑等手段进行自动推理。 作用在于更好整合网络上的资源,使计算机能够处理分布于不同位置的信息,自动产生问题的解决方案


    简言之,web语义化的目的是提高计算机和人对web代码的可读性。

    网上的解释很多,个人总结分三个阶段比较容易理解。
    1、原始的一些有实际含义的标签定义。浏览器和W3C组织推出的如h1~h6、thead、ul、ol的HTML标签,用于在Web页面中组织对应的内容,如网页标题、表头、无序、有序列表,以达到更方便的协作及传播互联网内容。搜索引擎很好的利用了这些语义化标签抓取内容,又鉴于搜索引擎的巨大流量推荐,Web前端不得不考虑SEO,从而两者实现有益的循环,共同推进着语义化标签的使用。

    2、前端开发人员自定义的标签。但Web的发展超乎想象,起初定义的HTML语义化标签,不足以实现对Web页面各个部分的功能或位置描述,所以Web前端人员利用HTML标签的id和class属性,进一步对HTML标签进行描述,如对页脚HTML标签添加如id="footer"或者class="footer"的属性(值),以“无声”的方式在不同的前端程序员或者前后端程序员间实现交流。

    3、在第二步的推动下结合新技术出现的一些标签。W3C组织意识到了之前HTML版本的不足,推出的HTML5进一步推进了Web语义化发展,采用了诸如footer、section等语义化标签,弥补了采用id="footer"或者class="footer"形式的不足,以更好的推动Web的发展。 正所谓:世上本没有路,走的人多了,也便成了路。



    参考链接:https://www.zhihu.com/question/20455165/answer/15183794

    链接:https://www.zhihu.com/question/20455165/answer/15183203

    展开全文
  • web语义化理解

    2020-04-23 15:44:50
    Web语义化是指使用恰当语义的html标签、class类名等内容,让页面具有良好的结构与含义,从而让人和机器都能快速理解网页内容。语义化的web页面一方面可以让机器在更少的人类干预情况下收集并研究网页的信息,从而...

    Web语义化是指使用恰当语义的html标签、class类名等内容,让页面具有良好的结构与含义,从而让人和机器都能快速理解网页内容。语义化的web页面一方面可以让机器在更少的人类干预情况下收集并研究网页的信息,从而可以读懂网页的内容,然后将收集汇总的信息进行分析,结果为人类所用;另一方面它可以让开发人员读懂结构和用户以及屏幕阅读器(如果访客有视障)能够读懂内容。
    语义化的好处:第一,有利于SE0搜索引擎搜索。
    第二,团队开发中,良好的语义化标签,可以减少很多差异化,减少成员间沟通成本,方便开发和后期维护,利于实现模块化开发。
    第三,利于屏幕阅读器进行无障碍阅读页面内容。

    展开全文
  • 什么是 web 语义化,有什么好处

    千次阅读 多人点赞 2020-08-25 15:05:22
    web 语义化是指通过 HTML 标记表示页面包含的信息,包含了 HTML 标签的语义化和 css 命名的语义化。 HTML 标签的语义化是指:通过使用包含语义的标签(如 h1-h6)恰当地表示文档结构

     什么是 web 语义化,有什么好处

    web 语义化是指通过 HTML 标记表示页面包含的信息,包含了 HTML 标签的语义化和 css 命名的语义化。

    HTML 标签的语义化是指:通过使用包含语义的标签(如 h1-h6)恰当地表示文档结构

    css 命名的语义化是指:为 html 标签添加有意义的 class,id 补充未表达的语义,如[Microformat](http://en.wikipedia.org/wiki/Microformats)通过添加符合规则的 class 描述信息

    为什么需要语义化:

    - 去掉样式后页面呈现清晰的结构

    - 盲人使用读屏器更好地阅读

    - 搜索引擎更好地理解页面,有利于收录

    - 便团队项目的可持续运作及维护

    以下内容转自  https://blog.csdn.net/qq_38128179/article/details/80811339     @Demi博主原创文章

    什么是语义元素?

    语义是指对一个词或者句子含义的正确解释。很多html标签也具有语义的意义,也就是说元素本身传达了关于标签所包含内容类型的一些信息。例如,当浏览器解析到<h1></h1>标签时,它将该标签解释为包含这一块内容的最重要的标题。h1标签的语义就是用它来标识特定网页或部分最重要的标题。

    为什么要语义化?

    • 代码结构: 使页面没有css的情况下,也能够呈现出很好的内容结构
    • 有利于SEO: 爬虫依赖标签来确定关键字的权重,因此可以和搜索引擎建立良好的沟通,帮助爬虫抓取更多的有效信息
    • 提升用户体验: 例如title、alt可以用于解释名称或者解释图片信息,以及label标签的灵活运用。
    • 便于团队开发和维护: 语义化使得代码更具有可读性,让其他开发人员更加理解你的html结构,减少差异化。
    • 方便其他设备解析: 如屏幕阅读器、盲人阅读器、移动设备等,以有意义的方式来渲染网页。

    HTML5常用的语义元素

    HTML5提供了新的语义元素来定义网页的不同部分,它们被称为“切片元素”,如图所示  

                                 

    大约有100多个HTML语义元素可供选择,以下是常用的语义元素

    结构体文本一致
    • header
    • h1
    • h2
    • h3
    • nav
    • footer
    • article
    • section
    • p
    • ul
    • ol
    • li
    • blockquote
    • a
    • strong
    • em
    • q
    • abbr
    • small

    <h1>~<h6>元素

    定义页面的标题,h1元素具有最高等级,h6元素具有最低的等级

    <header>元素

    用于定义页面的介绍展示区域,通常包括网站logo、主导航、全站链接以及搜索框。也适合对页面内部一组介绍性或导航性内容进行标记。

    <header>
    
        <h1>HTML Reference</h1>
    
        <nav>
    
            <a>Home</a>
    
            <a>About</a>
    
            <a>Contact</a>
    
         </nav>
    
    </header>

    <nav>元素

    定义页面的导航链接部分区域,不是所有的链接都需要包含在<nav>中,除了页脚再次显示顶级全局导航、或者包含招聘信息等重要链接。

    <nav>
    
        <a>Home</a>
    
        <a>About</a>
    
        <a>Contact</a>
    
    </nav>

    <main>元素

    定义页面的主要内容,一个页面只能使用一次。如果是web应用,则包围其主要功能。

    <main>
    
        <h1>My blog test</h1>
    
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec viverra nec nulla vitae mollis.</p>
    
        <p>etc.</p>
    
    </main>

     <article>元素

    定义页面独立的内容,它可以有自己的header、footer、sections等,专注于单个主题的博客文章,报纸文章或网页文章。article可以嵌套article,只要里面的article与外面的是部分与整体的关系。

    <article>
    
        <header>
    
            <h3>
    
                <a href="">My blog post</a>
    
            </h3>
    
        </header>
    
        <section>
    
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec viverra nec nulla vitae mollis.
    
    </p>
    
        </section>
    
        <footer>
    
            <small>
    
                Posted on <time datetime="2017-04-29T19:00">Apr 29</time> in <a href="">Code</a>
    
            </small>
    
        </footer>
    
    </article>

    <section>元素

    元素用于标记文档的各个部分,例如长表单文章的章节或主要部分。

    <section>
    
        <h2>Section title</h2>
    
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec viverra nec nulla vitae mollis.</p>
    
    </section>

     <aside>元素

    定义与主要内容相关的内容块。通常显示为侧边栏。

    <aside>
    
         <h3>About the author</h3>
    
         <p>Frontend Designer from Bordeaux, currently working for Improbable in sunny London.</p>
    
    </aside>

    <footer>元素

    定义文档的底部区域,通常包含文档的作者,著作权信息,链接的使用条款,联系信息等

     
    <footer>
    
        COPYRIGHT@dingFY_Demi
    
    </footer>
    
    

     <small>元素

    为较不重要的内容定义小字体。如果被包围的字体已经是字体模型所支持的最小字号,那么 <small> 标签将不起任何作用。

    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec viverra nec nulla vitae mollis.</p>
    
    <small>Posted on <time datetime="2017-04-29T19:00">Apr 29</time> in <a href="/category/code">Code</a></small>

     <strong>元素

    把文本定义为语气更强的强调的内容,以表示内容的重要性。

    HTML should only be used to write 
    <strong>content</strong>, and keep CSS for 
    <strong>styling</strong> the web page.

     <em>元素

    标记内容着重点(大量用于提升段落文本语义),通常呈现为斜体文字。

    HTML should only be used to write <em>content</em>, and keep CSS for <em>styling</em> the web page.

     <blockquote>元素

    定义块引用,浏览器会在 blockquote 元素前后添加换行,并增加外边距。cite属性可用来规定引用的来源

    <blockquote cite="https://en.wikiquote.org/wiki/Marie_Curie">
    
    Here is a long quotation here is a long quotation here is a long quotation
    
    here is a long quotation here is a long quotation here is a long quotation
    
    here is a long quotation here is a long quotation here is a long quotation.
    
    </blockquote>

    <abbr>元素

    解释缩写词。使用title属性可提供全称,只在第一次出现时使用就ok。

    The <abbr title="People's Republic of China">PRC</abbr> was founded in 1949.

     

    展开全文
  • 如何理解Web语义化

    2019-01-09 22:25:00
    语义化:词必达意。其目的:在不依赖样式的情况下,文档结构依旧清晰;且人、搜索引擎通过读取HTML元素便能更好地理解HTML文档。其中,计算机是通过查询规则进行自动推理,从而更好地整合网络资源。 HTML5中,将...
  • 首先,在理解之前,我们需要先了解,什么是语义化。所谓语义化,简单来说,就是能够更清晰,更直观的理解语言所要表达的含义,所谓词必达意就是这个意思。那么在开发过程中的语义化指的是什么呢?就是能够让除了当事...
  • 什么是 web 语义化web 语义化是指通过 HTML 标记表示页面包含的信息,包含了 HTML 标签的语义化和 CSS 命名的语义化。 HTML 标签的语义化是指:通过使用包含语义的标签(如h1-h6)恰当地表示文档结构 。CSS 命名的...
  • Web语义化理解

    千次阅读 2016-04-14 21:25:05
    1.Web语义化的含义 Web语义化,其实是伴随着Web前端的不断发展和完善,进而提出的概念。在如今随着Web前端“结构-表现-行为”的原则不断细化,对Web语义化也提出了更高的要求。  何为Web语义化?个人认为,Web...
  • 什么是web语义化

    2019-12-23 17:11:29
    一、什么是web语义化web语义化是指,通过html标记表示页面包含的信息,包含了HTML标签的语义化和Css命名的语义化。 其中,html标签语义化是指,包含语义的标签恰当的表示文档结构,例如h1-h6 总结起来就是: ...
  • 理解web语义化

    2014-01-10 14:23:25
    后来随着学习的深入,web语义化这个名词不断地被提及。于是乎开始网上搜索这个关键字,很遗憾,可能是自己的功力不够,很难理解网友所说的语义化是什么东西。因为网友所说的东西很凌乱,不够具体,不够全面。都是...
  • web语义化是指使用恰当语义的html标签、class类名等,让页面具有良好的结构和含义,使得人和机器都能快速理解网页内容。 web语义化有什么意义 去掉或者丢失样式时可以让页面呈现清晰的结构; 有利于SEO,...
  • Web语义化

    2018-09-19 14:47:06
    什么是Web语义化?  如今互联网已经到了web3.0时代了,HTML语言在不断的进化并发挥着越来越重要的地位;而我们制作的网页也从当初的table表格嵌套发展到了div+css,这是进步的标志。然而我们似乎看到了一个不太好...
  • web语义化 在广义方面 在代码编译方面 页面布局和架构 布局 架构 开发人员会有一些困惑: 开发经理也会有一些困惑: 用户会对这些事情感到烦恼: 架构的本质是什么?其实也是一种管理。 常见的前端产品形态包括: ...
  • Web语义化,简而言之,就是用正确的标签做正确的事。 HTML语义化让页面内容更加结构化,结构更清晰,便于浏览器,搜索引擎解析。语义化让文档更易读,搜索引擎的爬虫也依赖HTML标记来确定上下文和各个关键字的权重...
  • web语义化

    2017-11-22 15:25:11
    WEB 语义化  ...web语义化是指使用语义恰当的标签,使页面有良好的结构,页面元素的含义,能够让人和搜索引擎都容易理解。如果可以合适的位置使用恰当的标签,那么写出来的页面语义明确,结构清晰,搜索引擎也
  • 谈谈对语义化理解

    千次阅读 2019-07-11 08:20:30
    谈谈对语义化理解语义化是指 用合理的HTML标记以及其特有的属性去格式化文档内容。如,标题用h1-h6, 段落用p标签,合理得给图片添加alt属性(alt属性是一个用于网页语言HTML和XHTML、为输出纯文字的参数...
  • 以前我真的没有怎么重视过搜索引擎,现在开始比较在意了,因为页面的很大一部分流量是来自搜索引擎的,要使页面尽可能地对搜索引擎友好,所以就要尽可能地使标签语义化。 以前以我对web开发的粗浅理解,觉得写一个...
  • WEB语义化

    2016-07-31 11:04:51
    web语义化是指通过HTML标记表示页面包含的信息,包含了HTML标签的语义化和css命名的语义化。HTML标签的语义化是指:通过使用包含语义的标签(如h1-h6)恰当地表示文档结构。css命名的语义化是指:为html标签添加有...
  • 表现与数据分离、Web语义化

    千次阅读 2017-08-30 10:04:16
    学术界将web语义化称为Web3.0的核心。 目标是:提高计算机和人对于web代码的可读性。 核心思想是:标注网页对象*使其对应本体中的实体,并通过逻辑等手段进行自动推理。 作用在于更好整合网络上的...
  • web语义化是指通过HTML标记表示页面包含的信息,包含了HTML标签的语义化和css命名的语义化。HTML语义化是指:通过使用包含语义的标签(如h1-h6)恰当地表示文档结构 CSS命名的语义化是指:为html标签添加有意义的...
  • 关于Web语义化

    千次阅读 2014-05-07 10:14:35
    对于“web语义化”这个词语我相信只要是从事前端的人都不陌生,当然我对这个词语也是非常熟悉,我相信从事前端工作的同事在投简历时都会在招聘需求里面看到这句话:“对web语义化有深刻的理解”,当然我本人也是从某...
  • 搜索引擎很好的利用了这些语义化标签抓取内容,又鉴于搜索引擎的巨大流量推荐,Web前端不得不考虑SEO,从而两者实现有益的循环,共同推进着语义化标签的使用。2、但Web的发展超乎想象,起初定...
  • XHTML标签语义化介绍

    2020-12-13 23:16:47
    以前我真的没有怎么重视过搜索引擎,现在开始比较在意了,因为页面的很大一部分流量是来自搜索引擎的,要使页面尽可能地对搜索引擎友好,所以就要尽可能地使标签语义化。  以前以我对web开发的粗浅理解,觉得写一...
  • 面试题–你是如何理解 HTML 语义化的? 简单来说:就是用正确的标签做正确的事。比如: 头部:header 导航:nav 主体内容:main 标题:h1 ~ h6 段落:p 侧边栏:aside 页脚:footer 从历史讲起,大家知道前端也是这...
  • WEB语义化和W3C标准初探

    千次阅读 2017-12-22 18:34:18
    W3C标准包括定义 w3c(World Wide Web Consortium)标准:是一些列web标准的集合,在百度上面搜索也只是告诉你w3c标准主要对应几个...4.其他标准,包括字体,安全,语义化很多方面的内容。 W3C standards defin
  • 这里是修真院前端小课堂,每篇分享文从 【背景介绍】【知识剖析...如何理解HTML结构的语义化? 】 大家好,我是IT修真院西安分院第5期的学员阮少凡,一枚正直纯洁善良的web程序员,今天给大家分享一下,修真院官网cs...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 55,451
精华内容 22,180
关键字:

web语义化的理解