网站标题之七则CSS技巧帮助你优化SEO

建站学院CSS教程 我们都知道，要构建一个对用户和Google两面都要好的网站是件不容易的事情。如果我们要迁就Google让它尽可能的发现网站的价值，那么在设计网站时就会在用户体验上大打折扣。Google的蜘蛛爬虫至今仍无法很好的辨识一些高级的Web技术，如Flash、Ajax等，它们有时候就像小孩子一样，你需要手把手的去引导和帮助它们去发现并理解网站质素。值得庆幸的是也有很多的CSS方案可以弥补这一缺陷，虽然本文标题中的"技巧"感觉有点诡计、花招的意味，事实上这也只是迎合Google的一些手段而已。试想，到底是我们存心想去"欺骗"Google，还是Google让我们的Web开发总是不得安生…

虽然搜索引擎不止Google一个，但是它们很多甚至比Google还难伺候，再者鉴于其绝对优势的影响力，所以本文探讨的重点还是放在Google上。下面七条有利于SEO的CSS诀窍，排名不分先后：

1.合理利用CSS分页技术

Google在评定长篇幅文章页面权重时存在很严重的问题，一般而言长篇幅页面较之短篇幅页面有着更大的权重。但是就用户体验角度来讲，我们往往希望用户能看完全文，并且不需要去拖拉滚动条或打开另外一张新的页面继续阅读。

解决方案就是CSS分页。这不就是文本隐藏？事实上隐藏文本跟隐藏链接、小文本等手段一样，是较为古老的干涉搜索引擎规律的作弊形式，也就是常说的"黑帽SEO"的一种，所以千万不要去用它。而CSS分页与文本隐藏的实质大不相同，它能把长文本分割成易辨识的几部分，并仍处于同一页面中，某种程度上有点选项卡的意思。在运用CSS分页的时候，也要留意Google页面权重判定的一个限制：对于一个体积较大的页面，爬虫一般不会进行很完整的抓取。

2.绝对定位

页面中越靠近顶端的内容越能得到Google的关注。Google爬虫对页面内容的"浏览"并不像人为阅读一样针对最终解析的页面效果，它们是在源码中进行抓取的，所以如果你网站的结构比较复杂，比如有很多导航、脚本或其它小玩意儿，Google爬虫可能还没蠕到主要内容就停止抓取了。在这种情况下，你可以考虑把主内容体现在页面源代码较前的位置，然后利用CSS中的绝对定位将其定位网页中适当的位置，这样用户浏览的时候主内容也就不会跑到导航菜单等元素的前面去了。

3.使用H1,H2…H*定义标题

在HTML中标题元素H1、H2等总是默认比其它文本大一些，所以长久以来很多网页设计者都习惯用DIV或SPAN代替H*标签作为标题文本的容器，然后自由的进行样式设定。但是如果这么做的话，Google将无从知晓那些文本是页面内容的标题，在一定程度上影响了页面权重的判断。事实上现在的CSS也能对H1等标签进行很丰富的样式定义，我们完全没有必要采用之前那种舍本逐末的做法。

4.标题文本SIFR图像替换法

很多人喜欢在标题上使用文本替换技术，简而言之就是利用CSS将标题文本隐藏，然后替换以外观更加丰富的图像。图像替换文本技术有很多种实现方法，具体可以参考西米CC中的图像替换文本技术一文，这些方法其中有一些考虑比较周全，也有一些相对而言比较简陋。也许你又会问了，这不又是文本隐藏么？是的，有些替换技术会对SEO带来一些负面影响，因为爬虫无法抓取到标题本身。

幸运的是，现在有一种称之为SIFR的图像替换文本方法得到了Google的认可，它可以用Flash形式来展示标题，在其中你可以灵活的使用各种字体，并且能够在代码中确保H*标签被辨识出来。

5.列表的运用

现在大多数的SEO专家都认可了一个事实，那就是关键字密度并不是影响页面权重的主要因素，也就是说你的关键字在页面中出现20次还是5次对权重不会有实质性的影响，相反密度过大可能会被认作是作弊性质的关键字堆砌。但是假如你不是为了SEO，而是真的需要不断的重复一些字词该怎么办呢？那么就把它们放在列表标签里吧，不论是无序列表还是有序列表，Google不会将其中的字词重复视为作弊手段。

如果你不希望UL或OL以列表的形式展示在网页中，你可以用CSS改变其外观样式，使其与页面融合得更加和谐。有些牛人甚至把整站都用列表来实现，完全不把表格、DIV甚至SPAN运用到布局中。

6.友情链接页Nofollow属性

Nofollow属性是由Google领头新创的一个标签，目的是尽量减少垃圾链接对搜索引擎的影响，只需在链接标签中加入rel="nofollow"即可。这种情况下，相当于告诉搜索引擎，该链接所指向的网页非我所能控制，对其内容不予置评，这样搜索引擎在计算目标的网站的链接广泛度时，将会把这个链接排除在外。

Google在鉴定页面权重时，会特别关注那些包含很多外链的页面上，使用Nofollow能让Google不会把那些友情链接页误认为是很重要的页面。别把权重浪费在一些无关的页面上，要尽量把权限集中到重要的页面上，一个rel="nofollow"属性能很好的避免权重的浪费。

7.纯CSS导航菜单

很多人以为纯CSS菜单并不会对SEO产生实质性的影响，所以在设计的时候还是很习惯的加入一些JS或其它东西来增强菜单的动态效果。事实上如果要说纯CSS菜单有什么好处，其原理就类似为什么我们要抛弃表格而采用DIV布局一样，精简扼要的页面代码能使页面加载速度得到很大的提高，这在spider爬行时是非常有利的，否则对页面的收录及权重肯定会有一定的影响。更何况现在CSS强大的样式控制能力，足够让我们制作出实用而又精巧的导航菜单。

以上所论述的七个方面，并不是什么很高级的知识或技术，也不会对一个网站的SEO效果产生决定性的作用，但不可否认的是它们或多或少会有些正当合法的帮助，而且有助于让你把CSS由一种技术提升为一种理念。如果说你觉得SPAM对SEO效果更明显，我只能说那是种很愚蠢的想法。顺便说一句，我并不喜欢什么白帽SEO的概念，对我而言一种方法或手段要么就是SEO，要么就是SPAM。