Testing 在桌面浏览器中测试移动网站

我正在使用jQuery mobile为iPhone、Android等开发一个移动网站。我希望能够在我的桌面浏览器中测试这一点，我想知道最好的方法是什么。我想我可以使用插件将用户代理标题更改为适当的值，并手动将浏览器调整为设备的宽度，但是有更简单/更可靠的方法吗

更新

---

对不起，我应该提到的是，唯一可用的硬件是Windows笔记本电脑。如果你有Mac电脑，并且安装了xCode，你可以使用模拟器。打开Mobile Safari，在所有苹果设备上指向您的网页

您也可以使用Android Emulator（但我还没有测试它是否可以从浏览器访问web）

或者，您可以使用插件（如您所建议的）

我个人将Chrome与此插件结合使用：

效果不错

我以前在任何地方都用过这个设备

您可以通过web门户/网站访问设备并对其进行控制，但这会增加成本$$$

实际设备测试将是最可靠的

相关的：

• （其他建议）

---

还有一种完美的移动设备，可以在设备上进行远程测试……尽管速度可能非常慢。如果可能的话，我真的建议至少购买一些“基本”测试设备。

应该可以很好地为您模拟Android。它准确地显示了我的手机所显示的内容，尽管我的桌面浏览器没有。Manymo是一个有很多Android手机的网站。只需单击一个并输入您的URL。有Android版本和屏幕大小等选项。

查找Chrome插件-您将能够在所有平台上模拟不同设备大小的移动浏览器。

还有一个可以用来获取您的站点在许多给定设备上的屏幕截图

---

但是，我在这里链接到的免费版本中，您可以获得的屏幕截图数量是有限制的。

在Chrome中点击F12打开开发者工具栏。然后单击“切换设备工具栏”（平板电脑图标，左上角“选择元素”旁边）。然后，您可以选择顶部的设备进行测试。

通过使用名为Ripple Beta的Chrome插件，我获得了不错的视觉效果。糟糕的是，并没有能力添加一些定制设备，比如8英寸或9英寸或更大的平板电脑。。。但这是有效的。我不确定它是否能够在真实设备上显示一些可见的错误，但看起来很不错。

Chrome附带了UA转换器和设备度量“matcher”。在Chrome中，打开开发工具（F12），然后单击首选项图标（右下角的齿轮），然后单击“用户代理”选项卡，选择“覆盖用户代理”和“覆盖设备度量”（默认情况下，当您将UA更改为移动设备时，Chrome应自动设置该设备的设备指标）。我知道这是从Chrome 21开始提供的，可能会更早推出。@Jasper谢谢！这是我必须开始使用的一个宝石这当然是一个有用的功能，但它实际上并不运行Chrome Mobile，所以在移动设备上实际看到的内容至少有一些细微的差异。例如，我正在修复CSS布局在我运行Chrome Mobile的Android手机上可以看到的ue，但在这个界面上看不到。这只会改变浏览器的宽度和高度，但有很多东西可以将手机与桌面浏览器区分开来。在链接上，开发者似乎已经失去了他们的域名，或者至少它没有指向以前的位置。