先看现象。正文在移动端显示为 11 像素,行高也偏紧,用户需要双指放大才能读。移动端体验报告里出现文字过小的提示。

把日志和配置对完,能解释这个现象的基本就这几处。桌面样式直接下放到移动端,没有做覆盖。另一种情况是媒体查询里的字号没有覆盖默认值。

不容易想到的是,为了塞下更多内容刻意缩小了字体。

先统计移动端实际字号

curl -s https://www.example.com/ | grep -o 'font-size:[^;]*' | sort -u

正文最小设为 16px

@media (max-width: 768px) { body { font-size: 16px; } }

剩下的就是确认行高不低于 1.5

line-height: 1.6;

隔了一天再看,现象没变,说明不是偶发。

那几天正好在做别的变更,先把时间线对齐才敢动手。

改完先别撤,确认这几项。移动端正文无需缩放即可阅读,停留时间有所回升。

提醒一点。字号调大后容器高度会变,原本固定的卡片可能溢出,改完在三种常见屏宽下各看一遍,别只测一台手机,横屏也要看一眼。如果同一现象隔几天又出现,说明根因没找到,别当偶发处理。

作者 9823189