K9 通用版 博客版 主题版 地方门户版 企业版 |   企业(ASP) 分类 使用 分享 疑问 模板 建议 帮助 错误 其他
+新建主题 [Ajax]
填写帐号密码即可完成注册
+新建话题 最新回复排序 最新主题排序 精华帖子

SEO最简单优化: 增加内容和HTML代码比 (SinCS佳作)

1Next >

刀河 发表于:11-01-01 12:16 [添加收藏] 楼主 [回复] #Top#
刀河 人气:186 积分:532 金币:4061
KC元老
SinCS的 老文章被我翻出来了
分享下, 文章中举的例子可以举一反三.

另外,能否加一个代码高亮的css,我们这是技术论坛哦??这个dz做的很不错.

--------------
SEO优化办法有N种,传统的META信息、H1写标题、目录结构等等,算不上什么优化,那些更是建站的基础知识。

那什么叫有技术含量的优化?其中的一种就是内容和HTML代码比的优化。


就像HTML语言的定义一样,HTML代码其实就是构造语言,是用来构造页面结构,从访客角度上讲,HTML代码就是视觉效果表现方式,访客根本不会去关注HTML代码。

可爬虫不一样,它可以分析,抓取一个页面后,删掉所有的HTML代码,即<[^>]*>部分,就可以获得有效内容及HTML代码比


咱们都知道XHTML页面有利于收录和排序,其中的一个重要原因就是采用XHTML结构,可以提高内容和HTML代码比。但是页面很漂亮,比如有边角、滑动门等效果的时候,你不得不写上很多JS代码和HTML代码去构造模型,这样直接减少了这比例关系。


那我们如何增加这比例?增加内容?不……,虽然增加内容也是一个办法,但页面太大的话,也并不利于爬虫的抓取。

在保持页面内容不变的情况下,我们需要想方设法去减少HTML代码,如:

很多人喜欢这样写H1:<h1 class="title">这里是标题</h1>

众所周知,一个页面不会出现两个H1,如果有两个,那好比一个人身上长着两个脑袋一样很难看。这不仅是常识,也是标准。所以给h1加上这些那些class或id是画蛇添足。

应这样写:<h1>这里是标题</h1>

然后样式需要在CSS中定义。

这是很简单,那页面中有圆倒角如何做?网上有N多办法,其中最典型的就是HTML+CSS实现圆角矩形,HTML代码部分如下:
<div class="panel">

  <DIV class="t-o b1"></DIV>

  <DIV class="t-o b2"></DIV>

  <DIV class="t-o b3"></DIV>

  <DIV class="t-o b4"></DIV>

  <DIV class="content">

    <!-- 这里放内容 -->

    <DIV class=clear></DIV>

  </DIV>

  <DIV class="b-o b4"></DIV>

  <DIV class="b-o b3"></DIV>

  <DIV class="b-o b2"></DIV>

  <DIV class="b-o b1"></DIV>

  <DIV class="break"></DIV>

</div>


其实,我们完全不必用这些代码,可以简化到:
<div class="panel">

    <!-- 这里放内容 -->

</div>


毫无疑问,这样可以很明显的减少HTML代码,当然,光这样写是失去了圆角效果,效果我们可以借助JS加上。

你完全可以用纯粹的JavaScript代码来写,为了方便,我们采用jQuery来写:

jQuery(function($){

$('.panel').prepend('  <DIV class="t-o b1"></DIV><DIV
class="t-o b2"></DIV><DIV class="t-o
b3"></DIV><DIV class="t-o b4"></DIV><DIV
class="content">').append('<DIV
class=clear></DIV></DIV><DIV class="b-o
b4"></DIV><DIV class="b-o b3"></DIV><DIV
class="b-o b2"></DIV><DIV class="b-o
b1"></DIV><DIV class="break"></DIV>');

})


需要注意的是,这个JavaScript代码要写到一个独立的js文件中。


如果页面中,用到多个圆角,则只管设置class为panel即可。


这样,我们可以减少HTML代码,实现了增加内容和HTML代码比的目的。

在不牺牲用户视觉效果的情况下,给爬虫看一个干净的页面代码,并且在网速相等的条件下,一定的减少抓取时间,有利于抓取,毫无疑问,也将有利于搜索引擎的排名。


除了这个圆角外,滑动门等,完全可以用jQuery进行代码优化,说点不客气的话,国内常用的那些滑动门实在是恶心,还得加一大堆没用的id,其实滑动门可以做的更简单。

HTML代码先贴出来欣赏欣赏,jQuery代码谁有空补上,我最近比较忙,暂时不写了:

<dl>

    <dt>滑动门标题1</dt>

    <dd>滑动门1对应的内容</dd>

    <dt>滑动门标题2</dt>

    <dd>滑动门2对应的内容</dd>

     ......

</dl>

hucaoshan 发表于:11-01-01 14:10 沙发 [回复] #Top#
hucaoshan 人气:12 积分:19 金币:99
非常感谢!!正需要这样的教程
china888 发表于:11-05-26 11:45 板凳 [回复] #Top#
china888 人气:5 积分:34 金币:205
学习一下 看看是否适用
不想上网 发表于:11-05-26 13:47 4楼 [回复] #Top#
不想上网 人气:242 积分:1059 金币:2883
KC元老
这个还是不错啊
lanrennet 发表于:11-05-27 11:34 5楼 [回复] #Top#
lanrennet 人气:113 积分:949 金币:5089
KC元老
给力
gou360mend 发表于:11-06-02 10:48 6楼 [回复] #Top#
gou360mend 人气:151 积分:399 金币:1222
可惜看不懂,,,
zongxiao08 发表于:11-06-03 12:10 7楼 [回复] #Top#
zongxiao08 人气:145 积分:1044 金币:3553
我也看不懂,,,
lifetraveler 发表于:11-06-05 00:45 8楼 [回复] #Top#
lifetraveler 人气:5 积分:229 金币:415
非常感谢!!正需要这样的教程

1Next >

发表回复

帐号 匿名发布 审核后可见 [加载完整在线编辑器]
内容
验证码
KingCMS 内容管理系统

关于我们 联系我们 广告报价 付款方式 站点导航

Copyright © 2004-2015 Focuznet All rights reserved.

广州唯众网络科技有限公司 粤ICP备08008106号