1.什么是HTML语义化?
通过标签判断内容语义,例如根据h1标签判断出内容是标题,根据p判断内容是段落、input标签是输入框等。
2.为什么要语义化?
-
1).去掉或样式丢失的时候能让页面呈现清晰的结构
-
2).方便其他设备解析(如屏幕阅读器、盲人阅读器、移动设备)以意义的方式来渲染网页
-
3).有利于SEO
-
4).便于团队开发和维护,遵循W3C标准,可以减少差异化
3.如何确定你的标签是否语义良好?
去掉样式,看网页结构是否组织良好有序,是否仍然有很好的可读性。
4.新增的语义化标签
- header:用在页面的头部或者板块的头部
- nav:导航
- article: 和主体相关的附属信息可以包含与当前页面或主要
内容相关的引用、侧边栏、广告、nav元素组,以
及其他类似的有别与主要内容的部分 - section:页面上的板块用于划分页面上不同区域,或者划分文章里的不同的章节
- aside:侧边栏,广告
- footer:用在页面的头部或者板块的底部
- progress:定义进度条
- address:定义文章,或页面作者的详细联系信息,样式是斜体