webapp适配基准

标签: webapp 配基 | 发表时间:2015-05-28 08:00 | 作者:崔永键
出处:http://www.cuiyongjian.com/

跨终端的实现:

1 服务端多模板渲染

2 media query。

 

移动端网络流量已经超过pc。

 

实现:

基准a: android 4.x 占了60%左右,2.3x在30%左右。 ios6.x的safari也占比很大。

基准b: 考虑一下 ios5

基准c: 考虑下ios4,以及android2.x。

 

分辨率: 第一组 “520*xxx”以下的为一组, 第二组“640*xxx,800*xxx,720*xxx”等分为一组。

android第一组的分辨率市场在70%左右。

ipad,retina屏幕占比也挺多。

 

浏览器国内市场:

点击查看原图

 

 

 

适配优先级总结:

点击查看原图

 

 

 

开发人员参考的测试标准:

点击查看原图

 

 

 

 接口:

接口由前端定义,后端开发。 接口要符合一定规范,即请求格式和响应格式。

接口开发完毕,进行接口校验,校验后前后端联调通过。

 

相关 [webapp 配基] 推荐:

webapp适配基准

- - 崔永键的博客
移动端网络流量已经超过pc. 基准a: android 4.x 占了60%左右,2.3x在30%左右. ios6.x的safari也占比很大. 基准b: 考虑一下 ios5. 基准c: 考虑下ios4,以及android2.x. 分辨率: 第一组 “520*xxx”以下的为一组, 第二组“640*xxx,800*xxx,720*xxx”等分为一组.

推荐几个Html5做的WebApp

- - CSS库
Everybody!喵~ 二当家出马,一个顶仨. 今天来不为别的,给大家推荐几点刚上线不久的WebApp. 最近涌现出了一批号称Html5版的WebApp,由于还处于社会主义初期阶段,所以鱼龙混杂,有虾米也有大鱼. 反正只要是触屏智能机打开浏览器输入以上网址然后全屏,怎么说呢. 反正你是感觉不到这是浏览器在跑的.

WebAPP ViewPort iPhone5 黑边解决方案

- - 大猫の意淫筆記
最好先仔细看一遍苹果官方文档  Configuring the Viewport. 容易被忽略的就是即使 width=640的时候,scale=1是按照device-width而不是按照640的大小. iPhone 的 device-width 等于320,如果我设置 width=640,scale=1.

webkit webApp 开发技术要点总结

- - ITeye博客
如果你是一名前端er,又想在移动设备上开发出自己的应用,那怎么实现呢. 幸好,webkit内核的浏览器能帮助我们完成这一切. 接触 webkit webApp的开发已经有一段时间了,现把一些技巧分享给大家 :. 对于桌面浏览器,我们都很清楚viewport是什么,就是出去了所有工具栏、状态栏、滚动条等等之后用于看网页的区域,.

移动webapp开发小贴士

- - 移动开发 - ITeye博客
1 创建主屏幕图标 (Creating a home screen icon ,for ios). 2 启动画面图像 (Creating a splash screen, for ios). 3 全屏 (Making it full-screen, for ios)– 更像本地App. 4 改变状态栏 (Changing the phone status bar, for ios).

WebApp将打破苹果封闭商业模式

- linsen - 互联网的那点事
由终端、操作系统、软件商店共同组成的封闭商业模式跟苹果全球排名第一的市值一样坚挺,然而建立在HTML5标准之上的基于浏览器的网络应用程序(WebApp),很有可能成为苹果AppStore的掘墓人. 基于浏览器开发并运行应用程序,是Google在设计Chrome时提出的概念,这是Google推广云计算的其中一步.

Moobile:基于 MooTools 框架实现的移动 WebApp 开发框架

- - 我爱水煮鱼
Moobile 是一个基于 MooTools 框架实现的移动 WebApp 开发框架,目前它主要在 iOS 设备的浏览器上实现原生应用的体验. Moobile 实现了很多类似 iOS 原生的控件,比如:工具栏,按钮,图片,列表,激活状态,幻灯片等等,它还实现了淡入淡出,幻灯片滑动,立体翻转等效果,还能显示类似原生的警告框.

Maven webapp 部署到tomcat的三种方式

- - 研发管理 - ITeye博客
Maven创建完webapp项目部署到tomcat有三种方式,如果有知道其他方式部署的,欢迎补充. 第一种、讲war包copy到tomcat的webapps目录下. 首先选中你的工程,右键-->Run As-->Maven install,如下图:.  等build成功后,找到workspace中的项目,然后找到target中的war包,copy到tomcat的webapps目录下启动即可.

[原]WebAPP开发之viewport的深入理解

- - woshiwanxin102213的专栏
平常移动端开发中,页面的head中都会引入下列这句话,那Viewport是什么,理解了这个才能让我们开发的网页更好适配不同的移动设备. Viewport是手机屏幕上能用来显示我们的网页的那一块区域. 但是viewport并不等于浏览器的可视区域. 可以自定义,自定义后,手机按这个尺寸的比例在可视区域缩放.

FT WebApp团队:如何打造一个FT风格的离线HTML5 web App

- - Web App Trend
为什么还有必要再写一个Offline HTML5 App指南. 现在已经有非常多的资源介绍如何写一个offline HTML5的网站了,但是仅仅让一个网站能够在离线情况下访问是远远不够的. 在这个指南中我们将搭建两个离线网站,用来向读者演示如何向一个已有的离线网站中增添功能,避免已有的用户觉得自己正在使用一个旧版本的网站.