文档介绍:移动平台系统特性分析:
iPhone和Android浏览器都是Webkit内核。
不支持Flash和Java(包括Java Applet)
不支持插件
(iPhone)不支持基于浏览器的文件下载,但Android支持zip包下载!
不支持插入本地文件,即不支持<input />上传文件。
节省缓存。iPhone仅支持小于25kb的缓存
支持cookie
界面的动态交互则可利用JavaScript来实现
支持播放html5视频
支持表格、
CSS3高级样式表
Ajax动态异步请求与局部刷新。
Opra浏览器是个异类采用Presto(Opera内核)兼容性极差,
苹果iPhone人机界面指南推荐的最小目标大小为44px宽,44px高。微软的Windows手机用户界面设计和交互设计指南建议一个最低目标尺寸是26px乘以34px。诺基亚的开发者指南建议,目标尺寸应不小于1cm×1cm平方或28×28像素。
不仅如此,小的触摸目标会导致操作错误。当几个小触摸目标彼此靠得比较近时,用户会不小心触到邻近的目标而引发意外操作。而拇指触屏时导致的错误会更明显,因为它的尺寸是最大的。所以有时用户会倾斜拇指,让其侧身去触及屏幕目标,这是一个很不必要的操作。
所以:
适于手指点触的控件尺寸是44×44pix;随手势的轻重变化,iPhone控件响应范围在22×22pix ~ 55×55pix之间。
另外。下面是一些老外的建议:
Apple’s iPhone Human Interface Guidelines建议最小尺寸为44x44pixel,Microsoft’s Windows Phone UI Design and Interaction Guide建议 34x34pixel,Nokia’s Developer Guidelines建议28x28pixel。
。
,让人一目了然如何使用你的内容
、无用的留白、花里胡哨的背景,避免用户被内容以外的视觉信息干扰。
,记忆用户信息;有策略地向用户提请求,简洁表达必要信息
(如新手任务、操作指引、功能介绍)和中断性操作(如提示、询问)。
5. 避免不必要的交互
:
足够响应范围的控件和文字链接
圆角
纸张化的扁平风格与相对立体的按钮
页面中常见图文混排
由于强大的css3的应用,很多阴影,拉伸,圆角,渐变,等可以用层叠样式实现,所以设计psd时,请尽可能用样式可以实现的设计形式,以便页面能够更快加载提升性能!
如下图中用到的按钮样式 css3皆可实现!
调整分辨率:
由于各个机型包括山寨智能机在内,各个手机分辨率屏幕大小不一。所以设计师应考虑屏幕大小对页面的影响,(横屏或竖屏)
已知尺寸如下:(基本能满足所有型号只能手机)
***@media (max-device-width: 1280px) and (orientation: landscape) { 
}
***@media screen and (max-width: 1028px) { 
}
***@media screen and (max