没有合适的资源?快使用搜索试试~ 我知道了~
Semantics:Html/Xhtml是否真正符合标准
0 下载量 111 浏览量
2020-09-22
15:48:55
上传
评论
收藏 81KB PDF 举报
温馨提示
试读
2页
原文:http://jorux.com/archives/what-is-semantics/Semantics可翻译为语义的(学),它是Html/Xhtml是否真正符合标准的重要一环。Jorux在这和大家讨论一些自己的观点,如有不妥之处,还请各位网友指正。在西方,为什么这么多人如此重视网页的Semantics,也许你会说,西
资源推荐
资源详情
资源评论
Semantics::Html/Xhtml是否真正符合标准是否真正符合标准
原文:http://jorux.com/archives/what-is-semantics/Semantics可翻译为语义的(学),它是Html/Xhtml是否真正符
合标准的重要一环。Jorux在这和大家讨论一些自己的观点,如有不妥之处,还请各位网友指正。在西方,为什
么这么多人如此重视网页的Semantics,也许你会说,西
原文:http://jorux.com/archives/what-is-semantics/
Semantics可翻译为语义的(学),它是Html/Xhtml是否真正符合标准的重要一环。Jorux在这和大家讨论一些自己的观点,如有
不妥之处,还请各位网友指正。在西方,为什么这么多人如此重视网页的Semantics,也许你会说,西方比较守规矩,重视标
准,但我想说的是,在这些表象的背后有着“一只无形的手一只无形的手”控制着。
在此,举个导航条的例子来说明我的观点。大家应该看见过很多诸如下类的导航结构:
首页 | 关于 | 博客 | 留言 | 相册
它们有着共同的特点,都有分割条“|”将各个条目分开。要实现以上效果的导航栏,其Html/Xhtml有很多种写法,在此仅具几个
比较典型的例子:
例1:
<p><a href=”home.html”>首页</a> | <a href=”about.html”>关于</a> | <a href=”blog.html”>博客</a> | <a
href=”message.html”>留言</a> | <a href=”album.html”>相册</a></p>
例2:
<ul>
<li><a href=”home.html”>首页</a></li>
<li>|</li>
<li><a href=”about.html”>关于</a></li>
<li>|</li>
<li><a href=”blog.html”>博客</a></li>
<li>|</li>
<li><a href=”message.html”>留言</a></li>
<li>|</li>
<li><a href=”album.html”>相册</a></li>
</ul>
例3:
<ul>
<li><a href=”home.html”>首页</a> | </li>
<li><a href=”about.html”>关于</a> | </li>
<li><a href=”blog.html”>博客</a> | </li>
<li><a href=”message.html”>留言</a> | </li>
<li><a href=”album.html”>相册</a></li>
</ul>
例4:
<ul>
<li><a href=”home.html”>首页</a></li>
<li><a href=”about.html”>关于</a></li>
<li><a href=”blog.html”>博客</a></li>
<li><a href=”message.html”>留言</a></li>
<li><a href=”album.html”>相册</a></li>
</ul>
以上为说明Semantics而举的四个导航条Html/Xhtml例子.
例例1使用了段落p作为导航条的语义元素标识(相对于结构元素,诸如div等)。很显然它犯了很典型的错误,错误的把原本是条目
(list)的导航栏看成了段落。
例例2,3,4都使用了ul/li作为导航栏的语义元素标识,它们的区别进在于分割条“|”的位置,以及是否在Html/Xhtml中出现。
由于CSS的存在,利用其控制表象的能力,可以将以上四个例子的外表变得一模一样,而不被肉眼察觉。但是这只是表象,
随着搜索引擎的互联网地位提升,以及XML的使用频率和重要性增加,它们作为Robot,只读Html/Xhml/XML源代码,而不读
CSS,也就是说它们更在乎你的网页的实际含义,而不是你的网页好看与否。也就是说让你的网页符合语义规范,就是让这
些Robot更好的读懂你的网页,提高你的网站在搜索结果中的排名,获得更大的利益,这只无形的手决定了西方对Semantics
的重视,甚至超过网页是否通过W3C的检测的重要性。
我个人认为的Semantics的含义就是:
将将CSS去除,你的网页表现依然规范,易懂。去除,你的网页表现依然规范,易懂。
这条法则,能让你的肉眼和Robot的逻辑达到某种程度的统一。利用以上理论,在例例1中犯的错误,就比较容易理解,条目中
的关键词比段落中的关键词,更具价值。一个原本是条目的内容为什么还要使用段落?!
那么例例2,3,4中,分隔条怎么会如此重要。
在例例2,3之中只是位置的区别,现在不用任何CSS来控制表象,那么其Html/Xhtml表现的区别是显而易见的,读者可以试试。
在例例2中,分割条会单独占据四个li,原本五个li变为了九个。打个比方,一个五个人的公司现在变为了九个人的,大家的股份
被稀释了一半,每个股东的重要性当然会被削弱。更要命的是有四个股东居然是一模一样的。Robot可能会认为那四个股东(|)
更为重要,而降低了其他股东(关键词)的重要性。在例3中,使分隔条成为原来股东的秘书,自然不会影响关键词的重要性。
从表象考虑,也是例例3优于例例2的表现,例例2中分隔条单独占据一行,让人费解。
那么例例4中,没有使用分隔条,其在语义学上更优。分隔条的表现,可以在CSS中用图片背景轻松实现,而且像这种类型的单
色分隔条,用gif格式的话,只有几个字节,不影响下载速度。
资源评论
weixin_38748263
- 粉丝: 6
- 资源: 894
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功