fool2fish发表于2009.05.18前言：手机有哪些浏览器？这些浏览器对xhtml、css和js的支持度怎么样？目标用户的手机使用情况？条件限制下的手机界面设计要如何进行？如何快速搭建一个手机网页？如何做好网站的兼容性工作？想必这些问题每个参与过手机网页开发的人都遇到过。
头大的是，除了自己公司已有的一些经验，网上恐怕没有过多的(公开的)文档可以参考。
09年上半年的工作重心全在手机网页开发上面，这使得自己某种程度上也成了拓荒者。
现将这段时间的开发心得同大家分享以下，欢迎大家跟我交换自己的想法。
手机网站开发必修课系列文章计划：1.手机浏览器1.来自wiki的解释2.对wiki的总结2.浏览器兼容性测试1.为什么要有兼容性测试：比web浏览器还恐怖的手机浏览器2.目标用户数据挖掘3.安排测试，整理测试结果3.测试结果对手机网站开发的指导意义1.对设计的指引作用2.确保裸html代码具有较高可用性，谨慎使用html标签3.css使用注意事项4.非常重要：代码的优雅降级注：由于有些数据牵涉到公司的商业机密，所以在这个系列的文章当中，有些可能不会公布出详细的数据，但会给出方向性的结论或者意见，请大家见谅。
要了解手机网站开发的诀窍，我们必须先了解手机浏览器。
虽然百度―手机浏览器‖没啥有价值的文章，所幸google―mobile broswer‖出来了比较多有价值的文章。
那么，站在前人的肩膀上，我们可以看的更远。
以下文字翻译自维基百科》手机浏览器:/wiki/Mobile_browser手机浏览器，又称微浏览器、迷你浏览器或者无线因特网浏览器，是被设计用于像手机或者PDA之类的无线设施的网页浏览器。
手机浏览器针对在便携设备上的小屏幕网页显示进行了专门的优化，以使网页内容显示最高效。
手机浏览器的软件必须小巧并且能适应无线掌上设备的低存储量和低带宽。
它们一度是最简朴的网页浏览器，但是2006年以后有些手机浏览器能够支持像css2.1、JavaScript和Ajax这样的最新技术。
那些被设计从手机浏览器访问的网站叫无线门户。
内容概览1.相关的技术2.先驱们3.流行的移动浏览器1.被主流手机和PDA厂商使用的默认浏览器2.用户可安装的手机浏览器3.手机HTML代码转换机4.更多5.参考6.更多外部链接1 相关的技术手机浏览器通常通过蜂巢网络连接，通过无线局域网连接的手机浏览器数量也日渐增多，后者使用基于TCP/IP的HTTP并能显示那些使用HTML, XHTML Mobile Profile (WAP 2.0), 或者WML (从HDML发展而来)编写的网页。
WML和HDML是适于通过低带宽传送数据的最简朴的形式，而无线数据的连接被称为WAP。
在日本，DoCoMo定义了基于i-mode HTML的i-mode服务，是压缩HTML(C-HTML)的一种扩展，HTML的一个子集。
WAP 2.0指定了XHTML手机协议和WAP CSS，WAP CSS是是W3C标准的XHTML和CSS在移动设备上扩展的一个子集。
2 先驱们那些被称为微浏览器的技术，诸如WAP，NTTDocomo的i-mode平台和Openwave的HDML平台点燃了人们对无线数据服务的第一次热情。
第一个微型浏览器的诞生大约是在1997年，当Unwired Planet公司(后来发展为Openwave)将他们的‖UP.Browser‖放在AT&T公司的手持设备上以供用户访问HDML内容。
一家英国公司，STNC股份有限公司，在1997年的时候研发了一款叫做HitchHiker的微型浏览器，并对这款装备设计了全套的UI。
这款微型浏览器(Webwalker)的演示平台拥有每秒处理百万条指令的能力。
它是一个单核处理平台，在类似于应用堆栈的处理器上跑着GSM堆栈。
1999年STNC被微软收购，并且HitchHiker变身为Microsoft Mobile Explorer 2.0,不同于之前的Microsoft Mobile Explorer 1.0。
HitchHiker被认为是第一款拥有统一标准的渲染模型的微型浏览器，它在一个客户端遵从EcmaScript, WMLScript, POP3和IMAP邮件等标准处理HTML 和WAP。
尽管这个浏览器最终未被使用，但它确实可是使HTML 和WAP在一个页面上联合使用，虽然这将使得其他的设备无法正确渲染该页面。
另外，Amstrad公司倒霉的将HitchHiker作为他们e-m@iler和e-m@iler+产品的操作系o Teashark– a free Java-based browser with a desktop-like layout [4]o ThunderHawk by Bitstream Inc. (Cambridge, MA)o UCWEB by UCWEB Technologyo Universe by OpenMobl Systemso Webby Mobile by AnOriginalIdeao WebViewer– a free Java based browser by Reqwirelesso WinWAP by Winwap Technologies Official product page3.3 手机H TML代码转换机手机HTML代码转换机将web内容重新格式化并压缩成移动设备可用的内容，并且必须和内置的或者用户安装的手机浏览器配合使用。
以下是几个领先的手机HTML代码转换机服务。
o Skweezer– used by Orange, Etisalat, JumpTap, Medio, Miva, and otherso Teasharko Opera Mini4 更多o web浏览器o i-modeo信息装置(Information appliance)o用户代理o模拟器列表5 参考1.无线门户的定义2.关于Openwave Openwave.2009.2009年2月26日寻回3.Weather Underground网站为手机用户提供天气服务4.Myriad浏览器v9数据表（pdf）Myriad小组. 2009.2009年2月26日寻回5.bolt浏览器官网6 更多外部链接o W3C手机网页第一步—―W3C手机网页第一步的目标是要让用户从移动设备访问网页成为现实——Tim Berners-Lee, W3C 网站的创始人之一如是说.o用于小型信息设备的紧凑HTML—1998年2月o开放移动通信联盟o黑莓浏览器开发者网页o ItsNat一个很多手机浏览器支持的基于Java的AJAX网页框架对wiki的总结对于wiki中提到的浏览器类型，还有两个页面可供参考1.手机浏览器型号查询2.ppk：手机类型和浏览器表格看完整篇文章后，有一些问题要问问聪明的你1.什么是渲染引擎？什么是浏览器？这是两个最先要搞清楚的概念。
2.内置的手机浏览器，用户安装的手机浏览器和基于web的模拟器3.每个浏览器都有相应的渲染引擎，因此有必要知道使用同一个渲染引擎的手机浏览器的页面表现是否一致4.国内主流的浏览器机型有哪些？国内用户是否喜欢使用用户自己安装的浏览器。
不管怎么样，作为一个开发人员，应该尽量去体验一下这里提到的各种用户可安装的浏览器。
5.基于web的模拟器是前期测试很有效的工具，推荐使用safari,opera和firefox(需安装插件)6.如何保证手机网页的开发效率（包括质量和速度哦）？以上这些问题，前两点在本文中有提到，后面几点希望大家能开动脑筋先想想，答案将在后续的文章中揭晓建议用你自己的手机访问一些国内较大的无线网站。
比如，等等Trackback: /?p=290#more-2901 为什么要有兼容性测试：比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 hack2.你也没法逐一去测试各浏览器的实际效果所以，当你涉足手机网站开发的时候，你才会感概，web浏览器们真是太仁慈了。
不过事情还不算太坏，就目前来看，基于手机浏览器的限制，一般手机网站的布局和功能不会太复杂，而高级一些的手机浏览器（如iphone等）兼容性还是很理想的，不用操心。
不管怎样，对于一个专业的手机网站来说，有一份专业的浏览器兼容性测试报告是非常有必要的。
面对成百上千的手机型号，还有日益强大的山寨机，我们的兼容性测试要覆盖哪些机型呢？2 目标用户数据挖掘我们基本不可能兼顾到所有类型的手机浏览器，所以你必须要根据你的用户数据来决定要测试兼容性的手机型号。
你的手上需要有以下数据：1.你的网站访问的手机型号统计2.用户访问你的网站的主要行为如果拿不到这些数据，那么接下来的兼容性测试将会艰难很多，你不得不通过广撒网的方式，测试尽可能多的手机（而不是主要目标客户群的手机）来确认某些属性的兼容性，这可不是一个好主意，相信让你的老板掏银子给你采购几十乃至上百台手机不太现实。
总的来说，你需要得到测试手机的以下数据：手机型号、操作系统、浏览器类型、屏幕尺寸、颜色深度3 安排测试，整理测试结果当我们设计测试点的时候，应该涵盖哪些内容呢？1.对xhtml代码本身的支持度，如是否支持<input type=‖image‖ />2.对特殊字符的支持度，如★◆3.对css的支持度1.对css不同引入方式的支持2.对css的属性的支持3.对css某属性不同属性值的支持，如margin的取负值、background-repeat的不同取值4.对css选择器的支持，如tag，class，id，选择器的嵌套5.对css高级选择器的支持对js的支持度0.目前还不太可能在手机上创建很复杂的js效果，可以仅测试js的基本功能，比如对事件的支持，当然，使用js最重要的是要考虑好如何优雅降级，确保用户在没有js的情况下也能顺利完成任务对图片的支持度0.支持图片类型，包括gif非透明背景、gif透明背景、gif动画图、jpg、png8非透明背景、png8透明背景、png24非透明背景和png24透明背景1.支持图片颜色，如色彩复杂的图片，光滑渐变的图片设计一个专用于测试的excel表格，方便测试人员填写测试结果也是非常重要的工作，如果这一步没有做好，也许你之前所有的努力都将白费。