移动友好性测试工具
输入一个URL后,测试工具会在模拟手机视口(默认尺寸为375×812像素,对应iPhone屏幕规格)中加载页面,检查谷歌自家曾用于标记可读性问题但现已停用的常见移动端阅读障碍,并返回一份可修复的问题列表:缺失视口元标签、文本字号小于12像素、点击目标区域小于48×48像素、水平滚动、使用Flash或不受支持的插件,以及内容宽度超过视口尺寸。
测试运行方式
-
1
输入网址
包含协议的完整 URL。仅限公开页面。
-
2
页面在手机尺寸视口内渲染
默认尺寸为 375×812,可自定义。
-
3
自动检查已运行
视口元数据、文本大小、点击目标间距、溢出处理、插件。
-
4
预览并报告
渲染后的手机视图截图以及具体问题列表。
测试人员检查的内容
视口配置
是否存在<meta name="viewport" content="width=device-width, initial-scale=1">型号?若缺少该型号,移动浏览器会将手机屏幕呈现为桌面宽度,并自动缩放以适应显示,导致文字显示得非常小。
文本大小
- 所有字号小于12像素的渲染文本都会被标记,在没有缩放功能的手机上难以阅读。 许多样式指南建议最小字号为16像素。极小的标题文字可以接受,但11像素的正文内容则不宜使用。
点击目标尺寸
按钮、链接及表单控件的尺寸应至少为48×48像素(符合Google/W3C移动无障碍设计规范)。 较小的目标难以用拇指准确击中,且会显示标记。
点击目标间距
与相邻目标距离小于8像素的目标会引发误触;这些目标将被单独标记。
水平滚动
当内容超出视口范围时,系统会强制执行水平滑动,这会严重影响移动设备的用户体验。这种情况通常由缺少max-width: 100%属性的图片或无法自动换行的表格引起。
不支持的插件
Flash、Silverlight 和 ActiveX 在手机上无法正常运行。一些旧版网站有时仍会使用这些技术。
字体加载
- 大到导致渲染延迟数秒的超大网络字体将被标记。
为何这仍然很重要
谷歌于2023年12月终止了独立的移动友好性测试,但移动友好性仍通过核心网页健康指标和页面体验数据作为直接排名依据。移动优先索引机制意味着谷歌会以手机端视角抓取您的网站;移动端表现不佳的内容同样会在桌面端排名中显现。
常见修复方法
- 在
<head>:<meta name="viewport" content="width=device-width, initial-scale=1">中添加视口元数据。 - 基于媒体查询的响应式CSS:
@media (max-width: 768px) { ... }。 - 采用 Flexbox 和 Grid 布局,而非固定宽度布局。
- 设置图像
max-width: 100%; height: auto,使图像随视口缩放而缩小。 - 在小屏幕上使表格可滚动:使用
<div style="overflow-x: auto">进行换行设置。 - 请使用
rem或em设置文本大小,以确保按用户偏好进行缩放。
测试人员未能发现的问题
- 实际硬件性能表现。 使用3G网络的低端安卓手机会出现本测试工具无法模拟的延迟现象;请使用Lighthouse进行性能测试。
- 触控交互: 仅支持悬停显示、触碰时失效的下拉菜单需在真实设备上进行人工测试。
- 超越移动设备尺寸限制的无障碍功能:对比显示、屏幕阅读器支持、键盘导航,请使用专用无障碍工具。
- 在针对移动设备优化的浏览器上出现 JavaScript 错误。iOS 系统上的 Safari 浏览器有时与其他版本的 WebKit 版本存在行为差异。
常见问题
检查方式相似,但实现方式不同。谷歌已于2023年底停止提供该公开工具。此测试工具采用与谷歌相同的经典检测规则,针对无头浏览器获取的页面版本进行验证。
没错,谷歌自2020年起就将移动端优先纳入索引体系,这意味着移动端显示效果才是排名的主要依据。移动端问题甚至会影响桌面端搜索的排名表现。
不。该测试工具仅获取公开可访问的URL。对于受保护的预发布环境,请使用Chrome DevTools的设备模拟模式进行本地测试。
默认分辨率为375×812(适用于iPhone 12/13/14),可设置为390×844(iPhone 14 Pro)、360×640(常见安卓机型)或412×915(Pixel 7)。
通常耗时5至15秒,具体取决于页面内容的复杂程度。包含大量脚本的复杂页面耗时更长;测试工具会在捕获数据前等待加载事件完成并经历短暂空闲期。
相关工具
坏链检查器
粘贴页面 URL,检查其出站链接中的 404 和其他 HTTP 错误,并显示每个链接的状态码。
HTTP安全头检查器
粘贴 HTTP 响应标头,在浏览器本地检查 HSTS、CSP、点击劫持、MIME、referrer 和跨源策略。
XML 站点地图检查器
在浏览器中检查站点地图 XML,发现解析错误、缺少地址、重复 URL 以及常用站点地图字段值问题。
元描述长度检查器
测量元描述的字符数和估算像素宽度,对照编辑参考,并查看桌面端与移动端版式示意。
规范URL验证器
粘贴页面的 HTML 并检查其 rel=canonical 标签:是否存在、是否为有效的绝对 URL、是否与页面 URL 一致。
外部链接提取器
粘贴原始HTML,可选设置基础URL,即可获得代码中所有外部 http/https 链接的干净、去重列表,用于链接审计和SEO审查。
此工具还提供其他语言版本
- 모바일 호환 테스터 [KO]
- Testare för mobila enheter [SV]
- Penguji Keramahan Seluler [ID]
- เครื่องทดสอบที่รองรับการใช้งานบนมือถือได้ [TH]
- Mobielvriendelijke tester [NL]
- Mobilfreundlichkeitsprüfer [DE]
- Probador de Amigabilidad Móvil [ES]
- モバイル対応テストツール [JA]
- Thiết bị kiểm thử tương thích di động [VI]
- Testeur de compatibilité mobile [FR]
- جهاز اختبار متوافق مع الهواتف المحمولة [AR]
- Testator przydatny na urządzenia mobilne [PL]
- Testador de Compatibilidade Móvel [PT]
- Mobile Friendly Tester [EN]
- Tester per la compatibilità mobile [IT]
- Тестер для мобильных устройств [RU]
- Mobil Uygunluğunu Test Eden Uygulama [TR]