咸阳信息港

当前位置:

zblog三栏主题的优化

2019/11/09 来源:咸阳信息港

导读

z-blog三栏主题的优化A5任务 SEO诊断选学淘宝客 站长团购 云主机SEO博客在前一段时间曾为Bard自己的生日做了一个简洁的

z-blog三栏主题的优化

A5任务 SEO诊断选学淘宝客 站长团购 云主机

SEO博客在前一段时间曾为Bard自己的生日做了一个简洁的三栏主题,当然就是目前正在使用的这个。

这个三栏主题Bard在做的时候只用了一天的时间,而且一天内把广告什么的全部都加好了,因此当初除了内部链接策略外没有十分注重SEO搜索引擎优化,这对使用者来说是十分不友好的,因此在Bard来北京求职并且尚未有人要的时候,对自己的博客适当SEO,各位使用三栏主题的先生可以参考一下Bard的优化方法,对Bard做的不够好的地方予以指点。

1、将主体部分的代码前移

首先这个主题主题部分的三个部分分别是#Divsidebar、#Divmain、#DivHeadlines,(PS:不管这三个名称是不是符合规范,当初Bard为了方便修改,暂时这么写的。),并且上面依次是#DivnrvBar、#DivTop,下面是#DivBottom。除此之外,这些DIV元素的顶层被#Divmiddle、#DivPage包裹,简图如下:

如上图所示,由于Divsidebar元素在主体部分的前面,因此这将文章主体部分的内容大大推后,使页面不能够突出文章,因此搜索引擎对其的友好度会大大降低,并影响排名,这个时候,我们应该想到:如果把Divsidebar这部分内容放到后面,而又不影响页面的布局就好了。就在这个时候,我们应当可以想到Div元素的定位:position属性!

对,主体部分我们可以将代码顺序任意写,而只需要设定#Divsidebar、#Divmain、#DivHeadlines这三个Div元素的定位即可,例如我们可以在s中将这三句代码这样修改:

#divSidebar{

float: left;

width: 21%;

margin: 0px;

padding: 0px 0 10px 0;

background-color: #EAFAFD;

border-right: 1px solid #cccccc;

}

#divMain{

float: lfet;

width: 54%;

padding: 10px 0 0 10px;

}

#divHeadlines{

float:right;

width: 21%;

background-color: #EAFAFD;

border-left: 1px solid #cccccc;

padding-right: 0px;

}

修改为

#divSidebar{

float: left;

width: 21%;

margin: 0px;

padding: 0px 0 10px 0;

position: absolute;

left: 0;

top: 141px;

background-color: #EAFAFD;

border-right: 1px solid #cccccc;

}

#divMain{

float: lfet;

width: 54%;

margin: 0 0 0 23%;

padding: 10px 0 0 10px;

}

#divHeadlines{

float:right;

width: 21%;

background-color: #EAFAFD;

position: absolute;

top: 141px;

right: 0;

border-left: 1px solid #cccccc;

padding-right: 0px;

}

与此同时,这种做法将会导致一个比较不好的结果,那就是底部版权声明部分的东西仅仅跟在主体,也就是说,当主体部分内容不够多,高度比较矮的时候,版权声明部分就比较靠前的位置,这也是Bard需要高手指点的地方。

期待您的回答!

设备电焊/切割设备
部位养生
爱情诗句
标签

友情链接