[转载]理解HTML语义化】的更多相关文章

声明: 本文转载于:freeyiyi1993博客. 原文地址:http://www.cnblogs.com/freeyiyi1993/p/3615179.html 1.什么是HTML语义化? <基本上都是围绕着几个主要的标签,像标题(H1~H6).列表(li).强调(strong em)等等> 根据内容的结构化(内容语义化),选择合适的标签(代码语义化)便于开发者阅读和写出更优雅的代码的同时让浏览器的爬虫和机器很好地解析. 2.为什么要语义化? 为了在没有CSS的情况下,页面也能呈现出很好地内…
什么是Web语义化 Web语义化是指使用恰当语义的html标签.class类名等内容,让页面具有良好的结构与含义,从而让人和机器都能快速理解网页内容.语义化的web页面一方面可以让机器在更少的人类干预情况下收集并研究网页的信息,从而可以读懂网页的内容,然后将收集汇总的信息进行分析,结果为人类所用:另一方面它可以让开发人员读懂结构和用户以及屏幕阅读器(如果访客有视障)能够读懂内容. 简单来说就是利于 SEO,便于阅读维护理解. 总结起来就是: 正确的标签做正确的事情 页面内容结构化 无CSS样子时…
[02]你是如何理解 HTML 语义化的   01,语义化,就是通过HTML标签来表示页面包含的信息. 02,其中有HTML标签的语义化和CSS命名的语义化. 03,HTML标签语义化的的含义是:     通过使用含有语义的标签(如h1~h6,aside)来表示文档结构. 04,CSS语义化的含义是:     为HTML标签添加有意义的class和id来补充未表达的语义. 05,为什么需要语义化 结构清晰.便于维护. 盲人可以用阅读器来阅读. 使搜索引擎更好的抓取网页.利于收录.       *…
web语义化是什么? Web语义化,使用语义恰当的标签,可以让页面具有良好的结构,页面元素具有良好的含义,从而让人和机器都能快速理解.语义化的web页面一方面可以让机器在更少的人类干预情况下收集并研究网页的信息,从而可以读懂网页的内容,然后将收集汇总的信息进行分析,结果为人类所用:另一方面它可以让开发人员读懂结构和用户以及屏幕阅读器(如果访客有视障)能够读懂内容. 为什么要语义化? 有利于 SEO . SEO也就是Search Engine Optimization,搜索引擎优化.指通过站内优化…
本文最初于 2018-09-21 发布于 知乎 ,后在 <重学前端> 专栏的学习中,重新复习整理,发布于 Github 上,并计划写一系列前端学习相关的文章.欢迎 star . HTML 语义化 简单来说,我们可以理解为:用正确的标签做正确的事情. 例如: 段落用 p 标签,标题用 h 系列标签,边栏用 aside 标签,主要内容用 main 标签.正确使用语义标签可以带来很多好处. 为什么要关注 HTML 语义化?(为什么要使用语义类标签?) 对人: 增强可读性,对开发者更友好,在没有 CS…
1.什么是HTML语义化? <基本上都是围绕着几个主要的标签,像标题(H1~H6).列表(li).强调(strong em)等等> 根据内容的结构化(内容语义化),选择合适的标签(代码语义化)便于开发者阅读和写出更优雅的代码的同时让浏览器的爬虫和机器很好地解析. 2.为什么要语义化? 为了在没有CSS的情况下,页面也能呈现出很好地内容结构.代码结构:为了裸奔时好看: 用户体验:例如title.alt用于解释名词或解释图片信息.label标签的活用: 有利于SEO:和搜索引擎建立良好沟通,有助于…
先看下面两段代码 <div>标题</div> <div> <div>一段文字</div> <div> <div>列表1</div> <div>列表2</div> </div> </div> html语义化代码: <h1>标题</h1> <div> <p>一段文字</p> <ul> <li…
什么是标签语义化? 提升代码可读性,便于团队开发和维护 为什么要标签语义化? 当网页去掉 CSS 样式时,页面能呈现出来清晰的结构 案例 不存在语义化 <div></div> <div></div> <div></div> 使用语义化 <header></header> <main></main> <footer></footer> 总结:从上面可以看出,一个页面…
什么是HTML语义化 说HTML语义化就要先说说HTML到底负责的什么?下面摘自维基百科: 超文本标记语言(英语:HyperText Markup Language,简称:HTML)是一种用于创建网页的标准标记语言.HTML元素是构建网站的基石.HTML允许嵌入图像与对象,并且可以用于创建交互式表单,它被用来结构化信息--例如标题.段落和列表等等,也可用来在一定程度上描述文档的外观和语义.关于对于语义化的理解顾轶灵:如何理解 Web 语义化?这里讲的很清楚了我就简单说一下我的理解:通俗的来讲就是…
XML Processing Modules — Python 3.7.1 documentation https://docs.python.org/3.7/library/xml.html#xml-vulnerabilities function TMPdbInsertListOrders($one, $link, $InputAmazonOrderId) { $AmazonOrderId = $InputAmazonOrderId; $ASIN = $one->ASIN; $SellerS…
HTML 基础知识 版权声明:未经博主授权,内容严禁转载 ! HTML语义化标签概念 如果没有语义化标签,上面这些 div 都是没有实际意义的,只是我们提供给浏览器的指令. 和 语义化 代码对比: 什么是语义化 1. 根据内容结构化(内容语义化). 2. 选择合适的标签(代码语义化). 3. 便于开发者阅读和写出更好的代码,或者让浏览器的爬虫和机器很好的解析. 语义化的意义: 1.遵循统一的标准(便于团队的开发和维护,具有可读性,遵循W3C标准的团队都应该遵循该标准). 2.内容结构分离(没有c…
--------引子--------------- 家里有个熊孩子,经常会有一些意想不到的事情发生:回家的时候,他会笑呵呵冲过来,大声喊着“臭爸爸”:你让他把鞋穿上,他会提起鞋子往楼下扔...在小孩的世界里,他虽然会说话,但不一定明白其中的意思,不能正确表达:同样他也会做一些事情,但不一定按正常大人的逻辑,不能准确接收:符合预期的的交流和沟通成了奢望.因为在他的世界里,一切都处于混沌之中,一切的逻辑.规范都没有完善. 而在HTML的世界里,经历多年的成长,规范已基本成型,不同的HTML标签.属性…
在快速理解web语义化的时候,只知道web语义化有利于SEO和便于屏幕阅读器阅读,但并不知道它是如何有利于SEO和便于阅读器阅读的,带着这个疑问,进行了一番探索总结. SEO 什么是SEO? SEO(Search Engine Optimization,搜索引擎优化 ),是一种利用搜索引擎的搜索规则来提高目的网站在有关搜索引擎内的排名的方式.通俗来讲就是根据搜素引擎的规则来优化你的网站,让你的网站能够在用户的搜索结果中排在前面,提高网站的访问量. SEO常用方式 采用DIV+CSS布局 采用di…
一:Web入门 1:web文件命名 在文件名中应使用连字符(-).搜索引擎把连字符当作一个词的分隔符, 但不会以这种方式处理下划线. 养成在文件夹和文件名中使用小写,并且使用短横线而不是空格来分隔的习惯. 2:居中图像 img { display: block; margin: 0 auto; } 二:HTML head 1:许多<meta> 元素包含了name 和 content 特性: name 特性指定了meta 元素的类型; 说明该元素包含了什么类型的信息. content 指定了实际…
语义化这个词我想大家都看到了无数次,特别是在一些招聘广告上. 其实我自己也是,不过每次看到都觉得是那些招聘公司复制的,其实他们根本说不清语义化是什么,而且也根本不看重. 所以我一直也没把这东西当回事过. 然而最近当我再次看到这个词时,我想我应该好好思考下这问题了.就写篇博客记录下.     一.什么是语义化? 在解释这个概念之前,应该先解释下“结构-表现-行为”. 如果说解耦合是代码的高境界,那么“结构-表现-行为”的原则就是前台的标杆. 随着前台代码的越来越庞大,各部分代码各司其职的作用就越来…
什么是HTML语义化? HTML标签可以分为有语义的标签,和无语义的标签.比如table表示表格,form表示表单,a标签表示超链接,strong标签表强调.无语义标签典型的有<div>,<span>等.HTML语义化我的理解就是在页面中尽量多滴结合场景多使用含有语义的标签,少使用div,span等无语义的标签. why?为什么要进行语义化? 1,现在的开发基本上都是一个团队合作进行开发.这种情况下,我们写的代码不仅要让我们自己能看懂,而且也应该让别人也容易理解和阅读,要保证代码的…
去掉或样式丢失的时候能让页面呈现清晰的结构: html本身是没有表现的,我们看到例如<h1>是粗体,字体大小2em,加粗:<strong>是加粗的,不要认为这是html的表现,这些其实html默认的css样式在起作用,所以去掉或样式丢失的时候能让页面呈现清晰的结构不是语义化的HTML结构的优点,但是浏览器都有有默认样式,默认样式的目的也是为了更好的表达html的语义,可以说浏览器的默认样式和语义化的HTML结构是不可 分割的. 屏幕阅读器(如果访客有视障)会完全根据你的标记来&qu…
含义: Web语义化是指使用语义恰当的标签,使页面有良好的结构,页面元素有含义,能够让人和搜索引擎都容易理解. 为什么要web语义化?如今互联网都到了web2.0的时代了,HTML语言在不断的进化并发挥着越来越重要的地位:而我们制作网页也从当初的table表格嵌套发展到了 div+css,但经常看到这种代码整个网页大量的使用div标签进行分隔页面内容,有的甚至整个页面只有div一 种html标签存在,滥用现象使得网页制作似乎就只剩下了div.首先,人可以通过视觉的划分判断内容的语义,搜索引擎看到…
1.什么是HTML语义化? 基本上都是围绕着几个主要的标签,像标题(h1-h6),列表(li),强调(strong em)等. 根据内容的语义化(内容结构化),选择合适的标签(代码语义化),便于开发者阅读和写出更优雅的代码的同时,让浏览器的爬虫和机器很好的解析. 2.为什么要语义化? 为了在没有css的情况下,页面也能呈现出很好的内容结构和代码结构. 为了提升用户体验,如:title,alt用于解释名词或解释图片信息,lable标签的活用. 有利于和搜索引擎建立良好的沟通. 方便其他设备解析(如…
简述一下你对 HTML 语义化的理解? 用正确的标签做正确的事情. html 语义化让页面的内容结构化,结构更清晰,便于对浏览器.搜索引擎解析; 即使在没有样式 CSS 情况下也以一种文档格式显示,并且是容易阅读的; 搜索引擎的爬虫也依赖于 HTML 标记来确定上下文和各个关键字的权重,利于 SEO; 使阅读源代码的人对网站更容易将网站分块,便于阅读维护理解.…
本题地址:https://github.com/YvetteLau/Step-By-Step/issues/8 语义化意味着顾名思义,HTML5的语义化指的是合理使用语义化的标签来创建页面结构,如header,footer,nav,从标签上即可以直观的知道这个标签的作用,而不是滥用div. 语义化的优点有: 代码结构清晰,易于阅读,利于开发和维护 提高用于体验,在样式加载失败时,页面结构清晰 方便其他设备解析(如屏幕阅读器)根据语义渲染网页. 有利于搜索引擎优化(SEO),搜索引擎爬虫会根据不同…
最近重新看了一遍html标签的知识,有很多新的体会,对语义化有了一个新的理解. 那么什么叫做语义化呢,说的通俗点就是:明白每个标签的用途(在什么情况下使用此标签合理)比如,网页上的文章的标题就可以用标题标签,网页上的各个栏目的栏目名称也可以使用标题标签.文章中内容的段落就得放在段落标签中,在文章中有想强调的文本,就可以使用 em 标签表示强调等等. 语义化的好处主要有两个方面: 1. 更容易被搜索引擎收录. 2. 更容易让屏幕阅读器读出网页内容.(屏幕阅读器是一种软件,用来将文字.图形以及电脑接…
[重构前端知识体系之HTML]讲讲对HTML5的一大特性--语义化的理解 引言 在讲什么是语义化之前,先看看语义化的背景. 在之前的文章中提到HTML最重要的特性,那就是标签.但是项目一大,标签多的看不懂,一堆叠着一堆.一些命名奇奇怪怪,想维护被劝退,团队协作导致团战开始! 因此语义化迫在眉睫! 什么是语义化 在我们写HTML时其实无所谓,因为你里面长啥样,用户看不到,也不用看到. 因为你有CSS的漂亮衣服,即使你的HTML一塌糊涂,CSS也可以让它光鲜亮丽. 但是用户看不到,开发者看得到呀!因…
所有人都知道html即超文本标记语言或超文本链接标示语言,是目前网络上应用最为广泛的语言,也是构成网页文档的主要语言. html标签中的大部分都是由"语义化"标签所担任 那么,它有什么用呢? 我认为,它主要有以下四点用处: 1,去掉或者丢失样式的时候能够让页面呈现出清晰完整的结构 2,有利于SEO:和搜索引擎建立良好沟通,有助于爬虫抓取更多的有效信息:爬虫依赖于标签来确定上下文和各个关键字的权重: 3,让页面的内容结构化,方便其他设备解析(如屏幕阅读器.盲人阅读器.移动设备) 4,便于…
语义化的主要目的:用正确的标签做正确的事情. 语义化验证方法:css裸奔--去掉css样式,然后看页面是否还具有很好的可读性. 语义化意义 / 优点: 1.让页面的内容结构化 2.利于浏览器解析和SEO搜索引擎优化. 3.提高代码的可维护和可重用性. 语义化内容: 1.标题语义化 2.图片语义化 3.表单语义化 4.表格语义化 图片语义化: 1.figcaption:图注文字 2.alt:给搜索引擎看 3.title:给用户看 <figure> <img src="./01.j…
Html语义化标签-语义化你的HTML标签和属性   1 语义化你的HTML标签和属性 1.1 <Hx> 1.2 <p> 1.3 <ul>.<ol>.<li> 1.4 <dl>.<dt>.<dd> 1.5 <cite>.cite .<q>. <blockquote> 1.6 <em>. <strong> 1.7 <table>.<td…
什么是HTML语义化 1.让开发者阅读和写出更优雅的代码2.让浏览器的爬虫和机器很好的解析 为什么要语义化 有利于seo方便其他设备监听 屏幕阅读设备 盲人阅读器方便团队协作开发 语义化元素 headerfooterhgroup 网页或者section的标题nav 导航aside 特殊的section 与当前文章主要内容相关的附属信息 最好有与之对应的article(文章主要内容)articlesection 文章的节或者段…
一.前言 本文将介绍HTML5中新增的语义化标签,及在IE5.5~9(IE9已经开始支持部分HTML5新标签了)支持这些新标签的兼容性处理. 目录一坨: 二.语义化标签:article.aside.time.mark.section.header.footer.hgroup.progress.figure.figcaption.nav.meter.output.details.summary.ruby和main   三.让IE5.5~9支持HTML5新标签 1. IE5.5~8下对于不支持的标签…
一.前言 在HTML4.1中i和b作为表象标签分别表示斜体和粗体样式,而强调样式与内容分离的XHTML中则出现样式效果相同的em和strong表义标签,此时我们会建议避免使用i和b标签,应该改用em和strong标签. 但在HTML5对i和b赋予新的语义,本文将再一次认识它们! 二.元素语义   1. i标签 W3C草案: The i element represents a span of text in an alternate voice or mood, or otherwise off…
HTML 5的革新之一:语义化标签一节元素标签. 在HTML 5出来之前,我们用div来表示页面章节,但是这些div都没有实际意义.(即使我们用css样式的id和class形容这块内容的意义).这些标签只是我们提供给浏览器的指令,只是定义一个网页的某些部分.但现在,那些之前没“意义”的标签因为因为html5的出现消失了,这就是我们平时说的“语义”. 看下图没有用div标签来布局 html5的布局 嗯,如上图那个页面结构没有一个div,都是采用html5语义标签(用哪些标签,关键取决于你的设计目标…