网站95%的内容是文字。好的排版让阅读变得轻松愉快,差的排版则会让用户眼睛疲劳、快速离开。本文分享实用的网站排版技巧。
字体选择原则
一个网站通常只需要2-3种字体:一种用于标题(可有装饰性),一种用于正文(必须清晰易读),可选一种用于特殊强调。全文使用单一字体族也是一个安全且高级的选择。
中文字体推荐
思源黑体(Noto Sans SC):Google出品,免费商用,适合正文。思源宋体(Noto Serif SC):优雅的衬线字体,适合标题和文化类网站。阿里巴巴普惠体:免费商用,风格现代简洁。
字号层级系统
正文建议16-18px(桌面端),这是浏览器默认字号,也是最佳阅读尺寸。标题按比例放大:H1约2倍正文、H2约1.5倍、H3约1.25倍、H4约1.125倍。
行间距和段落间距
行间距(line-height)是影响阅读体验最重要的排版参数之一。正文建议1.5-1.75倍行高,标题建议1.2-1.3倍。段落间距应明显大于行间距,通常设置为1-1.5倍行高。
每行字数控制
研究表明,每行45-75个字符(约中文22-35字)是最佳阅读宽度。太短会让读者频繁换行感到疲劳,太长则容易读错行。在CSS中设置max-width: 65ch即可实现。
对比度和可访问性
文字与背景的对比度至少应达到WCAG AA标准(4.5:1)。纯黑(000)文字配纯白(FFF)背景对比度过高反而刺眼,建议使用深灰(333-555)配浅色背景。