每天一道面试题:你理解的HTML语义化是什么?

·  阅读 1307

作者:bibi不吃鱼

今日的许多烦恼,都来源于昨日的惰性。

要讲HTML语义化还要从历史讲起,大家知道前端也是这两年才发展起来的,以前的前端都是写写展示页,所以其实很早以前,是没有专门的前端的,需要写网页了,就让后端看看顺手写了,所以那时候的网页,都是一堆Table 或者 满屏幕的div标签。不要说给别人看自己的HTML结构了,估计自己也看的够累。而且对于搜索引擎和设备解析来说,非常的不友好。

为了解决上面说的问题,HTML语义化就逐渐地诞生了。

什么是HTML语义化?

简单来说:就是用正确的标签做正确的事。比如:

  • 头部:header
  • 导航:nav
  • 主体内容:main
  • 标题:h1 ~ h6
  • 段落:p
  • 侧边栏:aside
  • 页脚:footer

这样,整篇HTML结构非常清晰,好看。

HTML语义化有什么好处呢?

  • 网页加载慢导致CSS文件还未加载时(没有CSS),页面仍然清晰、可读、好看。
  • 提升用户体验,例如title、alt可用于解释名词或解释图片信息。
  • 有利于SEO:和搜索引擎建立良好沟通,有助于爬虫抓取更多的有效信息。
  • 方便其他设备(如屏幕阅读器、盲人阅读器、移动设备)更好的解析页面。
  • 使代码更具可读性,便于团队开发和维护。

希望我们能够写出更规范整洁的HTML,多用语义化标签,尽量不用无意义标签。

不积跬步,无以至千里;不积小流,无以成江海,共勉!

分类:
前端
标签:
分类:
前端
标签: