有用的排版技巧提升你网站的可读性

商摆小路 · 发表于 2012-08-02 15:28:52

　　排版在网页设计中经常被忽略。其实这是很傻逼的，因为注重网页排版确实可以提高你的网页设计水平和可读性。下面，我列出了10个非常有用的排版技巧让你的网站看起来更好。

　　1、创建样式库

　　让你的网站产生视觉震撼的一个简单高效的方法是给特殊的页面创建特殊的样式。例如，创建一个.warning的CSS类来向你的用户显示“警告”。

　　2、正确使用标点符号

　　如果你想提升你的排版水平不容忽视的一点是正确使用标点符号。例如，引号经常用双撇符号代替(译者注：我想作者要表达的意思应该是全角符号和半角符号的区别，就像中文的引号和英文的引号不同一样)。

　　3、关注对比

　　即使你的网站有很好的排版了，另一个需要注意的是对比。如果你的页面背景是中灰色，那么不要使用深灰色的文本，否则你的内容很难看清，尤其是对一些年纪比较大的或视力差的人。

　　总之，除非你的网站是关于黑客、黑帽seo或哥特摇滚的，不然你应该使用浅色背景和深色字体来保证清晰的对比度增加你网站的可读性。

　　4、代码部分使用等宽字体

　　如果你是一位开发者(就像大部分读这篇博客的人)你可能想贴一些代码在你的博客里。如果是这样，请使用等宽字体。那么，什么是等宽字体?它就是字母和字符占相同水平宽度的字体。

　　5、按级别来排列标题和文本

　　为了增加可读性，给标题、介绍段落和常规文本创建标签层级是很重要的，这样你的用户可以看清你的文章结构并能很快的找到他们感兴趣的部分。

　　6、不要使用过多的字体

　　为了确保可读性和专业性，你的网页上不应该使用超过3种字体。使用过多的字体会干扰你的用户而且让你的网站看起来很乱。相反，较少的字体让你的网站显得干净易读。你可以标题使用一种字体，正文使用一种字体，最后 logo或副标题使用另外的字体。

　　7、只给链接的文本加下划线

　　在我上网的12年中，浏览器用在链接的默认样式一直是蓝色文本加下划线。虽然这个蓝色经常被改成另外的颜色，但下划线一直被当做是链接的常规样式。这就是为什么除了链接你不要给其他的东西加上下划线的原因。否则，这可能对你的用户造成很大的困惑。

一天上百度前三 · 发表于 2012-08-02 16:30:05

这些排版方法很好很有用

amy328 · 发表于 2025-11-08 12:49:45

分析得很透彻，很多细节都说到点子上了～

不在那岸边 · 发表于 2025-11-10 19:15:29

楼主太厉害了，整理得这么详细，必须支持

		自动登录	找回密码
密码			加入怎通

[其他] 有用的排版技巧提升你网站的可读性

浏览过的版块