博客小改版了一下，分享一些设计和优化方面的心得

最近在批量做模板，设计上找到一些共性，回头看博客是越看越不顺眼，这不昨天晚上没忍住做了一些小改版，本文记录本次小改版的项目和分享一些在设计和优化方面的心得。

一、横向模块之间的间距改成了15px。

大家都知道我的博客是左中右结构，这种结构的好处我在之前很多文章里都提到过，在此用简短的话再提一遍：Google Adsense、百度联盟及几乎所有空间商的推荐返利广告都有三个共同尺寸，728*90、300*250和336*280，其中336*280在15.6寸及以下笔记本电脑上会因为窗口固定的投放模式而与页面的footer部分重叠，这点可参考我右侧的悬浮固定广告。所以我博客只有728*90和300*250这两种尺寸的广告，也就是如果把横向模块之间的间距改为15px，左侧部分就要从原来的152px改为142px。

间距改大了之后看着确实舒服多了。

如果你不在乎广告变现，那么横向模块之间的间距建议为30px；竖向模块的间距你只需要在这五个里面选：15px、30px、50px、80px和100px，任何一个都能找到它合适的使用位置，这来自三套模板以上的总结。

二、背景颜色改成了F5F5F5，边框颜色改成了CFCFCF，首页的置顶和推荐模块以及碎言碎语列表页取消了悬停投影。

灰色是一个万能色，它能跟所有颜色搭配。而颜色F5F5F5是肉眼可容易分辨的最浅灰色，如果降为F7F7F7你会发现在低色域屏幕上很难与周边模块进行区分，需要加个投影才能明显区分它与周边模块。这也是我首页的置顶和推荐模块以及碎言碎语列表页有悬停投影效果的原因，改为F5F5F5后，投影效果看上去就很难看了，所以我取消了。文章图片的投影我没有取消，因为有白色背景的图片。

边框颜色改为CFCFCF，在背景色为F5F5F5的容器内看着是非常舒服的，同时CFCFCF也可以作为不重要的文字颜色，比如footer里面的文字。也就是说任何网页的灰色背景模块都可以采用F5F5F5为背景色、CFCFCF为边框色的配色组合，这可以说是强迫症网页设计师的福音。

三、段落标签由<br />改为<p>。

帝国cms编辑器回车默认是<br />而不是<p>，这个在网上有修改教程。

我记得之前使用phpcms时，有一篇文章在百度搜索后效果如下图示例：

而转为帝国cms后这个搜索效果就消失了，我觉得就是缺乏p标签的原因，因为p标签本身就是段落标签，判断p标签里的strong标签才有可能形成上图示例中的效果。

改为p标签后文章就可以很方便地排版了，黄金定律：无论何种大小字体，不要加letter-spaceing，首行缩进2em，行高1.8，p标签给margin-bottom: 15px，你会看到你的文章排版非常精美，比如本文，对比之前的文章浏览体验好多了。之前段落为<br />时，行高1.5和1.8我来回切换过好几次，总感觉看着不舒服，不是段落间距大，就是看着挤，这次调好了。

以上就是本次小改版的三个方面，虽然很小，但博客看上去比之前更加舒服了，大家觉得呢？