园子博客网站布局调整
园子又开始折腾网站了,本次主要是把博客的左右栏做了下对调,以更便于展示 AdSense 广告。毕竟,爱国也是需要金钱滴嘛。本文主要记录下更改过程与思路,为以后的继续折腾铺好道路。
声明:本文只做更改过程记录,不属于技术文章,叙述方式上可能有些差强人意,请理解哈。
先上个最终效果图,再说过程:

园子博客网站布局调整后的页面
一、首先是更改网站整体的宽度以及左右栏对调,步骤如下
1.修改css文件中的 #sidebar,将宽度由原来的200px更改为350px,宽度增加了150px,原来的左浮动改为右浮动。
2.修改 #main 宽度,原来的为715px,调整后为597,宽度缩减了118px。右浮动更改为左浮动。
3.更改 #wrap 宽度,原来的 948px 改为980px,增加了 32px。
经过以上的调整,园子博客整体宽度已经变为了980px,原来是960px。并且左右栏已经成功对调过来了。
二、网站图片的修改与优化
1.去掉分类图片的显示,即原来出现在文章右侧的分类图标。
2.更改了 feed 订阅图标显示,更改为更加直观的三行显示。
3.header.jpg 宽度 由 948px 改为 980px。
4.bgw.gif 宽度由 960px 改为 992px。
5.searchbox.gif 宽度由 183px 变为 333px。
三、网站广告大小以及位置的调整
1.去掉原来页面顶部的 728×90 广告。
2.去掉 single.php 300×250 广告。
3.去掉 原来文章页面底部 468×60 大小的图文广告。
4.增加右侧栏广告,首页面显示两个,其它页面显示三个,大小都为336×280图片广告。
四、最后一些CSS细节的优化
1.更改 .post h2 的右边框线显示。
2.更改 .comment .info 宽度,由 584px 改为 466px。
3.更改 #comment 宽度,由691px 改为573px。
4.在 #submitbox .submitbutton 属性中,增加了 padding-right: 25px;。
5.#searchbox 宽度由179px 变为 329px。
6.#searchbox .textfield 宽度由 155px 变为305px。
7.友情链接更改为双排显示。
五、一些总结
本次更改主题受到了 记忆盒子 的启发,在此致谢一下!
原来的 adsense 广告点击率一直是在 0.5% 左右徘徊,不过所幸单价还不错,本次更改网站布局的最终目的也就是希望能提高下广告点击率。
并且很重要的一点,网站文章广告中不会再穿插广告,这样用户体验也会好很多。用户体验好了,不知道那些可爱的读者们会不会点击下广告来庆祝下呢。哈哈。
人生很精彩,我很阳光。我会一直折腾下去。
附:园子推荐一些 Adsense 资源:
Google Adsense的秘密全集:
- 序言:如何使用本书?
- 怎样通过Google AdSense赚到钱
- 开始使用Google Adsense
- 如何优化广告提高点击率
- 用色彩提高你的点击率
- 如何最大化广告的可见度和响应度
- 学会控制AdSense广告
- 巧用Google搜索框黏住易变的访问者
- 网站内容建设的11个技巧
- 巧用Adsense渠道跟踪实现最大化的收益
- 论坛中应用 AdSense 的技巧

