手机端建站的 7 条硬标准

1. viewport 必须设置

少了 <meta name="viewport" content="width=device-width, initial-scale=1">，手机会把页面按 980px 宽缩着显示，字小得没法读。这是模板站最常漏的一条，也是代价最低的一条。

2. 正文字号不小于 16px

14px 以下在手机上要凑近看。行高建议 1.7 以上，段落之间留空。别用「设计师觉得精致的小字」，访客不是在 4K 屏上看稿。

3. 点击目标不小于 44×44px

按钮、链接、表单里的叉，手机上靠拇指点击。44px 是行业通行下限。导航菜单项挤在一起、间隔不足，误触率会很高。

4. 图片要响应式

手机屏宽 375px，却加载 1920px 的原图，流量和等待都白花。用 srcset 让手机拿小图、电脑拿大图。这也是上一篇文章里「打开慢」的第一大原因。

5. 首屏别压重资源

首屏要尽快可见：大轮播图、自动播放视频、地图组件都别放第一屏。它们可以放在往下滚的位置，用户滚到再加载。

6. 表单要配对键盘类型

手机号输入框设 inputmode="numeric"，用户点进去直接弹数字键盘；地址栏关闭自动大写。这些属性写一次五分钟，省的是每个访客的十几次按键切换。

7. 不允许横向滚动

出现左右滑动条，通常意味着某个固定宽度元素（大图、表格、长代码块）撑破了容器。修复方法是给容器设 overflow-x 处理或让元素自适应宽度——注意是让元素变窄，不是把整页禁止滚动把问题藏起来。

怎么验收

发布前用真手机过一遍主流程：找到电话、拨出去、填表提交。模拟器代替不了拇指。本站的验收清单里把这几条列成了打勾项，可以直接用。