web语义化

来源:互联网 发布:delphi 本地数据库 编辑:程序博客网 时间:2024/06/06 01:14

以下为个人理解,有不对的地方请指正。


web语义化实际上是html语义化。


一个前端页面离不开三样东西:html、css、js。

  • html:用来搭建整个页面的结构
  • css:用来修饰html结构的样式
  • js:用来处理与用户的交互


html语义化实际上可以理解为:通过运用不同的html元素来告诉我们这块是什么内容或有什么意义。比如:
  • <header>表示这块是页面的头部
  • <footer>表示这块是页面的底部
  • <article>表示这里是文章
  • <nav>表示这里是导航或菜单
没有相应的原始标签,就通过设置一个合理的class来表达语义化。比如

<div class="ad">可以表示这里是个广告区

<div class="reword-list">可以表示这里是奖品列表

看到内容时需要想一想用哪个元素比较合理、以使得能够更好地描述这块的内容


那么语义化有什么好处呢?

(1)显而易见的是可读性很强,并且易于开发维护
(2)有利于seo,有利于搜索引擎的爬虫抓取信息,以使得陌生用户可以通过搜索轻易搜索到此页面,为页面或网站带来流量
(3)即使页面所需要的css没有成功载入,各语义化结构也会以其默认样式来修饰页面使得页面仍然有其清晰的结构并且干净可读
(4)由于显示设备的不同,其渲染方式或者对css的支持程度也不同,语义化的元素可以使得各设备依据自身的条件来合理显示页面



原创粉丝点击