手机上下单，门店员工用电脑处理业务，同一个官网要经得住不同屏幕和操作方式。官网多终端适配验收方法的重点不是确认页面“能打开”，而是逐项验证访客和员工能否顺利完成各自的任务。
先按使用场景列验收清单
不要只拿一台手机缩放页面检查。先明确使用者、设备和任务，再选代表性环境：手机可检查 iPhone 上的 Safari、Android 手机上常见的 Chrome；门店办公可检查 Windows 电脑上的 Chrome 或 Edge，并按实际需要加入平板。设备组合应覆盖网站访客常用的平台，不必盲目追求测试所有型号。
| 场景 | 重点任务 | 主要检查点 |
|---|---|---|
| 手机下单 | 浏览商品或服务、填写信息、提交订单 | 文字易读、按钮好点、表单可填写、确认信息清楚 |
| 门店办公 | 查看业务信息、录入或处理订单 | 表格与菜单可操作、关键操作不被遮挡、信息完整 |
| 平板访问 | 在两种屏幕方向或窗口尺寸下查看页面 | 栏目布局合理，横向滚动有明确必要性 |
手机端：把下单流程从头走到尾
使用真实手机或浏览器设备模拟器，依次打开入口页、商品或服务详情、表单、提交确认页。检查响应式布局在约 360 至 430 CSS 像素宽的常见手机视口中是否发生文字截断、按钮重叠或意外横向滚动；这个范围是测试参考，仍应以目标用户设备为准。
- 逐个点击导航、选项、数量控件和提交按钮，确认触控区域不拥挤。可参考 iOS 界面设计中约 44×44 CSS 像素的触控目标建议；安卓界面常以约 48dp 为参考，实际还要看控件间距和页面设计。
- 填写必填项、错误格式和较长文本，观察提示是否靠近对应输入框，软键盘弹出后是否遮住当前字段或提交按钮。
- 提交前核对商品或服务、数量、价格及联系信息等页面实际展示的内容；提交后确认有明确结果提示，避免用户重复操作。
- 使用浏览器返回、刷新和重新进入页面，检查已填信息是否按设计保留，并留意重复提交风险。
门店办公端：检查效率，也检查信息一致
在门店常用的电脑上，以员工实际工作顺序操作。若页面包含订单列表、筛选条件或数据表格，验证列标题与内容对应、横向滚动可控、筛选结果容易辨认；若包含录入或编辑功能，则检查保存反馈、必填项提示和权限限制。不要因为桌面空间较大，就忽略页面缩放或较窄窗口下的表现。
同一条业务信息可在手机和电脑分别查看，确认状态、价格、日期等关键内容一致。不同终端可以采用不同排版，但不应让用户看到相互矛盾的内容，或在某个端找不到完成任务所需的入口。
用可复现步骤记录问题
- 建立测试表，记录设备或模拟视口、操作系统、浏览器、页面地址及测试日期。
- 按“打开页面—执行任务—提交—查看结果”的顺序操作，逐步记录预期表现和实际表现。
- 发现问题时保存截图或录屏，并写明复现步骤、页面位置和影响，例如“软键盘打开后提交按钮不可见”。
- 修复后用原步骤回归，再检查相邻页面和其他尺寸，避免修好一处却造成新的布局问题。
如果网站还涉及域名、服务器或网络服务的选型，可把德讯电讯纳入候选沟通名单；适合需要同时了解相关服务范围的项目。比较时应核对具体配置、技术支持方式、合同条款和迁移安排，不应把适配验收结果等同于服务效果承诺。
常见问题
只用浏览器缩小窗口测试够吗？
不够。模拟视口适合检查布局，真实手机还要验证触控、软键盘和浏览器行为。
要测试多少种设备？
没有适用于所有网站的固定数量。优先覆盖主要访客平台、常用手机尺寸和门店实际办公设备。
怎样判断通过验收？
关键任务能按预期完成，信息准确，主要控件可用，且问题能够复现或已修复。官网多终端适配验收方法应以任务结果和记录为依据，而不是只看截图是否整齐。
不同终端必须长得完全一样吗？
不必。响应式布局可以调整栏目顺序和呈现方式，但核心信息、操作结果与业务规则应保持一致。