如何让一个简单的网站在多个移动浏览器上正确呈现？答案

【问题标题】：How to make a simple site render correctly on multiple mobile browsers?如何让一个简单的网站在多个移动浏览器上正确呈现？
【发布时间】：2008-09-20 04:04:34
【问题描述】：

我们有一个相当简单的网站（最小的 JS），带有纯 html 和 CSS。它是我们主应用程序的简单移动界面。

我们遇到了麻烦，因为我们有不止一列，而且多个浏览器似乎强制使用单列。

通过一些搜索，我遇到了 2 个元标记。

<meta name="MobileOptimized" content="220" />
<meta name="viewport" content="width=320" />

有了这些，我们可以为 IE Mobile 和 iPhone 提供一个很好的“缩放”视图。我们还没有遇到 palm 的 Blazer 的任何问题。但黑莓是另一回事。

Blackberry 是否也有一种简单的方法来控制浏览器的视图？简单来说，我的意思是不为该设备制作特殊页面。

【问题讨论】：

【解决方案1】：

我不会费心为 iPhone 等制作“中等”版本，iPhone 用户可以轻松查看您的真实网页。拥有完整版和单栏版，您可以用最少的工作接触到最多的受众。

不过，要回答您的问题，除了 1 列视图之外，没有其他好方法可以让 Blackberry 执行任何操作。你可以让它看起来相当专业，因为 CSS 和简单的 javascript 仍然适用，但你将不得不失去很多横向空间。

【讨论】：

同意 iPhone 的观点，尤其是在您进行浏览器检测时 - 我对 MSNBC.com 等网站感到恼火.
正确，但同时您不希望在总容量可能低至 32 MB 的设备上拥有一个消耗大量内存的站点。另外：这个“最小”版本可以作为没有javascript或旧浏览器的用户的版本。

【解决方案2】：

我的建议是创建两个或三个版本的网站：

原因是为 3-4 个桌面浏览器编写代码已经够难了。不要在另外一百台设备上为自己编写代码并创建一个仅显示信息的简单页面。

记住网页开发的基本设计原则：用户不在乎。他们想要信息或功能。如果你有一个针对糟糕的移动浏览器（IE 或黑莓）的简单、清晰的布局，然后尝试破解一些最终成为可维护性噩梦的东西，并且如果有人使用另一个移动设备可能会让你看起来很糟糕，它看起来会好很多浏览器，而您尚未编写手机专用网站。

【讨论】：

【解决方案3】：

BlackBerry（来自 OS 4.6 及更高版本）支持 meta-viewport 标签和 meta-HandheldFriendly 标签。有关详细信息，请参阅http://na.blackberry.com/eng/support/docs/subcategories/?userType=21&category=BlackBerry+Browser 的“内容设计指南”文档。

【讨论】：