SlideShare a Scribd company logo
未来  Web App  初探 利用 HTML5 打造 Web APP PuterJam @ tencent  2011
7 年前 很多人这么称呼我们
页面仔 僵尸仔 页面重构 前端开发
毕业梦想 成为一个 “ 程序员 ”
Web Application
早期的 Web APP 仅仅是去掉了地址栏的浏览器快捷方式
 
 
HTA 无法跨平台 HTA 不适合传播 安全性差 和桌面结合差 不具备可维护性 开发效率底 ...... 早期 Web APP 的问题
理想中的 Web APP 云端和桌面的无缝结合 极致的 UI 表现 跨平台兼容
云端和桌面的无缝结合 方便的快捷方式 不仅仅是  <input type=&quot;file&quot;/> 离线应用
更方便的快捷方式
不仅仅是  <input type=&quot;file&quot;/> 本地和 Web 之间文件拖拽 本地文件流操作 更多本地硬件支持 麦克风 / 摄像头 GPS/AGPS 方向 / 重力感应器 多点触摸
 
 
 
是时候提供离线服务了 应用在线安装 Application Cache 用户数据存储 Web Storage
 
7 年前的重构是一门技术 现在的重构是一门艺术
 
极致的 UI 表现 更高效的页面布局 更少量的图片数量 更完美的动画表现
完美的布局解决方案 Css3 Flexible box
<div style=&quot; display: box;box-orient: horizontal; &quot;>    <div id=&quot;left&quot;> ... </div>    <div id=&quot;mid&quot; style=&quot; box-flex: 1 &quot;> ... </div>    <div id=&quot;right&quot;> ... </div> </div> dialog box-pack box-align
���求 0 图片请求的极致 radius gradient shadow stroke Data URI mask transform appearance reflect
transition
Animation
从页面仔到动画设计师蜕变
好处? 提升产品口碑 提升产品体验 提升产品可用性
挑战? 不断关注和坚持 差异化是不可避免的战争 HTML5 ~= html + CSS3 + Javascript
机会? web  是未来
我们就是未来!

More Related Content

陈子舜-Html5 based web app