AirJD 焦点
AirJD

没有录音文件
00:00/00:00
加收藏

移动互联网发展趋势报告-HTML5富交互与社交传播 by 潘征@百度

发布者 html5
发布于 1435733199869  浏览 2003 关键词 HTML5, 行业报告 
分享到

第1页

百度FEX

HTML5富交互与 社交传播



潘征



第2页

移动互联⺴⽹网发展趋势报告(2014Q2)



第3页

通过社交⺴⽹网络进⾏行传播

❖ 微信朋友圈的“刷屏”现象! ❖ 上线两天,PV70万! ❖ 引起了巨⼤大的反响(QQ群瞬间爆满)! ❖ 之前通过PC端的推⼴广并没有如此好的效果(世界杯专题

为例)



第5页

传播物料的制作

制作适合移动端 社交传播的⻚页⾯面



你⽤用⼿手机看什么?



第6页

你⽤用iPhone4还是iPhone5?



不同分辨率下的页⾯面展⽰示

标题 图表区域

页脚



中! 间! 部! 分! 根! 据! 屏! 幕! ⾼高! 度! ⾃自! 适!





第7页

固定最⼩小⾼高度

地址栏是抢夺⾯面积的⼤大⿇麻烦

同⼀一设备上! 不同打开场景的区别



第8页

利⽤用重⼒力感应实现封⾯面效果——移动端特有的体验



第9页

devicemotion事件

accelerationIncludingGravity



第10页

图表部分的实现

SVG+css3动画+图⽚片



第11页

动画效果性能优化

❖ 尽可能⽤用css3动画代替js更改margin等属性! ❖ 减少页⾯面dom数量



第12页

减少⻚页⾯面DOM数量



原本是这样



现在是这样



第13页

更低端的情况?

当 狂拽酷眩的



遇上



css3动画 svg

拖动特效



第14页

卡死啦!



第15页

低端⼿手机降级⽅方案

⽤用图⽚片代替复杂的交互,传达信息



第16页

然后就可以——



第17页

通过UA判断需要加载哪⼀一套⻚页⾯面

ios设备和安卓4.0以上版本加载⾼高端版 其他移动端加载简略版 PC端加载pdf



第18页

移动端是传播的⼤大户

❖ 微信! ❖ 微博! ❖ 百度移动⾸首页



第19页

内容+效果+平台=传播

❖ 好的内容不⼀一定能引起传播! ❖ 通过新颖的形式勾起传播欲望! ❖ 社交⽹网络是传播的天然平台



第28页

http://shushuo.baidu.com



第29页

半⼩小时=五千万PV 的神话

“硬的”⼩小游戏平台 end.baidu.com



第30页

“硬的”游戏



第31页

流量⾼高峰的引爆点——疯狂⼿手指

扫⼆二维码开始玩疯狂⼿手指



第32页

完全没有进⾏行刻意推⼲⼴广

❖ 朋友圈的病毒式传播! ❖ ⽆无脑+可分享+有⼀一定趣味性



第33页

“Thank you”

——潘征



支持文件格式:*.ppt, *.pptx, *.pdf
上传最后阶段需要进行在线转换,可能需要1~2分钟,请耐心等待。