挨踢民工日志

手机网站开发必修课[1]:手机浏览器

前言:  

手机有哪些浏览器?这些浏览器对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”出来了比较多有价值的文章。那么,站在前人的肩膀上,我们可以看的更远。

以下文字翻译自维基百科》手机浏览器:http://en.wikipedia.org/wiki/Mobile_browser

手机浏览器,又称微浏览器迷你浏览器或者无线因特网浏览器,是被设计用于像手机或者PDA之类的无线设施网页浏览器。手机浏览器针对在便携设备上的小屏幕网页显示进行了专门的优化,以使网页内容显示最高效。手机浏览器的软件必须小巧并且能适应无线掌上设备的低存储量和低带宽。它们一度是最简朴的网页浏览器,但是2006年以后有些手机浏览器能够支持象css2.1JavaScriptAjax这样的最新技术。那些被设计从手机浏览器访问的网站叫无线门户。

内容概览         

  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, POP3IMAP 邮件等标准处理 HTML 和 WAP。尽管这个浏览器最终未被使用,但它确实可是使HTML 和 WAP在一个页面上联合使用,虽然这将使得其他的设备无法正确渲染该页面。另外, Amstrad公司倒霉的将HitchHiker作为他们e-m@iler和 e-m@iler+产品的操作系统,手机浏览器2.0在Benefon Q, Sony CMD-Z5, CMD-J5, CMD-MZ5, CMD-J6, CMD-Z7, CMD-J7 and CMD-J70.等设备上都可使用。

还有一款叫Palmscape的用于PalmOS的免费浏览器(虽然后来才成为共享软件的),由Kazuho Oku 1998年在东京编写,他继而发现了Ilinx,这款浏览器直到2003年才放开使用限制。

于2001年发布的 Mobile Explorer 3.0增加了iMode的兼容性和众多的专利设计。通过假想的将这些专利设计结合到WAP协议中, MME3.0执行了OTA数据库同步、推送了email,推送了信息客户端和PIM功能。已经退出市场的索尼爱立信CMD-Z700深度集成了MME3.0。MME的开发脚步在2002年中旬画上了句号。

Opera Software公司以他的小屏幕渲染技术(Small Screen Rendering )和中屏幕渲染技术(Medium Screen Rendering)领先于该领域。Opera的的web浏览器可以让普通的web网页在小型屏幕和中型屏幕上重新布局,并达到最优显示。他是第一款广泛支持Ajax和通过ACID2测试的浏览器。

 

3 流行的移动浏览器

手机浏览器和基于web的模拟器不同,基于web的模拟器使用一种“虚拟的手持设备”在电脑上显示wap页面,使用java或者html转码器。这些模拟器有 Wapjag, TT, Waptiger 和 Superwap。

一下表格列出了一些当下非常流行的手机浏览器。一些手机浏览器是web浏览器的精简版本,因此一些手机浏览器厂商也提供用于台式机和笔记本电脑的浏览器。

3.1 被主流手机和PDA厂商使用的内置手机浏览器

浏览器 开发者 开源 渲染引擎 软件许可 注意
Danger browser Danger - 专利的 installed on all Danger-designed devices including the T-Mobile Sidekick
Embider Infraware - 专利的 [2]
Internet Explorer Mobile Microsoft - 专利的 -
Nokia Series 40 Browser Nokia - 专利的 -
Novarra nWeb Novarra - 专利的 -
Obigo Browser Obigo AB - 专利的 100% owned by Teleca AB
Picsel Browser Picsel Techologies - 专利的 -
jB5 Mobile Browser Jataayu Software ? ? ? available on Symbian Series 60, Windows Mobile and Linux
Wapaka Browser Digital Airways ? ? ? Java micro-browser
Myriad Browser (Previously Openwave Mobile Browser) Myriad Group Fugu (Next version to use WebKit)[4] 专利的 Acquired from Openwave in 2008
Fennec Mozilla Gecko ? Currently in Beta
BlackBerry Browser Research in Motion Mango 专利的 -
Kindle Basic Web Amazon.com NetFront 专利的 -
Blazer Palm NetFront 专利的 installed on all newer Palm Treos and PDAs
NetFront ACCESS Co., Ltd. NetFront 专利的 -
PlayStation Portable web browser Sony NetFront 专利的 -
Opera Mobile Opera Software Presto 专利的 Capable of reading HTML and reformat for small screens, installed on many Phones
Android browser Google WebKit Apache 2.0 and GPLv2 -
Iris Browser Torch Mobile Inc. ? WebKit ? Linux/ Qt and Windows Mobile
Safari Apple Inc No WebKit 专利的 on iPhone and iPod Touch
Symphony Motorola ? WebKit ? on MOTOMAGX
Web Browser for S60 Nokia ? WebKit ? -
Browser Creator FOSS Current layout engine Software license Notes

3.2 流行的用户可安装的手机浏览器

3.3 手机HTML代码转换机

手机HTML代码转换机将web内容重新格式化并压缩成移动设备可用的内容,并且必须和内置的或者用户安装的手机浏览器配合使用。以下是几个领先的手机HTML代码转换机服务。

 

4 更多

 

5 参考

 

6 更多外部链接

 

对wiki的总结

对于wiki中提到的浏览器类型,还有两个页面可供参考

  1. 手机浏览器型号查询
  2. ppk:手机类型和浏览器表格

看完整篇文章后,有一些问题要问问聪明的你

  1. 什么是渲染引擎?什么是浏览器?这是两个最先要搞清楚的概念。
  2. 内置的手机浏览器,用户安装的手机浏览器和基于web的模拟器
  3. 每个浏览器都有相应的渲染引擎,因此有必要知道使用同一个渲染引擎的手机浏览器的页面表现是否一致
  4. 国内主流的浏览器机型有哪些?国内用户是否喜欢使用用户自己安装的浏览器。不管怎么样,作为一个开发人员,应该尽量去体验一下这里提到的各种用户可安装的浏览器。
  5. 基于web的模拟器是前期测试很有效的工具,推荐使用safari,opera和firefox(需安装插件)
  6. 如何保证手机网页的开发效率(包括质量和速度哦)?

以上这些问题,前两点在本文中有提到,后面几点希望大家能开动脑筋先想想,答案将在后续的文章中揭晓

建议用你自己的手机访问一些国内较大的无线网站。比如 http://wap.taobao.com,http://wap.163.com等等

分类: 前端开发 | 13条评论 »

评论恒久远,一篇永流传

13 条评论

  1. SMbey0nd said: 2009-05-19 02:28

    太精彩了!收藏。
    传说中的沙发~

    回复

  2. Yacca said: 2009-05-19 02:28

    你现在还涉及手机站开发么?!

    理想中的手机网站最好只有text信息 哈哈

    回复

    fool2fish Reply:

    工作刚好在做着块么,你的头像还是那么销魂……

    回复

    Yacca Reply:

    继续搭楼… 我的头像是大学时代就跟着我了,哈哈…我太tmd专一了.

    回复

  3. songqi said: 2009-05-19 07:03

    崇拜死了,好强哦~~~~~ㄟ(▔▽▔ㄟ) ❤❤(╯▔▽▔)╯

    回复

  4. winter said: 2009-05-19 16:43

    看来WinCE Browser被彻底WS了 T_T

    回复

  5. 猪头 said: 2009-05-22 13:18

    BLOG重开好高兴哦
    终于又可以看见作品了!

    回复

  6. 手机网站开发必修课[1]:手机浏览器 « 蘇恩兒的部落格 said: 2010-03-18 03:46

    [...] 手机网站开发必修课[1]:手机浏览器 [...]

  7. 手机网站开发必修课[2]:浏览器兼容性测试 « 蘇恩兒的部落格 said: 2010-03-18 04:21

    [...] 从上一篇文章看来,如果要做到比较好的兼容性,我们要兼容的手机浏览器至少有二十种情况(手机自带的浏览器+用户可安装的浏览器) [...]

  8. 手机网站开发——浏览器兼容性测试 - 项目和开发组 said: 2010-04-01 06:50

    [...] 从上一篇文章看来,如果要做到比较好的兼容性,我们要兼容的手机浏览器至少有二十种情况(手机自带的浏览器+用户可安装的浏览器) [...]

  9. 手机网站开发笔记 1 - 我们的故事 | i Hand u - dUcky's Blog said: 2010-04-07 03:04

    [...] 手机网站开发必修课[1]:手机浏览器 [...]

  10. 手机网站开发笔记 « 焦点科技 TCD Blog said: 2010-04-07 03:14

    [...] 手机网站开发必修课[1]:手机浏览器 [...]

  11. 手机网站开发 said: 2010-04-19 12:15

    [...] 手机网站开发必修课[1]:手机浏览器 [...]

    回复

雁过拔毛,人过留声

以下您填写的个人信息将不会被博主转手贩卖给无良的奸商,请大家放心填写。

*

控制面板



注册 找回密码

最新评论

  • 常胤: 路过。...
  • 葉子: 顶沉...
  • 阿哲: 楼上好人啊,造福广大人民...
  • flasherwade: QQ表情包下载: http://knb.im/5u...
  • 文龙: 真传神...
  • 释然: 顶一下...
  • songqi: 我抢我沙...
  • 乔福: 看第一句以为主角是我。。。还好~~~否则形象尽毁...
  • 葉子: 传说中的fan...
  • 葉子: 我已经迷茫我在it火坑中能否生存...
  • 龙子: 又多了一个传说......
  • Mini Dragon: 淘宝姐姐就是能出好东西 偷走...
  • 江南: 鱼姐,呵呵,久仰你的大名,漫画画的真好,“蛊惑”我也...
  • 常之: 妥妥儿...
  • jiale: 1.嘿嘿黑 2.表过来 3.哈哈哈,,,,救命阿 4.555,被反了。...

最新留言

最新留言
挨踢民工日志@2008
版权所有 fool2fish.cn
浙ICP备09020488号
Powered by WordPress 2.7.1