教你测试手机网页的五大方法.pdfVIP

教你测试手机网页的五大方法 我们知道手机浏览器的使用量每天都在增长 ，根 St at Co unt er的统计数 ，手机和平板的使用量 约占30%的网络流量 ，这意味着消费者耗费在 移动版网页上的时间比以往任何时候都高。可即使具 备诸如移动端优先的响应式设计 ，由于目前设备尺寸和种类的繁杂 ，在加载前对终端屏幕进行测试 也是压力山大 的。 在不久的将来 ，移动端会让桌面端的设备黯然失色。 在移动终端上进行网页测试有很多不同的方法 ，但是这些方法良莠不齐。以下提供5种不同的测试 手机版网页的思路供你参考 ： 1、在真正的移动设备上测试 在真正的设备上测试手机版网页总是最好的 ，毕竟模拟器的拟真程度始终是有限的 ，有些体验的细 节无法完全模仿出来。用户体验包含的因素很多 ，网络的影响 ，像素密度带来的视觉效果 ，各种视 觉元素的实际大小 ，网页的实际加载时间 ，等待都还是实际的设备来的真实。 当然 ，彻底的测试是不现实的 ，时间与金钱是每个项目的重要影响因素。不过 ，在移动端设备测试 套件上投资终归是没错的 ，尤其是当你面对一整套面向客户 的服务的时候 ，这套测试是非常有必 要的。一般而言 ，这样的一个测试套件中 ，会由当前最流行的硬件设备组成。如此一来 ，测试面向 的情况和用户所面临的情况是 1:1完全对应的。Brad Frost 曾经写过一篇文章专门探讨如何进行这种 测试 ，虽然文章稍微老了点 ，但是文章的思想是完全没有问题的。 如果这样的测试套件超过了你的预算的话 ，那么你至少还可以拿自己和周围朋友的手机来进行测试 ，一般而言 ，能覆盖iO S和A ndro id平台就够了。 2、使用iO S与A ndro id的虚拟机测试 在缺少合适的硬件设备的前提下 ，软件模拟器还是相当不错的。这些模拟器原本就是拿来测试iO S 和A ndro id 的本地应用的 ，内置的浏览器也尽可能地还原了它们在真实设备上的使用情况。之所以 说是尽可能 ，是因为它始终还是无法完全模拟真实的网络状况、加载时间、触 摸体验、各元素的视 觉大小以及其他的细节。好在内置的渲染引擎功能仍是等同的 ，它依然可以帮你找到跨浏览器所存 在的问题。 iO S模拟器内置在X code当中 ，iO S开发者可以轻易调用。而A ndro id 模拟器则包含在A ndro id SDK中 ，三大平台上都有。目前甚至还有第三方的独立的模拟器可以供你使用 ，不过是否能达到原 生模拟器的效果 ，还需要你根 实际产品来进行判断。 3、在BowserSt ack中测试 如果你没有足够的设备 ，也不想安装巨大的SDK套件然后调用模拟器来进行测试的话 ，仍然有办法 可以帮你解决问题。BrowserSt ack就是这样的一种网络服务 ，它可以帮你测试网页在桌面端和手机 端的浏览效果 ，方便专业的web开发者。 目前 ，BrowserSt ack提供的完整服务是收费的 ，它的免费部分是帮你进行测试并截图保存。当你付 费之后 ，你测试网页在不同设备上的浏览效果 的时候还可以进行交互 ，掌控更多的细节。即使你拥 有整套测试套件 ，BrowserSt ack服务仍然能帮你发现更多容易忽略的细节。 、使用Respo nsinat o r测试 开发者总是力求在真实设备上测试网页效果 ，至少得在模拟器里面运行看看效果。但是现实生活总 是残缺的 ，以上两种状况可能你都没机会实现。还好目前网上有很多其他的方案可以拿来测试 ，通 常这些工具都通过调整桌面浏览器的尺寸来实现。在这些花哨的服务中 ， 我们主要推 荐Respo nsinat o r。 你只需要进入Respo nsinat o r网站 ，输入你要测试的网页的URL ，它就会产生实时的预览 ，这些预 览中包含了目前主流的硬件设备的预览效果 图。坦率的说 ，它更接近于对网页进行一个大概的“健 康检查” ，非常有帮助 ，但说无法解决所有的问题。严格意义上来将 ，所有的类似服务都无法达到模 拟器的效 果 ，就更不用说实际设备测试了 ，因为本质上来说 ，类似Respo nsinat o r这样的服务还是 基于你的桌面端浏览器 ，这与你的移动端浏览器以及它的模拟 器有着本质上的差别。 5、调整浏览器 正如 中所说 ，这些第三方服务本质上就是调整浏览器尺寸 ，然后显示调整后的网页渲染效果。 所以 ，很多开发者会直接调整浏览器尺寸来测试这些响应式的 移动端网页。如此一来 ，你可以一边 写代码一边测试 ，也不错。但是这种方法从本质上来说算不得“移动端测试” ，它只是更方便用来测 试网页的响应是否正确 ，甚