当这个 metatag 被添加到一个 HTML 页面后，我们看到此页面被缩放到更为适合这个移动设备的大小
在某些情况下，最为理想的方式是提前将窗口缩放到一个合适的值，如图 3 所示。
图 3. 提前缩放窗口
最为理想的方式是提前将窗口缩放到一个合适的值
为了设置特定的值，将 viewport metatag 的 content 属性设为一个显式的值：
自具有 320x480 布局的 iPhone 面世以来，其形态系数就一直没有改变过，而随着来自不同制造商、针对不同用户群的更多设备的出现，Android 则有望具备更多样的物理特点。在开发应用程序并以诸如 Android 这类移动设备为目标时，一定要考虑屏幕尺寸、形态系数以及分辨率方面的潜在多样性。
除了 Android 设备与其他设备之间的这些物理差异之外，经验还表明 Android 的软件还通过设备内置的（on-device）浏览器设置对页面的呈现实施了更多控制。不仅稳定，Android 平台还很灵活。取决于 SDK 等级和制造商，某个设备上的设置很可能不同于您的开发环境。图 4 显示了取自 Android Emulator V1.6 的浏览器应用程序的设置页面。这个设置屏幕允许用户将一个设备设置为一个预先定义的缩放等级（far、near、medium）或请求此设备自动适应页 面。
图 4. Android Emulator 的设置页面
取自 Android Emulator V1.6 的浏览器应用程序的设置页面
在移动世界，变化无时无刻不在发生，我们这里所讨论的也不是一成不变的。比如，针对浏览器 Sprint Hero 的设置就页面呈现而言具有完全不同的一组选项集。Hero 构建于 Android V1.5 之上外加一些 HTC-提供的增强。幸运的是，如果呈现在您的 Web 页面内，这些设置将被 viewport metatag 覆盖。
迄今，我们已经看到了 WebKit 能很好地呈现一个常规的 Web 页面，尽管在不进行缩放的情况下，页面有些小并很难阅读。接下来，我们将实施更多的控制，即通过使用 viewport metatag 控制页面如何在设备上被查看。这就使得页面更
易读和易于导航。但是如果我们想要更进一步，让站点看起来和感觉上更像一个移动应用程序，该如何做呢？
为移动量身打造
现在，让我们来看看以移动用户为目标进行设计时所应采用的设计策略。我们举一个简单的例子，让我们来看看 Google 的 GMail 电子邮件服务的登录页面。
先来看看这个桌面浏览器体验，如图 5 所示。
图 5. 桌面浏览器
桌面浏览器体验
这个桌面主屏幕在左边具有信息性内容，在右边有一个登录区域。将这个桌面视图与图 6 内所示的特定于移动的视图（取自 iPhone）相比较。
图 6. 来自 iPhone 的特定于移动的视图（
来自 iPhone 的特定于移动的视图
图 6 内的屏幕很显然针对的是一个移动用户。此用户被直接提示继续运行这个应用程序所需采用的步骤 — 无需缩放或滚动。
接下来，让我们看看这个移动 GMail 应用程序在阅读消息时的功能。由于可被这个应用程序使用的资产有限，消息阅读窗口很少有机会展示按钮或导航。任何专用于导航的空间都会占用用于阅读内容的 空间。而且，如果我们能够避免，我们绝对不想使用多个框架或滚动 div 元素。移动 GMail 通过提供一个简单的、能在页面停止滚动时就立即出现的浮动菜单解决了这个问题。此菜单具有三个按钮： Archive、Delete 和 More。选择 More 按钮，还会显示出额外的菜单项，如图 7 所示。