字号、行高、行宽：目录站的可读性参数该定在哪，以及它跟排名的真实关系

目录站的排版有个通病：为了在一屏里塞更多条目，字号一路往下压。PC 端列表 12px，条目描述 12px，页脚信息 10px。看上去信息密度很高，实际效果是没人读——用户扫一眼标题，点开一个，剩下的一屏对他来说就是一片灰色噪点。

图片来源：网络，版权归原作者所有，侵权请联系删除

先把关系说清楚：可读性不直接进排名

WCAG 是无障碍标准，不是搜索排名因素。谷歌没有哪个文档说「字号小的页面排名低」。可读性影响的是用户行为——读不下去就走，走了就少一次点击，少了点击，你从数据上看到的就是停留短、跳出高、回访低。这条链路是间接的，但末端的影响是实的。

所以别把排版当 SEO 动作做，当产品动作做。判断标准也很直接：手机上打开你的分类页，不用缩放，能舒服地读完一条条目的描述吗？

中文页面的四个参数

参数	建议值	依据 / 说明
正文字号	不小于 16px，长文可到 18px	浏览器默认 16px；辅助性文字（时间、来源）可到 14px，段落正文不要低于 16
行高	字号的 1.6 到 1.75 倍	WCAG 1.4.12 要求用户覆盖到 1.5 倍时布局不塌，你自己的值应高于这条线
一行宽度	中文 40 到 60 字	WCAG 1.4.8 对中日韩文本给的是 40 个字符；英文是 80
段落间距	字号的 1.5 到 2 倍	WCAG 1.4.12 给的是 2 倍字号，这是用户覆盖后的下限

中文和英文在行宽上的差别值得单独说。WCAG 1.4.8 写的是「80 个字符，中日韩文字 40 个」。原因是中文没有词间空格，一行拉太长时眼睛找不到换行后的落点，回扫容易串行。目录站的分类页介绍、条目详情页描述都是这场景，一行别超过 60 个汉字，四十上下最舒服。

三条 WCAG 指标，检查一下不费事

1.4.4 调整文本大小：放大到 200% 不能丢内容和功能。目录站的卡片高度经常写死，字号一放大文字就溢出卡片。测法很简单，浏览器缩放到 200%，看条目卡片是不是还看得全。

1.4.12 文本间距：用户把行高覆盖到 1.5 倍字号、段间距 2 倍字号、字距 0.12em、词距 0.16em 时，不能丢内容。这条对目录站的实际意义是：别给文字容器设固定高度。用 min-height 或者 padding 撑，别用 height。装了阅读类浏览器插件的用户一覆盖样式，固定高度的容器直接切掉文字。

1.4.3 对比度：正文和背景至少 4.5:1，18pt（24px）以上或 14pt 粗体的大字至少 3:1。目录站最常见的问题是浅灰描述文字——#999 配白底只有 2.8:1，通不过。描述文字要么加深到 #6B7280 一类，要么就别用灰色。

中文排版的两个具体坑

别用两端对齐。text-align: justify 在中文里会在字与字之间插空隙，一行字数不够时拉开得非常明显，看着像排版事故。中文一律左对齐。

列表页和详情页可以不一样。分类页上条目名称 15px、一行描述 14px 是能接受的，因为用户在扫读不是在阅读。但条目详情页里的正文描述必须回到 16px 以上——那是唯一需要真正读的地方。我见过为了「统一」把详情页也压到 12px 的，那条描述基本等于没写。

还有个手机上的细节：输入框字号小于 16px 时，iOS Safari 会在聚焦时自动放大页面，用户会觉得页面跳了一下。搜索框、提交表单的输入框都给到 16px。

三个能立刻做的检查

第一，把浏览器的文字大小调到「很大」或用 200% 缩放，打开你的分类页和条目页，看有没有文字被切、按钮挤成一团、出现横向滚动条。

第二，临时把全局行高改成 1.8，看布局会不会散架。散架说明有固定高度的容器，改掉。

第三，在真实手机上数一下：不做任何滚动，首屏能看到几个完整条目。如果答案是「只有标题，描述全被截掉一半」，那描述基本白写了，要么加大字号，要么减少每屏条数。

这几项改完，通常能看到的变化不是排名，是停留时长和翻页率。它值得做，但不是因为它能让你排上去，是因为它让页面真的能用。