标签语义化以及使用好处

这个是我在年初面试的时候被问答的一个问题，当时回答的很一般，自己了解的不是很透彻，所以回来后就在网上查找看下所谓的“标准答案”，然后按照自己的思路总结整理了一下。
一个网页相当于一个画中的数，html结构相当于这个数的枝干，而标签则是这个枝干上的果实叶子，css则是颜料，用来装饰这幅画的整体风格，HTML标签语义化相当于将果实和叶子用不同语义的标签将它们区分开来，让别人在看这幅画的时候，一眼能够明白哪部分代码的是果实，哪部分代表的是叶子。
我们经常应用的语义化标签H1-h6     标题内容P         段落Ul        无序Ol        有序Dl        定义列表Thead     表格中的表头内容Tbody     表格中的主体内容HTML5中也新增加许多的语义化标签Header    section或者page的页眉Nav       导航栏Footer    section或者page的页脚Progress  进度条Video     视频HTMl标签语义化，简单来说，就是让标签有含义，给某块内容用上一个最恰当最合适的标签，使页面有良好的结构，页面元素有含义，不论是谁都能够看懂这块内容是什么，并且有利于搜索引擎。
标签语义化的好处：1.  HTML结构清晰2.  代码可读性较好3.  无障碍阅读4.  搜索引擎可以根据标签的语言确定上下文和权重问题5.  移动设备能够更完美的展现网页（对css支持较弱的设备）6.  便于团队维护和开发现在很多大型公司的前端很注重标签语义化，团队组员能够很好的理解页面结构，便于维护，不必再焦头烂额的猜测这部分代码代表什么内容，省下了许多没必要的时间，所以在以后的页面设计中，慢慢的将使用语义化标签养成一中习惯，可以方便很多人。

标签语义化以及使用好处相关推荐

html标签语义化的好处,(2019)[前端]面试题[9]：HTML5语义化标签和新特性
问题知道语义化吗?说说你理解的语义化,如果是你,平时会怎么做来保证语义化? 说说你了解的HTML5语义化标签,HTML5新增了那些新特性? Hello,欢迎来到我的博客,每天一道面试题,我们共同进步 ...
理解HTML标签语义化
首先是关于语义(Semantics)和默认样式的区别,默认样式是浏览器设定的一些常用tag的表现形式,语义化的主要目的就是让大家直观的认识标签(markup)和属性(attribute)的用途和作用, ...
什么是 web 语义化,有什么好处
什么是 web 语义化,有什么好处 web 语义化是指通过 HTML 标记表示页面包含的信息,包含了 HTML 标签的语义化和 css 命名的语义化. HTML 标签的语义化是指:通过使用包含语义的标 ...
搜索框语义化的html标签是,HTML标签语义化和常用的标签
如何理解标签语义化 HTML的历史在一开始,没有前端的概念,页面的HTML都是后端程序员去写的,后端程序员在页面布局的时候使用的是table去布局,样式丑陋并且出现很多table嵌套的情况. 之后出 ...
HTML标签语义化——使用b标签，还是strong标签
HTML标签语义化,相关的内容网上有很多.大家可以去学习一下,看一下你所使用的标签是否具有其真正要表达的意义,标签你用对了吗?今天要介绍的内容是使用b标签,还是strong标签,翻译自http://w ...
[html] HTML为什么要语义化？语义化有什么好处？
[html] HTML为什么要语义化?语义化有什么好处? 1.利于SEO 2.结构与表现分离 3.利于维护个人简介我是歌谣,欢迎和大家一起交流前后端知识.放弃很容易, 但坚持一定很酷.欢迎大家一起 ...
[html] 你对标签语义化的理解是什么？
[html] 你对标签语义化的理解是什么? 标签语义化的初衷是让正确的标签做正确的事情,但对于人来说,标签的语义除了在 tag 上体现,还可以从 id, class 上体现出来.而每个人对于标签的理解 ...
H5新标签--语义化标签
H5新标签----语义化标签区别:1.默认样式不一样 2.有SEO优化作用 1.header,一般作为网页的头部使用 2.aside,侧边栏 3.nav,导航栏 4.address,地址,字体样式默 ...
HTML标签语义化，值得收藏！
思维导图学习路线第一阶段:网页制作 HTML:常用标签,锚点,列表标签,表单标签,表格标签,标签分类,标签语义化,注释,字符实体 CSS:CSS介绍,全局样式,行内样式,内联样式,选择器,字体样式 ...

标签语义化以及使用好处

标签语义化以及使用好处相关推荐

最新文章

热门文章