检查移动端与桌面端的差异,核心是判断同一套“网站空间域名”在两种访问环境下是否返回了不同的页面结构、资源或跳转。实际操作中,最常见的差异来自响应式布局、独立移动域名、按UA分发的缓存,以及图片和脚本的加载条件。先确认差异是否存在,再决定改代码、改配置还是改内容。
移动端和桌面端看到的内容不同,原因通常落在三处:页面本身是自适应还是独立版本、服务器是否按设备返回不同内容、缓存是否把两种版本混在一起。三类问题的检查方式和代价差别很大。
判断顺序建议从“同一URL在两种UA下返回什么”开始,而不是先看页面外观。外观差异可能只是断点问题,返回内容差异才涉及索引和排名。
可以实际执行的步骤:用命令行工具分别以桌面和移动的User-Agent请求同一个URL,比较返回的HTML、状态码和跳转。
curl -A "Mozilla/5.0 (iPhone; CPU iPhone OS 17_0 like Mac OS X)" -I https://example.com/page
把-I换成直接输出正文,再和桌面UA的结果对比。重点看四项:
<title>、<h1>和主体文字是否一致。rel="canonical"指向哪里,移动版是否错误地把自己标为规范页。Vary响应头是否包含User-Agent,这关系到缓存会不会串版本。如果两端返回的HTML几乎相同,只是CSS不同,那问题在样式层;如果HTML明显不同,就进入内容与索引层的检查。
返回内容一致,不代表两端都能被正常抓取和索引。需要分别核对以下几点,且不同搜索引擎的支持情况要各自验证。
判断结果:若移动爬虫被robots.txt挡住,优先修规则;若canonical指向混乱,优先统一规范;若两端HTML一致且可抓取,则差异多半只是展示层,不必大改结构。
命令行只能看返回内容,看不到渲染后的效果。建议同时用浏览器开发者工具的设备模拟和一台真实手机交叉检查。
适用条件:页面依赖大量JavaScript渲染时,命令行拿到的HTML可能不含最终内容,此时必须以渲染后的DOM为准,而不是原始响应。判断结果以“渲染后可见内容是否一致”为准,原始HTML差异只作参考。
确认差异后,按代价从低到高处理:
下一步:选一个代表性页面,用上面的UA请求方法跑一遍,把状态码、canonical和标题三项结果记下来,再决定是先改配置还是先改模板。