SEO七十二案例：从网页规范化分析seobook.com案例

这个SEO案例原本出自人民邮电出版社出版，王建编著的《精通Web标准建站：标记语言、网站分析、设计理念、SEO与BI》  中的第20章“SEO搜索引擎优化”，独孤天骄建议想更加详细了解的朋友可以购买纸质书籍。 

在这一章中，作者通过国外最为成功的SEO商业站点之一“seobook.com”作为案例（如图1所示），分析了在SEO过程中的网页设计以及SEO策略内容。因此，这个SEO案例不完全是搜索引擎优化技术的阐述，更多的是站在网页制作规范化的角度来看待页面的SEO。

提高源代码的可用性能够有效提升SEO的效果，这个案例在某个侧面也证明了这一点猜测，同时也给了正在SEO的我们一个良好的启发。

图1  seobook.com网站截图

一、seobook.com网页布局

独孤天骄首先介绍一下SEOBOOK，《SEOBOOK》是国外的一本SEO经典之作，专业人士称之为“SEO圣经”，可想而知该著作在行业内的影响力。Seobook.com的站长SEO研究院的部分文章也提及到，就不再重复了。让我们打开seobook.com的主页，去除页面内数据内容，保留布局代码如下：

<div id="header"></div>
<div id="nav"></div>
<div id="container">
<div id="content">                 
<div class="post"></div>
                                  </div>             
<div id="sidebar"> </div>
<div id="footer"></div>

效果如图2所示。在本例中定义的header容器，用于定义网站的logo；nav容器放置导航内容；footer定义网站底部导航；container容器分成2个子容器，其中content容器用于放置网站主题内容，sidebar用于放置搜索引擎；在content容器中的post子对象用于放置单个文件块。

图2　seobook网页布局

采用结构清晰的网页布局，有助于网络蜘蛛检索网页时区分主要内容和次要内容。

二、seobook.com导航设计

seobook.com的导航设计采用了文字导航配合背景图片的方式，样式表导航部分的代码如下：

#nav {
                BACKGROUND: url(images/span_bg.gif) repeat-x; MARGIN-BOTTOM: 45px; WIDTH: 100%; HEIGHT: 58px; TEXT-ALIGN: center
}
#nav UL {
                PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px auto; WIDTH: 835px; PADDING-TOP: 21px; LIST-STYLE-TYPE: none
}
#nav UL LI {
                FLOAT: left; FONT: 2.4em 'Trebuchet MS', Verdana, Arial, sans-serif; HEIGHT: 29px
}

样式中定义了id选择器nav的样式，以及nav容器元素ul和li的样式，代码如下：
 

<div id="nav">
                <ul>
                <li><a href="http://www.seobook.com/buy-now.shtml">book</a></li>
                    <li><a href="http://www.seobook.com">blog</a></li>
                  <li><a href="http://tools.seobook.com">tools</a></li>
                  <li><a href="http://www.seobook.com/glossary/">glossary</a></li>
                  <li><a href="http://www.seobook.com/conferences/">events</a></li>
                  <li><a href="http://video.seobook.com">videos</a></li>
                  <li><a href="http://www.seobook.com/archives.shtml">archives</a></li>
                  <li><a href="http://www.seobook.com/rf/">aff</a></li>
      <li><a href="http://www.seobook.com/about.shtml">about</a></li>
   </ul>
</div>

导航效果如图3所示。

 
图3  seobook.com导航

seobook.com使用了CSS+DIV方式，如上面的代码所示，导航部分结构很清晰，这有利于网络蜘蛛识别并抓取下级页面。

三、seobook.com的图片处理

在seobook.com中仅用了少量的Gif图片作为网页的局部背景和小图标，虽然这种方式牺牲了部分视觉效果，但提升了网页访问速度。

seobook.com定义网站logo采用了一种较特别的方式，将网站logo作为id选择器的背景。代码如下：

#header {
                BACKGROUND: url(images/logo.gif) no-repeat; MARGIN: 0px auto; WIDTH: 850px; HEIGHT: 169px; TEXT-ALIGN: left
}

在header对象中的链接方式如下所示：

<div id="header">
                <a href="http://www.seobook.com" title="Search Engine Optimization Book."></a>
</div>

这种方式的好处是：在保证各个分页都有指向首页的链接情况下，即使图片因网络影响加载很慢或无法加载也不影响SEO效果。

四、seobook.com的主题和关键字分析

虽然seobook.com的网页主题定义，并没有严格按“主题_栏目名称_网站名称”的方式命名，但可以看得出标题中始终体现了热门关键字“SEO”，代码如下：

<title>Aaron Wall's SEO Book.com</title>
<title>Buy The #1 Ranked SEO Book Today! </title>
<title>About Aaron Wall of SEO Book.com</title>
<title>Free SEO Tools & Search Engine Optimization Software</title>
<title>Search Engine Marketing Glossary - SEO & SEM Industry Dictionary</title>
<title>The SEO Conference Calendar</title>
<title>SEO Videos</title>
<title>Aaron Wall's SEO Book.com | The Archives</title>

把每页的主要内容作为重点关键字，所以seobook.com关键字定义策略采用的是“热门关键字+重点关键字”的方式。为了进一步验证这一策略，在英文google.com中输入关键字“seo videos”进行搜索，结果seobook.com出现在搜索的第一名。如图4所示。

图4　Google搜索结果

五、seobook.com的站点地图

seobook.com也专门针对搜索引擎，建立了站点地图文件，如图5所示。

站点地图（sitemap）有利于搜索引擎快速抓取站点内的网页。Google的sitemap协议xml代码如下：

<?xml version="1.0" encoding="UTF-8"?>

< urlset xmlns="http://www.google.com/schemas/sitemap/0.84">

< url>

< loc>http://www.example.com/</loc>

< lastmod>2005-01-01</lastmod>

< changefreq>monthly</changefreq>

< priority>0.8</priority>

</url>

</urlset>

图5　seobook.com站点地图

协议说明：

     loc：页面链接地址。
     changefreq：页面\更新频率。
     lastmod：页面最后修改时间
     priority：页面的优先级

当然，我们都知道，SEOBOOK.COM绝对不是单单因为网页源代码的规范而在Google上面占据良好的排名，网页的规范制作只是排名的一小部分而已。不过通过上面的介绍，相信读者会对网页规范的重要性有个简单的了解，同时对SEO搜索引擎优化有一个较为大概的轮廓。

参考文献：
《精通Web标准建站：标记语言、网站分析、设计理念、SEO与BI》，王建编著，人民邮电出版社出版