SEO优化之DIV+CSS代码的优化策略

2011年5月13日 60点热度 0人点赞 1条评论

           一个好的网站程序对网站整体的优化起着不可忽视的作用。现在大多网站都开始使用日趋主流的div+css对网站进行重构,div+css的好处除了使代码简洁改版方便之外,我们对网站进行SEO也是有好处的,但并不是说div+css在SEO中效果一定大于table布局,而是指对网站做SEO优化的时候能省掉不少麻烦。

div+css重构网站的好处:

1、提高搜索引擎对网页的索引效率

提高spider爬行效率,能在最短的时间内爬完整个页面,这样对收录质量有一定好处;
由于能高效的爬行,就会受到spider喜欢,这样对收录数量有一定好处。
避免了表格嵌套,搜索引擎蜘蛛爬行Table布局的页面,遇到多层表格嵌套时,会跳过嵌套的内容或直接放弃整个页面,不少使用传统的table布局的网站,很多页面在搜索引擎快照中显示不完整。

2、表现与内容相分离

将设计部分剥离出来放在一个独立样式文件中,HTML文件中只存放文本信息,方便网站改版,只需要对css进行重构便可完成网站的改版需要。

3、提高页面加载速度

 大大的减少了网页的代码,节省服务器带宽。
提高网页加载速度,使用户打开页面的速度大大提高,提高用户体验。

Div+css设计网页时需要注意的问题:

css部分与页面代码应该分离,将css单独封装在一个.css文件中调取。
 使用id与class,尽量避免使用style=”"。
 尽量使用标准的css命名规范,这是检验一个设计师是否专业的一个小标志。
 浏览器兼容,目前主流的浏览器有IE6,IE7,Firefox,div+css容易产生兼容问题,设计时需要对三个浏览器进行不断调试。
尽量使用css的缩写以节省代码,例如margin:10px 20px 10px 20px;可以简写为margin:10px 20px;

Div+css设计网页时需要注意的SEO问题:

 代码的顺序,将重要的代码部分显示在前,不重要的显示在后,而视觉效果不变。例如利用float可将左右部分代码调换位置。
 H标签的使用,h标签在搜索引擎算法中占据比较重要的位置,h1—-h6标签都对SEO有一定的帮助。
 Javascript代码的封装。页面中不少javascript代码干扰了搜索引擎分析页面内容,可以将javascript代码封装在一个.js文件中外部调用。
每个图片都要加入alt注释,如果是页面代码的构成内容比如某个边角图片,则可以将alt留空,即alt=”",当然去掉alt=”"也未尝不可,只是如果要遵循标准的话,保留alt=”"是必要的。
无用代码的封装。将对SEO产生干扰或者负面影响的内容使用

DIV+CSS设计中几点误区 

 1、DIV+CSS的合理之处在于可以进行网页的统一设计管理,通过一个样式表,牵一发而动全身,只要修改样式表,就可以统一全站的风格,如果为一个页面单独做一个样式表,或者一个div就做一个样式表,没有全局设计观念,那么这个div+CSS的设计方式就完全没有必要,甚至成了累赘;
  2、像Table一样用DIV+CSS,无穷尽的嵌套,其效果与Table设计没有两样,并不会带来搜索引擎的优化效果,反而会增加页面的负担;
  3、推崇Div+CSS,却不考虑兼容性,TABLE设计由来已久,得到浏览器的广泛支持,所以显示效果很好,不会出现错位情况,但是DIV+CSS却在 部分浏览器中会发生页面错位的情况,因此在进行设计的时候也要考虑到不同浏览器的情况,进行更改和调试。

DIV+CSS的优点:

1、标准化的页面结构。
2、有利于统一设计管理。
3、可以得到搜索引擎良好的支持。
但似乎利用DIV+CSS要注意以上误区,相信站长都有很多的体会,也有更多成熟的设计理念。

 SEO优化之DIV+CSS代码的优化策略  该文章由北京SEO 编辑整理
SEO研究中心专业SEO研究机构,顶级SEO培训服务商。
转载请注明:北京SEO        http://bj.moonseo.cn

admin

这个人很懒,什么都没留下

文章评论

  • 时尚专题

    学习了 谢谢分享

    2011年5月13日