创建网站的简单移动版本的最佳方法是啥？

Posted 2023-03-10

【中文标题】创建网站的简单移动版本的最佳方法是啥？

【英文标题】：What's the best way to create a simple mobile version of a website?创建网站的简单移动版本的最佳方法是什么？

【发布时间】：2010-02-26 15:09:45

【问题描述】：

我正在为一家公司构建一个小型网站，并希望构建一个针对具有完整互联网浏览器（iPhone/android 等）的智能手机优化的版本。

我倾向于媒体查询，因为大多数这些似乎都在使用的 webkit 支持它。

这是最好的吗？如果是这样，哪种媒体查询最好？

我倾向于：

@media (max-device-width: 480px)

【参考方案1】：

如果您的网站可以通过 CSS 调整您需要的所有内容，那您应该很好。

请记住移动网络中的不同之处：

整体宽度/高度要小得多 为了便于阅读，通常会加大字体大小 许多设备不支持 Flash（咳嗽 iphone） 剥离任何不需要的东西，不要将带宽浪费在移动用户不关心的东西上 为电话号码添加适合移动设备的属性以便于拨打电话

也就是说，一旦你进入它，你可能会发现你真的想要/需要为移动用户提供不同的“视图”......例如将它们从example.com 重定向到m.example.com 并显着改变页面上的内容。如果您使用类似MVC 的框架，您应该能够为您的页面创建一组针对移动设备进行了优化的简化视图。

示例网站（桌面、移动和触控优化）

挖掘：Full | Mobile 雅虎：Full | Mobile 脸书：Full | Mobile | Touch

【参考方案2】：

对于触控手机，创建一个jQTouch 版本。 对于键盘手机，只需制作一个针对小屏幕优化的样式表。

【参考方案3】：

对于 iPhone 和 Android，我不会打扰，因为它们都有功能齐全的网络浏览器。 （除非该网站是 Flash，仅限 iPhone。）

您应该能够使用自定义 CSS 文件定位您想要的任何设备，例如黑莓等。