如何在移动设备上测试网站设计？

Question

我用900 x 600固定的背景图像设计了我的网站。在电脑上它看起来很好。它将如何在PDA设备上显示？我是否必须单独为PDA设计它？

应该如何检查我的网站是否可以通过手机有效浏览？

我该怎么办？

Answer 1

尝试使用Opera的“小屏幕”视图（查看>小屏幕）。这在模拟移动屏幕方面做得相当不错。在Opera自己的网站上试试吧。请注意，他们使用“手持式”样式表，当您在手持设备上查看或切换到小屏幕模式时，它会启动。
你可以免费下载Google's Android SDK进行测试。
要在iPhone上测试，请参阅iPhone Tester。右下角有一个按钮可将iPhone旋转到宽屏状态。
OpenWave Phone Simluator应该是好的。
你可以试试mobi online emulator。
Windows Mobile 5.0 SDK for Smartphone包含“基于Windows Mobile 5.0的智能手机设备模拟器图像和皮肤文件”
最后，一些一般指导：Web Content Accessibility and Mobile Web: Making a Web Site Accessible Both for People with Disabilities and for Mobile Devices

Answer 2

您可以为手持设备提供替代样式表，而不是浏览器检测。同

<link rel="stylesheet" href="small.css" type="text/css" media="handheld">

优点是您只需要一个版本的站点，不同之处在于样式表。您需要一个额外的CSS，而在浏览器检测时，您需要站点中每个页面的不同版本。缺点是并非所有浏览器都支持样式表的media属性。但最现代的浏览器确实如此，对它的支持正在增长。

如果你有兴趣，我建议看看A List Apart article。

顺便说一句，如果您还没有使用css，请立即切换到它，无论您选择哪种解决方案。 CSS摇滚！

Answer 3

Answer 4

好吧，你总是可以在那里抛出一些检测javascript来检查浏览器的类型，然后重定向到为移动设备格式化的其他站点。这似乎是大多数网站的标准。

例子：