构建网站友好性基础 语义化网站的html标签

来源:不详 责任编辑:栏目编辑 发表时间:2013-07-01 19:07 点击:

分离的结构和表现的一个作用就是可以用语义化的标签来标识文档的内容。在半结构化的xhtml代码里每个标签都有他代表的独特意义。在现实生活中人脑可以轻易的分辨出网页上文章标题和小节标题的区别,但是当下搜索引擎技术还不成。如果网页上所有文字都是用<p>做标签的话,搜索引擎可能真的很难分辨不出来文章真实的主题内容是那段文字。

关于标签的语义化的理解有方面。第一面是面向浏览者方便阅读的语义化,这个主要是在使用浏览器阅读网页的时候给予文字以特殊标识,使浏览者更容易分辨出那些是网页文字的重点内容,以便于更方便的阅读。第二方面是面向搜索引擎分析所用的语义化处理,友好的语义化标签能使搜索引擎更好的抓取和分析网页上的内容。如果说让网页能够跟搜索引擎尽可能深入交流的话,那么对网页标签进行语义化处理是再好不过了。

下面我们来讨论关于语义化的内容。
<Hx>

<h1>、<h2>、<h3>、<h4>、<h5>、<h6>,作为标题标签,并且依据重要性递减。<h1>是最高的等级。

例如
<h1>主标题</h1>
<h2>次标题</h2>
而不要使用
<div class="title">主标题</div>
<div class="title">次标题</div>
搜索引擎是不能分清楚谁是主标题,谁是副标题的。

<p>

段落标记,知道了<p>作为段落,你就会放弃用<br/>来换行了,而且不需要<br/><br/>来区分段落与段落。<p></p>中的文字会自动换行,而且换行的效果优于<br/>。关于搜索引擎方面<p>代表定义主题文字,<p>内的文字会被搜索引擎认为是网页上的描述主要内容文字区。

例如
<p>HTML3.0规范是由当时刚成立的W3C于1995年3月提出,提供了很多新的特性,例如表格、文字绕排和复杂数学元素的显示。</p><p>虽然它是被设计用来兼容2.0版本的,但是实现这个标准的工作在当时过于复杂,在草案于1995年9月过期时,标准开发也因为缺乏浏览器支持而中止了。</p>


<ul>、<ol>、<li>

<ul>无序列表标签,<ol>有序列表标签也是经常使用到的。在web标准化过程中,<ul>还被更多的用于导航条,这样做是完全正确的,而且当你的浏览器不支持CSS的时候,导航链接仍然很实用。另外还有一个好处是<ul><ol>的代码相对<table>而言比较少,对网页下载十分有利。在此并无其他含义。

例如
<ul>
    <li>项目一</li>
    <li>项目二</li>
    <li>项目三</li>
</ul>
例如
<ol>
    <li>第一章</li>
    <li>第二章</li>
    <li>第三章</li>
</ol>


<dl>、<dt>、<dd>

dl就是“定义列表”。现在来对无序列表标签和有序列表标签语义化效果进行对比。例1的语义化后代表列表的标题是dog,描述的内容是A carnivorous mammal of the family Canidae.
例2的语义化后代表列表的标题是《大话西游》剧情点评,描述的内容是我面对的,是一部痛彻心肺的喜剧.寓言篇故事已然存在,已然不可避免。在深切的郁闷中来到了二十来岁,突然就看懂了《大话西游》的开头:一位才华横溢又无法无天的青年(孙悟空),根本不喜欢世人摊派给他的大事业(西天取经)。他尤其受不了师父(唐僧)的唠唠叨叨,可世俗条规(观音)又不放过他。为让他悔悟,心甘情愿地去取经,唐僧和观音达成妥协:让他五百年后重新做人。

例如1
<dl>
<dt>Dog</dt>
<dd>A carnivorous mammal of the family Canidae.</dd>
</dl>

例如2
<dl>
 <dt>《大话西游》剧情点评</dt>
    <dd>我面对的,是一部痛彻心肺的喜剧.寓言篇故事已然存在,已然不可避免。 </dd>
    <dd>在深切的郁闷中来到了二十来岁,突然就看懂了《大话西游》的开头:一位才华横溢又无法无天的青年(孙悟空),根本不喜欢世人摊派给他的大事业(西天取经)。他尤其受不了师父(唐僧)的唠唠叨叨,可世俗条规(观音)又不放过他。为让他悔悟,心甘情愿地去取经,唐僧和观音达成妥协:让他五百年后重新做人。</dd>
</dl> 

<em>、 <strong>

<em> 是用作强调的,<strong>是用作重点强

    发表评论
    请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
    用户名: 验证码:点击我更换图片
    最新评论 更多>>

    推荐热点

    • 12个影响SEO价格的常见因素
    • 从市场的角度思考网站建设
    • 网站优化之黑帽SEO
    • 行业站站长必备:如何提升行业网站影响力
    • 星际争霸运营与网站运营的思考
    • 乐讯刷机网全新改版 在线刷机更方便更放心
    • 网站优化:如何模拟不同带宽测试网页打开速度
    • 全站301重定性 避免带与不带www域名权重分散的几种方法
    • webkaka新增了几个网页优化工具:图片/CSS/JS压缩
    网站首页 - 友情链接 - 网站地图 - TAG标签 - RSS订阅 - 内容搜索
    Copyright © 2008-2015 计算机技术学习交流网. 版权所有

    豫ICP备11007008号-1