H标签的语义化研究

杨勇

本文立足于常见html标签，具体以比较重要的H标签为研究对象，探讨其蕴涵的丰富语义功能，将用户可读性体验与机器可读性紧密结合，进一步规范html标签在网页中不恰当和混乱应用的局面，推进html文档结构化、web语义化的快速发展。在实际应用层面，指导web设计师制作出美观且对于搜索引擎友好的优秀界面。

概述

在html5新标准即将发布之际，网页内容语义化再一次受到人们的高度关注。Web语义化的设计思想已成为每一个设计师无法回避的事实，很多网站也面临着被淘汰的危机，于是，我们需要对习惯了的东西进行重新审视。

什么是web语义化？其包括两层含义：网页内容对机器(搜索引擎)是可理解、可读的，机器可以轻松通过标记描述的信息，处理网页上的链接、关键词、链接深度、权重、排名等内容；二是网页内容对用户是可理解的,可读的，用户可以根据网页描述信息及表现形式判断网页内容的重要性及与主题的相关性，从而根据网页的情境快速找到自己想要的结果。Web语义化的终极目标是将机器可读性与用户可读性相结合，即人能看懂，机器也能读懂，当然这一条路互联网还有很大一段距离。H标签的语义化便是朝着这个方向跨出的一步。

要实现web语义化设计，H标签的语义化必先行。解决H标签语义化的方法如下：

明确H标签在网页中的语义

把握H标签使用时机

运用H标签优化站点的方法

如何使用H标签

（一）H标签的定义

H标签也叫heading标签，属于块级标记。一般情况下一个H标记独占网页的一块区域。H标签共有六对标记，

到

。H标签用于定义标题。

定义最大的标题。

定义最小的标题。H标签支持如下属性：id, class, title, style, dir, lang, xml:lang。

（二）H标签的用法

-

的具体用法如下：

这是一级标题

这是二级标题

这是三级标题

这是四级标题

这是五级标题

这是六级标题

默认运行效果如图1：

H标签的语义

W3C指出h1-h6标记用于定义标题。h1定义字体最大的标题，h6定义字体最小的标题。h1，h2，h3，h4，h5，h6，作为标题标记，外观从大到小，重要性也依次递减。遵循这样的原则，它让页面的层级关系更清楚，让搜索引擎更好地抓取和分析出页面的主题内容等等。

（一）h1一级标题

标记中的内容，表示一级标题。代表重中之重，它的地位在页面中相当于关键字。虽然html标记理论上在一个页面中可以出现多次，但h1标记的实际语义具有唯一性，如将一个网页比作一篇文章，试想文章能有几个一级标题，故h1在一个网页里最好只出现1次或者直接不使用。

（二）h2二级标题

标记中的内容，表示次级标题。重要性比h1稍低，它的地位相当于页面中的长尾关键词，主要用于设置文章段落标题或栏目标题，h2标题在一个页面中可以出现多次，与h3搭配使用。

（二）h3三级标题

标记中的内容，表示三级标题，重要性较h2要小，一般用于页面的边侧栏，h4作为辅助。

从用户可读性方面考虑，页面层级关系不能太深，一般不超过3，所以在页面中h4,h5,h6一般出现机率较少，在此即不累述，其语义和作用可参照h2,h3标记。

H标签对搜索引擎的友好性

网站好比一棵大树，主干是网站的核心内容，粗壮的枝杈是网站的各分类，枝叶是网站具体内容，搜索引擎的爬虫就在这些树与枝叉之间爬行，网站地图（sitemap）给爬虫一个准确的路径，让它能找到所有我们希望它找到的枝叶部分。在这些杂乱的内容中，H标签标识了内容的重要层级，并指引搜索引擎爬虫快速有序的对网页内容进行整理。

（一）h1标记网页优化

h1是网页中比较重要的标记，使用它标注网页的主关键字，提升主关键字的重要性。利用好h1标记可提升网站的排名，它像一把锋利的双刃剑，不用它时你在优化的过程中会吃亏，而滥用它你也会吃亏，所以要慎重使用。一般有以下几种用法：

1）包含网页文档tilte中的主关键词或直接放置logo文字内容，并设置h1的display:none样式或用特殊方法将其隐藏起来，以此对网页关键词进行优化。综合性网站、公司宣传类网站可以这样来处理。

如图2使用h1标记优化网易网：

html内容：

网易

样式内容：.hidden{display:none;}

2）根据内容的重要性对网站进行优化。最常见的用法即是在h1标记内放置头条要闻标题，以标识新闻的重要性。新闻类网站运用的比较多。

例如图3使用h1标记优化搜狐网头条要闻：

3）传统用法，使用h1标记来定义网页内容的层次，以达到优化的作用。新闻、资讯类网站的详细内容页通常都会使用h1标记来设置文章的标题，以达到优化的目的。

例如图4使用h1标记优化DIVCSS5网文章标题：

（二）h2标记网页优化

主关键字的优化对于网站十分重要，在使用h1标记对主关键字进行优化以后，我们需要进行关键词叠加优化，即运用h2标记将网页中出现的一些关键词进行标注，达到增加关键词密度的目的。

1）网站首页的主体栏目标题包含了许多与关键词相关的重要词语，有的是行业关键词，有的是品牌关键词，运用h2标记可对网站首页主要栏目标题进行优化。

例如图5使用h2标记优化慧聪网首页主栏目标题：

2)对于大中型网站，长尾关键词带来的流量不容忽视，运用h2标记可对长尾关键词进行优化。

如图6使用h2标记优化农信通网的长尾关键词：

例如图7使用h2标记优化新华网时政页长尾关键词：

（三）h3标记网页优化

h3标记一般结合h2标记使用，主要用于设置页面的次级要闻的文章标题和侧边栏目标题上。若是三列结构或二列结构布局的网页，h3一般出现在两侧边栏或较窄栏目标题上，以达到优化长尾关键词的作用。

h4,h5,h6在网站的优化中，使用频率比较小，用法可参照h2、h3标记，但要注意层次，并且出现的H标签的序号必须连续，不可跳跃使用。

总结

H标签是页面内容比较重要的标记之一，用好此系列标记，设计出来的网站层次清晰，结构明确，若布局再进行美学上的处理，那么网站不仅有利于搜索引擎理解，也利于用户阅读。标记在理论上是可以任意重复使用，但千万要理解每一个标记的语义，恰当选择合适的标记进行内容设计，你的网站将会让搜索更加喜欢，同时也能获得一个不错的排名。

（作者单位：云南工商学院软件学院）