手机网站开发必修课——浏览器兼容性测试

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。

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

  如果要做到比较好的兼容性,我们要兼容的手机浏览器至少有二十种情况(手机自带的浏览器+用户可安装的浏览器)

  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表格,方便测试人员填写测试结果也是非常重要的工作,如果这一步没有做好,也许你之前所有的努力都将白费。传承有价值的研究结果,其意义不低于研究本身。

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

posted @ 2012-12-07 16:04  鬼才小磊  阅读(779)  评论(0编辑  收藏  举报