Mobile 移动浏览器检测和格式化的最佳实践

我为一位客户主持了一家小型网络商店，该客户希望它能够方便地从移动设备访问

如何检测用户是否从移动设备浏览我的网站

当我这样做时，我是否应该：

检查用户是否有移动设备，然后将其转发到其他站点？ 我认为这样做的好处是：

• 我可以优化两个网站的屏幕大小布局
• 我可以在这两个网站上使用不同的技术（例如jquerymobileformobile）

对不同的屏幕大小使用CSS=>如 我认为这样做的好处是：

• 我只需要一个网站，但在我看来，当谈论一个小的网店时，它似乎是一堆工作

---

JQuery Mobile目前正处于测试版1中。Beta 2将在一个月内推出。它目前相当稳定，你可以从他们那里获得很多关于什么是“最佳实践”的知识。对于JQuery Mobile也支持的不同平台，您可以使用媒体查询来确定屏幕大小

---

理想情况下，您应该尝试将页面结构与您自己的CSS和JavaScript一起用于非移动设备

您可以根据html5[样板文件]轻松地将有条件的脚本包括：

针对iPhone用户的主要考虑事项：

• 确保没有重要的闪光物体 在页面上，因为它不受支持 许多移动浏览器（还没有？）
• 适当的屏幕大小（使用 视口元标记）
• 记住没有老鼠 光标，表示没有 悬停/双击可在任何位置使用 鼠标拖动手势是不同的 触控设备
• 请记住，所有弹出窗口都在新窗口中打开 选项卡和将不会同时显示 时间作为主窗口，使用 javascript模式div作为替代方案
• 测试所有javascript和css以 确保一切看起来都正常工作 相同（Safari需要-webkit-前缀 获取最新的CSS属性）
• 为您的应用程序创建主屏幕图标 网站（拥有一个好东西）

这些东西大部分都包括在内

---

查看教程/视频/如何编写代码等。

如果不想使用jQuery，您根本不需要它。我们没有。并不是说这有什么问题

---

2号是最好的选择。如果您首先创建一个考虑移动设备的网站，那么在桌面上扩展和操作要比尝试将内容缩小到移动屏幕容易得多。

有几个选项，但这是我最喜欢的：

附带了两种不同语言的API

jQuery（mobile）只是一个例子。在我看来，在移动设备上冲浪时有不同的用户体验。因此，你可以从移动设备的站点开始，如果用户的屏幕宽度大于eg 480px，请更改格式可能的重复

/* Grade-A Mobile Browsers (Opera Mobile, Mobile Safari, Android Chrome)
consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/ */
@media screen and (max-device-width: 480px) {