移动端兼容性浅析
移动端兼容性浅析-移动阅读二维码

来自艾瑞的《2014年中国移动互联网行业年度研究报告》向我们展示着在未来的互联网世界,移动端将成为主要战场,若想在浪潮汹涌中屹立不倒,我们就要开始移动端,开始一个新的征程。

作为一名前端工程师,我们享受过或仍在享受着pc端各种“非现代”浏览器的“折磨”,面对移动端我们又将面临哪些兼容性的考验呢?篇幅所限本文将向各位展示我们在移动端开发过程中针对兼容性问题的一点经验,主要包括方案选型及入门基础,如果您是大牛、大神或是大神牛欢迎指点、指正,如果您是和我一样的移动端新鸟欢迎探讨共同学习。

在移动端的兼容性上主要需要关注哪些方面的问题,对其又是如何定级的呢。由于要考虑设备(pc设备or移动设备)、厂商、机型、操作系统及版本、浏览器及版本等多方面因素,移动端兼容性被毫不夸张得称为“后IE6时代”。如何在成本允许的情况下将页面更好地呈现给用户,让我们先来看一组数据:

 

由图可见,智能手机占据了常用移动设备终端95.2%的份额,而智能手机中安卓及IOS两大平台占比总和达到了89%,综合成本、效率及整体效果考虑,我们暂且将移动端浏览器的兼容性定级为:兼容IOS和安卓平台的主流机型、系统及浏览器。

目前针对跨终端的方案,主要分为两大阵营:一套资源Vs两套资源。第一种是通过响应式或页面终端判断去实现一套资源适配所有终端;第二种是通过终端判断分别调取两套资源以适配所有终端。这两种思路我们并不能斩钉截铁的说哪一个更优选,正所谓“合适的才是最好的”。下面来对这两种思路进行简单的对比:

要点明晰及注意事项:

点击查看点击查看

兼容性测试:

调试工具推荐chrome的模拟器加真机测试,更多关于debug的工具可以参考Debugging Mobile Web Page【点击查看】这篇文章。

总结:

移动端开启了一个时代,它不是虚无缥缈或者高不可攀的,它反而让曾经被忽视的渲染方式及web标准等实质性的问题更加清晰,相较上述两种思路,我们更倾向于各司其职思路清晰的第二种方案,我们可根据不同终端做不同的交互设计、视觉设计,研究不同的前端技术、用户体验,适合的才是更好的。做为前端工程师,让我们理解原理,探索实践,跨终端任重而道远。

本文链接:http://www.mobileui.cn/mobile-browser-compatibility.html
本文标签: , , ,