先看现象。移动端进页面 3 秒后弹出下载 App 的浮层,盖住 60% 的正文。百度移动适配检测提示主体内容被遮挡,移动端排名掉了十几位。

排查方向其实有限,先把可能性排一排。弹窗在首屏立即触发,正文还没被用户看到就被盖住。也可能是浮层没有关闭按钮,只能点跳转才能消失。

另外,弹窗高度用了 vh,键盘弹出时变化导致遮罩残留。

少数情况下是同一会话反复弹出,每次关闭后 10 秒又出现。

第一件事是确认弹窗的触发时机与尺寸

curl -s -A 'Mozilla/5.0 (iPhone)' https://www.example.com/post/1024 | grep -o 'app-download-modal'

再往下改成滚动过半后再提示

window.addEventListener('scroll', () => { if (scrollY > innerHeight * 1.5) showModal(); }, {passive:true});

然后加明显的关闭按钮与遮罩点击关闭

document.querySelector('.modal-close').addEventListener('click', hideModal);

剩下的就是用移动 UA 复验首屏是否还有遮挡

curl -s -A 'Mozilla/5.0 (Linux; Android 14)' https://www.example.com/post/1024 | grep -c 'modal-open'

改完先别撤,确认这几项。首屏不再出现遮挡,移动适配检测通过,移动端自然流量两周内恢复到改版前的水平。

提醒一点。引导下载可以做,但不能压在首屏正文上,移动端弹窗要可关闭、可记忆、别挡主要内容。这类问题最好一次改到位,反复小改反而容易把原因搅混。

作者 9823189