当前位置: 首页 > Web前端 > HTML5

前端面试题——HTML结构语义

时间:2023-04-05 16:44:26 HTML5

一、HTML语义背景HTML结构语义是近几年才提出来的。和以前的HTML结构相比,大部分都是一堆没有语义的标签。使用最多的是DIV+CSS。为了改变这种状况,开发者和官方提出了语义HTML结构的概念,并在HTML5中加入了很多语义标签。2.HTML语义的概念语义是指根据内容的结构选择合适的标签,让开发者可以阅读和编写更优雅的代码,同时浏览器爬虫和机器也可以很好地解析它们。3、对HTML语义的需求随着互联网的发展,WEB承载的信息(图片、音频、视频等)越来越多,人们开始使用机器来处理网络信息,搜索引擎也应运而生。比如如何为搜索引擎处理和挖掘次大而复杂的信息,所以机器更好地理解WEB上的内容变得越来越重要。传统的Web由文档组成。W3C希望通过一套技术来支持“WebofData”,即WebofData,把Web看作是一个存储和管理数据的大型分布式数据库。语义网是构建这样一个数据网的重要组成部分,帮助人们创建数据并将其存储在网络上,并创建相关的词汇表和数据处理规则。4.HTML语义的作用4.1清晰的页面结构当去除或丢失CSS样式时,也可以使页面呈现出清晰的结构,增强页面的可读性。4.2对更多设备的支持使其他设备(如屏幕阅读器、盲人阅读器、移动设备)更容易解释以有意义的方式呈现网页。4.3有利于SEO优化和与搜索引擎的良好沟通,帮助爬虫抓取更有效的信息。搜索引擎爬虫还依靠标签来确定上下文和每个关键字的权重。4.4促进团队发展和维护。团队中每个人都遵循W3C标准,可以减少很多差异化的东西,方便开发维护,提高开发效率,甚至可以实现模块化开发。5.HTML语义化方法(1)根据文档的上下文结构,选择最适合表达当前语义的标签;(2)尽可能少使用非语义标签

;(3)不要使用带Styled标签的标签,如:等,都是用CSS设置的;(4)title标签的使用要按照重要程度降序使用,不能有空隙,一个页面只能有一个

;(5)提高关键词密度,如图片替代文字alt、提示文字标题;(6)正确使用内容容器,如段落

、列表

    1. ;(7)对于要强调的文字,可以使用标签(浏览器默认样式,如果可以用CSS设置),默认样式是加粗(不要使用),是斜体(不要使用);(8)注意表格的使用,标题,表头,表体(text),表注(footer)。定义表格行,定义表格标题,定义表格单元格。(9)表单域使用
      标签,标签为
      定义标题;(10)每个标签对应的描述文字需要使用