简单5步:让你的读者阅读更轻松(谈谈博客正文修饰)

八 14

简单5步:让你的读者阅读更轻松(谈谈博客正文修饰)

我在WordPress主题设计大赛一文中提到，大家使用的大多数是国外现成的主题模板。但是国外现成模板中，预设的字间距，行高，字体大小等并不适合中文。

(1)字间距：
由于英文单词和中文字的构成不同，使得英文主题模板的行高和字间距并不适合中文字。举个例子：英文Hello World和中文“你好”，英文的字间距其实是“字母间距”，为了使一个英文单词的字母间(h, e, l, l, o这5个字母)不过于松散，必须使用较小的字间距，而hello和word这两个单词之间其实是空格分隔的。在中文里“你”和“好”就是两个字，如果采用同样的间距就会非常紧密。

(2)行高：
英文中有些字符的比划是有下坠的，其底部称之底线，为比如g, y, j等等，而中文字符和其他大写字符的底部称为字符的基线，而且在中英文混排的时候，因为字体的选择不同，还会出现底线不对齐的现象，所以中英文的行高和字体选择会有所不同(示例图片来源：IMPark)

(3)字体大小：
英文模板中有时候会以小于10px的字体标识一些如分类，标签等非主题正文信息，但是在中文下，某些小字体在小于10px的时候就会出现点阵缺失的现象(据说微软细明体MingLiU可以到7.5px)，中文字一般以12px比较适合阅读。(示例图片来源：偶爱偶家)

(4)背景颜色、(5)字体颜色：
在大量阅读的今天，采用高对比的黑字白底，长时间阅读会使眼镜非常累。采用淡色背景，并使用深灰代替黑色作为字体的前景色是最近比较流行的做法。

根据这5点，我们来看看IMPark(左图)和AWFlasher(右图)两个友站的差异，为了防止页面布局，周边修饰，颜色等对对比效果的影响，仅截取同样面积的文本段(200×110)作比较显示。全局效果，请点击上述链接访问本尊。

上述的这些问题，只要小小的修改一下模板CSS中的<P>或<body>定义，就可以使你的博客阅读起来更加轻松。

body {
font: normal 12px verdana, arial, helvetica; /*第1步:12px字体*/
color: #333333; /*第2步:深灰色*/
background: #FFFFFF/*第3步:背景缺省一般是白色#FFFFFF，可以根据模板改成淡彩*/
}

p {
line-height: 1.8em; /*第4步:行高可以1em-2em间调整,1em是正常行高，根据需要可以拉高点*/
letter-spacing: 0.1em;/*第5步:字间距可以在0em-1em间调整，0是正常字间距*/
}

ps:对不住IMPark了，被我拿来做反面教材，其实博客本来就是很个性化的东西，博主自己喜欢就好。不过有时候看见尤其是3栏以上的模板，800固宽，再加上字挤作一堆的时候，感觉还不如看RSS reader好些。