手机网站开发必修课[2]：浏览器兼容性测试

本文来自：http://www.fool2fish.cn/?p=320

1 为什么要有兼容性测试：比web浏览器还恐怖的手机浏览器

对于web网站，一般来说，目前我们需要兼容的是

1个操作系统（windows）X 3种浏览器（ie 6、ie7、firefox）= 3种情况

要求高一点的web网站需要兼容的是

1个操作系统（windows）X 7种浏览器（ie6、ie7、firefox、chorme、opera、safari、遨游）+ 1个操作系统（mac） X 1种浏览器（safari）= 8种情况

注：以上浏览器除了ie外，均指其最新版本。另，遨游浏览器虽然是基于ie内核，但某些表现却完全出人意料，故也加入考虑。

好了，以上最多8种需要兼容的情况，已经让人大呼头痛不已，何况事实上这些浏览器对html代码本身的解析都是没问题的，你比较需要费心的只是ie6的css和js。

那么手机浏览器有多少种需要兼容的情况呢？

从上一篇文章《手机网站开发必修课[1]：手机浏览器》看来，如果要做到比较好的兼容性，我们要兼容的手机浏览器至少有二十种情况（手机自带的浏览器+用户可安装的浏览器）

web浏览器的兼容性大致可根据浏览器的渲染引擎来确定兼容类型，但手机浏览器，即使是使用的同一个渲染引擎，在不同的手机上表现也可能很不一样。

还有两个更令人头痛的问题：

1. 你没法使用css hack
2. 你也没法逐一去测试各浏览器的实际效果

所以，当你涉足手机网站开发的时候，你才会感概，web浏览器们真是太仁慈了。

不过事情还不算太坏，就目前来看，基于手机浏览器的限制，一般手机网站的布局和功能不会太复杂，而高级一些的手机浏览器（如iphone等）兼容性还是很理想的，不用操心。

不管怎样，对于一个专业的手机网站来说，有一份专业的浏览器兼容性测试报告是非常有必要的。面对成百上千的手机型号，还有日益强大的山寨机，我们的兼容性测试要覆盖哪些机型呢？

2 目标用户数据挖掘

我们基本不可能兼顾到所有类型的手机浏览器，所以你必须要根据你的用户数据来决定要测试兼容性的手机型号。

你的手上需要有以下数据：

1. 你的网站访问的手机型号统计
2. 用户访问你的网站的主要行为

如果拿不到这些数据，那么接下来的兼容性测试将会艰难很多，你不得不通过广撒网的方式，测试尽可能多的手机（而不是主要目标客户群的手机）来确认某些属性的兼容性，这可不是一个好主意，相信让你的老板掏银子给你采购几十乃至上百台手机不太现实。

总的来说，你需要得到测试手机的以下数据：

手机型号、操作系统、浏览器类型、屏幕尺寸、颜色深度

3 安排测试，整理测试结果

当我们设计测试点的时候，应该涵盖哪些内容呢？

1. 对xhtml代码本身的支持度，如是否支持<input type=”image” />
2. 对特殊字符的支持度，如★◆

3. 对css的支持度

   • 对css不同引入方式的支持
   • 对css的属性的支持
   • 对css某属性不同属性值的支持，如margin的取负值、background-repeat的不同取值
   • 对css选择器的支持，如tag，class，id，选择器的嵌套
   • 对css高级选择器的支持

4. 对js的支持度

   • 目前还不太可能在手机上创建很复杂的js效果，可以仅测试js的基本功能，比如对事件的支持，当然，使用js最重要的是要考虑好如何优雅降级，确保用户在没有js的情况下也能顺利完成任务

5. 对图片的支持度

   • 支持图片类型，包括gif非透明背景、gif透明背景、gif动画图、jpg、png8非透明背景、png8透明背景、png24非透明背景和png24透明背景
   • 支持图片颜色，如色彩复杂的图片，光滑渐变的图片

设计一个专用于测试的excel表格，方便测试人员填写测试结果也是非常重要的工作，如果这一步没有做好，也许你之前所有的努力都将白费。传承有价值的研究结果，其意义不低于研究本身。

由于之前所进行的手机兼容性研究工作都属于公司商业机密，具体测试表格无法公示，有兴趣的同学可以单独交谈。