迅雷邹惠斌(Impact) 移动设备web重构
Upcoming SlideShare
Loading in...5
×
 

迅雷邹惠斌(Impact) 移动设备web重构

on

  • 2,800 views

 

Statistics

Views

Total Views
2,800
Views on SlideShare
2,799
Embed Views
1

Actions

Likes
0
Downloads
85
Comments
0

1 Embed 1

http://bryan-chan.com 1

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    迅雷邹惠斌(Impact) 移动设备web重构 迅雷邹惠斌(Impact) 移动设备web重构 Presentation Transcript

    • 移动设备WEB重构
      迅雷网络--邹惠斌(Impact)
    • 环境-认识-不仅仅是电话
      Mobile 2.0
      将电话,计算机网、固定网同移动网结合起来起来
      的网络(IP多谋体系统)。
      --------即点即连
    • 环境-认识-不仅仅是电话
      Mobile Web 2.0
      --------即点即做
    • 工具- Series 60 Developer Tools
      S60第三版的官方模拟器 SDK
      S60第五版的官方模拟器 SDK
      电脑上的S60手机模拟器,支持S60运行sisx等所有程序!
      消耗PC内存比较大,建议在1G内存以上
    • 工具-Windows Mobile 6 SDK
      Windows Mobile 平台调试工具
      要在PC端模拟上网,必须要在VISTA
      系统下才可以配置成功。
    • 工具-Opera mobile simulator
      OperaWidgets是一个小巧而功能强大的跨平台互联网套件,包括网页浏览、下载管理、邮件客户端、RSS阅读器、IRC聊天、新闻组阅读、快速笔记、幻灯显示(Operashow)等功能。
    • 工具- iBBDemo4B
      目前版本,PC系统需要安装Safari4以下的版本,才可以运行。
    • 工具-Firefox插件-XHTML Mobile Profile
      用它可以对访问的页面进行
      是否符合xhtml规范的检查。
    • 工具-建议
      建议用多个模拟器并行测试,但是也有可能会和真机测试有偏差,如果条件容许下,用真机测试是最好的。
    • 结构-J2EE展示层
      HTML标记语言
      移动设备对table,td…支持比较差。
    • 结构-J2EE展示层-WML
      WML-无线标记语言
      事件:WAP最初的提出,HTML3.2多数复杂的格式在移动设备中无法工作。
    • 结构-J2EE展示层-WML
      <?xml version="1.0"?>
      <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"   "http://www 。wapforum 。org/DTD/wml_1.1.xml">
      <wml>
       <card id=“phone" title=" phone ">
      phone!
      </card>
      </wml>
      显示结果如下:
      ------ phone------
      phone!
    • 结构-J2EE展示层-WML-卡片组
      HTTP/HTML模式在每个HTTP循环中包括一个请求。
      WML可以通过页面进行“预获取”来加快相应速度。
    • 结构-J2EE展示层-WML-卡片组
      第1第2浏览器发出请求
      第3,4到某个特点资源所运行的J2EE服务器
      第5输出为卡片组
    • 结构-J2EE展示层-WML-WAP二进制XML
      在RF网络进行传输中,我们发费超过一半的时间来传输这些用户从来不想看的数据,那么WML可以很好的解决这个问题。
      在WML中,所传输的、用以替代HTML流的ML流是经过二进制编码的,目的是压缩元数据。
      浏览器可以并行显示和接受WML流
    • 结构-J2EE展示层-WML-WAP二进制XML
      编码后的WML输出被称为WAP二进制XML,或者叫做WBXML
    • 结构-J2EE展示层-WML-WAP二进制XML
      采用WBXML编码,我们将原数据降低到整个相应流的16%,尽管这是
      一个孤立的例子,但仍然说明WBXML可以非常显著的减少负载。
    • 结构-J2EE展示层-XHTML-MP
      XHTML Mobile Profile是基于XHTML Basic 的XHTML 1.1 的严格子集。
    • 结构-J2EE展示层-XHTML-MP
      XHTML-MP 1.2
    • 结构-J2EE展示层-XHTML-MP
      更丰富的格式支持。
      对WCSS的支持。
    • 结构-J2EE展示层-XHTML-MP
      XHTML MP 与 WML 比较
    • 结构-J2EE展示层-应用杀手
      手机平台下还要考虑语义化标签吗?
    • 表现-WCSS
      WAP2.0下专属的CSS:WCSS (WAP Cascading Style Sheet )
      是CSS2的子集+一些WAP特有的扩展
    • 表现-WCSS-扩展
    • 表现-WCSS-应用杀手
      1.不同的移动设备浏览器支持WCSS的属性差异比较大。
      2.外部WCSS不存在于手机的Cache。
    • 表现-WCSS-应用杀手
      考虑任务列表而不是小册子
    • 表现-WCSS-应用杀手
      应用背景图,白色字
    • 表现-WCSS-应用杀手
      -------用了Float
      -------用了Float
      (UCWEB6.7、QQ浏览器)
    • 表现-WCSS-应用杀手
      建议一:平滑降级
      -------在最小公分母设计中,我们不用任何“先进”
      的特性,从而处于“安全”的地位,在平滑降级中,即使
      浏览器缺少很多特性,但可显示性达到了最大化。
    • 表现-WCSS-应用杀手
      ------较低端手机平台
      针对Iphone和Android ------
    • 表现-WCSS-应用杀手
      建议二:个别兼容,个别不同展现。
      -------要一套样式兼容多个平台是不可能的
      例如:S60v3 和 S60v5的字体大小就需要不同的
      SIZE来控制。
      针对个别高端手机做出不同的样式表现。(或是
      判断自动选择或是让用户选择)
    • 移动设备WEB重构
      虽然还有好长的路要走,但是却离我们很近!
      ------感谢WebRebuild组委会
      THANKS!