android - 网站在现代 Android 浏览器中以不同方式呈现是否很常见？

Question

我正在构建一个移动网站，但我无法让该网站在 4.0、4.1 和 4.2 版 Chrome 浏览器和股票浏览器上的各种 Android 手机上一致显示。但是，当我在运行 ios 5 或 ios6 的 iPhone 4s 和 5 上查看同一网站时，该网站的显示和运行始终如一。

我正在开发的移动网站使用了 CSS3、大量 javascript 动画、从 fonts.com 导入的字体以及与 vimeo.com 的视频集成。

以下是我在各种机器人及其浏览器上遇到的问题示例:

• 第 1 个人 - GS3 - Android 4.0 - Stock 浏览器 - 网站总是崩溃
• 第 1 个人 - GS3 - Android 4.0 - Chrome 浏览器 - 网站运行良好，但某些字体不显示
• Person 2 - Galaxy Nexus - Android 4.2 - Stock 浏览器 - 效果很好
• 人物 2 - Galaxy Nexus - Android 4.2 - Chrome 浏览器 - vimeo 视频无法播放
• Person 3 - Galaxy Note - Android 4.0 - Stock 浏览器 - 一切正常
• 第 4 个人 - Samsung Galaxy - Android 4.1 - 普通浏览器 - 网站不断崩溃

同一网站在操作系统 4.0 及更高版本的各种 Android 浏览器中呈现不一致是否很常见？

Answer 1

在某种程度上，是的，这很普遍。这是因为 Android 设备在硬件和功能方面不一定一致，尤其是当您开始使用运营商锁定设备时。

一般而言，在移动设备中，JavaScript 和 Flash 支持可能很粗略(Vimeo 可能会预料到这一点并改用 HTML5，但您仍在谈论播放视频，这本身就是资源密集型的)。有些会支持这些，而有些则不会，而一些支持它们的可能没有硬件来处理它们。 JavaScript、Flash、自定义字体和视频播放都是资源密集型的，因此您可能会重载设备的功能。

我建议减少移动浏览器的审美特征，例如使用标准字体，减少动画(无论如何，其中大部分可能不会增加值(value))，并减少一些较重的 CSS3 技巧(转换、动画等)，看看这是否改善了这些浏览器的问题。为视频提供某种“失败的嵌入”回退(例如链接)也可能是个好主意。 (从完全删除 JavaScript 和高级 CSS 开始可能更容易，然后慢慢添加内容，直到找到断点。)

附带说明一下，研究“移动优先”开发原则的概念可能也很值得，其中包括专注于您的内容，然后在浏览器功能支持时添加美学(而不是从大处着手并随着支持的减少而停止。