我最近从css-tricks.com 博客#38: Basics & Tips on Designing for the iPhone 完成了 Chris Coyier 教程。不用说，我非常兴奋并建议我做一些代码猴子工作，我们现在可以为他的客户提供 iPhone 网站。他说很酷，但其他移动设备呢？好问题。那么为 Android、Blackberry、WindowsMobile 等设计网站的低谷是什么？人们是否在为其他平台而烦恼？谢谢。
【问题讨论】：
对于 iPhone Safari、Opera Mobile 和 Android 上的 Webkit 开发是类似的 (but not identical)，并且这些开发非常简单。
您可以依赖 CSS2.1 和 JavaScript+DOM（但要小心UI events）。只需对样式表进行少量更改，您就可以轻松地为您的常规网站提供服务。
诀窍在于提供这些样式表。 不要使用User-Agent 字符串。
因为有些移动浏览器读取手持媒体，有些则坚持屏幕样式并假装拥有 960 像素宽的屏幕 (iPhone :/)，因此您需要同时提供移动样式表：
<link media="handheld" ...>
<link media="screen and max-device-width:480px" ...>
后者是CSS3 Media Query——非常有用，也可以与其他移动浏览器一起使用（您可以在带有@media {} 的样式表中使用它）。
不要依赖:hover 或onmouseover，因为这些事件在触摸屏上不起作用。
onclick 延迟，mousemove 可能无法正常工作。自定义 DHTML 小部件（下拉菜单、滑块）和拖放在触摸屏上不起作用，除非您使用 touch events（幸好所有最新的浏览器都采用了它）。
除了 Apple 的专有（以及恕我直言，标记和布局之间的不灵活和违反分离）<meta name=viewport> 之外，请查看 CSS3 @viewport，目前最新的 Opera 支持 @-o-viewport，希望其他人会效仿。
要在 Opera Mobile 中测试页面，请获取 the simulator（或只是较旧的桌面版本并选择查看 → 小屏幕）。
Opera Mini 很特别，因为 CSS 重新格式化了一点，DHTML 在服务器端执行，这并不总能提供您期望的结果。有simulator available。
您需要 Android SDK，使用命令行来启动其笨拙的 UI，下载一堆软件包，创建具有许多不相关的模糊设置的虚拟设备，耐心等待这个怪物加载并将计算机的风扇变成四轴飞行器，然后您可以在“浏览器”中进行 sss..sss..slooowlyyyy 测试（我的 Intel i5 太慢，无法模拟 Galaxy Tab - 浏览器“停止响应”，甚至在我完成输入 URL 之前）
使用 Android 手机/平板电脑并在真实设备上进行测试更容易（但请避免使用三星的播放器“iPod”等价物，因为它带有过时的软件是垃圾）。
对于不喜欢 Linux 做事方式的人来说，Android 浏览器真的很痛苦——只是为了阅读 JS 控制台，你需要摆弄远程调试连接和命令行上的日志过滤。
有simulator available（移动下载下方“Windows / Mac OS X / Linux”的链接不是桌面版，而是mobile-for-desktop-OS）。
模拟器非常基础，Mobile Firefox 本身就是恕我直言，非常好，例如overflow:scroll 效果很好，而在基于 WebKit 的浏览器上，溢出实现在非常不直观和完全损坏之间变化。
Windows Mobile display:table。
它同时读取handheld 和screen 样式表，这违反了标准并且自取其辱。如果您要支持 PIE，则将指向 handheld 样式表的链接放在最后，并反转/覆盖其中的屏幕样式中的所有规则。
反正已经死了，模拟器也很难弄了。
Windows Phone 7 目前与 IE7 类似，微软承诺稍后会提供 IE9 级别的功能。
最新的基于 WebKit 的 BlackBerry 浏览器相当不错，您可以将其视为一等公民（参见顶部链接的 WebKit 比较）。
在 BB OS6 之前，这是一场噩梦。只有基本的 HTML 有效。 CSS 适用于某些模型，但原始且损坏。 JavaScript 仅适用于某些模型，而且它难以置信缓慢且缺乏（甚至忘记基本的 DHTML）。
RIM 提供免费的 BB 模拟器（烦人的注册需要）。如果你不走运，它会正确启动一次，然后你必须完全重新安装它:)
低端手机上的数百个其他移动浏览器也是如此（由 OpenWave 等提供支持，它有 decent simulator）。您必须为他们准备 1 列的基本 HTML 精简网站。
即使您为现有的每台移动设备创建了漂亮的 (X)HTML，Google 移动搜索的用户也永远不会看到它！
取而代之的是，每个页面都将通过“无线转码器”进行代理，它残酷地切断代码，剥离所有样式表和脚本（无论浏览器是否支持它们），甚至<font> :(
【讨论】：