当前位置: 首页 > 图文教程 > 网站运营 > 网站优化 > SEO优化CSS篇,细节决定成败

网站优化
Baidu、Google大小更新日期与时间大全
提高采集内容的排名
论策教你如何创造优秀的SEO原创文章
论策教你如何提高google收录量(实战篇)
怎么进行关键词挖掘
如何写标题描述关键词
淘宝站内优化,提高网店流量的实用方法
草根站长实战经验 选取黄金关键字
个人站长想走的更远 网站自身的盈利模式很重要
百度快照更新进入大提速时代的注意方法
百度已经开始屏蔽带链接的博客文章
给采用CMS系统做站的站长们几点优化建议
快速更新网站内容的几种方法
Google给广大网站的搜索引擎优化(SEO)建议
创建一个方便Google处理的网站的详细建议
排除法解决网站在搜索过程中表现不佳的现象
百度 google分别喜欢什么样的友情链接
浅析网站首页的广告形式
友情连接与SEO的关系
网站成功的必备条件分析小结

网站优化 中的 SEO优化CSS篇,细节决定成败


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-17   浏览: 62 ::
收藏到网摘: n/a

 前言:SEO在网站运营中的地位已经不言而喻了,SEO说难不难,因为只要在网站制作过程中,把握一些“套路”,不要过于修饰就差不多了,这个方面站长基本都是知道的,但是SEO说简单也不简单,需要多观察、思考,耐心的去研究“细节”,方能把网站的整体排名提高到一个档次。如果对于SEO细节的把握得当,会起到非常好的收效。本人不才,将在以后的日子里,发布一系列“SEO:细节决定成败”的文章,本文以CSS优化为例,介绍一些技巧,希望能和大家一起学习探讨SEO,同时也希望大家不吝赐教,谢谢!

总的来说,DIV + CSS的网站标注设计,大家应该有了很多的了解了,我整理了一下,符合设计标准简单来讲有以下好处: 

提供最多利益给最多的网站用户

确保任何网站文挡都能够长期有效

 简化代码、降低建设成本

让网站更容易使用,能适应更多不同用户和更多网路设备

当浏览器版本更新,或者出现新的网络交互设备时,确保所有应用能够继续正确执行。

那么,我们了知道这些好处,还需要在实际当中活学活用,今天的主题是以一个实例来体现css在SEO中的灵活运用,我发现,在大多数不怎么运用标准甚至一些符合标准的网站里,都犯有这点错误,哪一点?请继续往下看。

先看图:

     

 

我就不兜圈子了,从图中我们看到有些标题是这样的:4399小游. . . 。这是一个因为长度过长而被省略的标题。

通常我们的一般是做成静态页面的,那么我们在生成标题的时候会使用类似:{limit:title,12,“. . .”},相信大家都看得懂,限制标题长度为12,过长的部分用“. . .”省略号代替。那实际该标题显示在首页或者当前页的关键字就是”4399小游. . .“,我们知道,搜索是读源文件的,我们提取该页的源文件分析:

搜索引擎看到的结果是这样的:<li><a href="http://www.4399ol.com" target="_blank" title="4399小游戏">4399小游. . .</a></li>

而不是我们想像中的完整标题:<li><a href="http://www.4399ol.com" target="_blank" title="4399小游戏">4399小游戏</a></li>

那么这样做会有影响么?答案是肯定的。站长们其实都知道,这样做该链接的文字描述权重就会分到”4399小游...“,而非”4399小游戏“上了,当然尽管我们已经在<A>中用title描述了完整的标题。

如果这样说还不明白的话,我们还可以这样来解释,很多平时喜欢交换链接的站长,使用的网站名不单单是为了带流量,而是为了某个关键词的权重和排名。SEO的灵魂就是链接,不管是外链还是内链,都有明显的‘权重传递’,如果我们限制了标题而替代以省略号,相信权重会大打折扣,这一点是毋庸置疑的。

了解了这一点,我们就会想对策。其实CSS 2.0中属性<li>就很好的为我们解决了这个问题,一个很简简单的功能就能搞定了,我们在控制<li>的时候可以这样写(为了清楚明白,附以完整代码):

以下为引用的内容:

<style type="text/css">
<!--
li {
 width:20px;
 white-space:nowrap;
 text-overflow:ellipsis;
 -o-text-overflow:ellipsis;
 overflow: hidden;
 } 
/* firefox only */
  li:not(p) { /* wtf is? pls let me know*/
   clear: both;
   }
  li:not(p) a {
   max-width: 17px;
   float: left;
   }
  li:not(p):after {
   content: "...";
   float: left;
   width: 25px;
   padding-left: 5px;
   color: #df3a0e;
   }

-->
</style>
<ul>
<li><a href="http://www.4399ol.com" titile="4399小游戏">4399小游戏</a></li>
</ul>

这样的话就轻松解决了问题。即便是超出的部分,也不会在源文件中被砍掉了,而是以完整的标题提供给搜索引擎去索引了。

其实文章前面我们也提到了,很多网站,尤其是以表格完成页面主题的网站,在”相关文章“里都会有标题超长出现,而大多数网站的处理方法就是截掉了超长部分,当然表格完成的页面也可以使用此方法,道理是一样的,大家可以去试试。

div+css标准设计有很多地方很适合SEO优化,希望大家慢慢的去摸索和尝试。

此文只是本人优化过程中的一点点体会,希望能起到抛砖引玉的作用,谢谢大家!