27
4006-5666-83
当前位置:首页 > 资讯 > 建站知识

Web与App实践用户体验篇之如何针对多种屏幕尺寸设计合理的移动应用

2012-02-03 酷站科技
作为一个挪动web网站的室内设计师,除非是你仅仅对于某类特殊的机械设备设计,不然你应该会经常遇到那样的难题:怎样清晰地掌握网址运作机器设备的显示屏尺寸尺寸?这个问题一直困惑着移动终端上的室内设计师。

比如:

iPhone的高宽比是480个清晰度,宽320清晰度。

很多Nokia N系列产品机器设备的总宽为240清晰度,高宽比为320清晰度。

很多升级款的机器设备适用总宽和高宽比错乱的主视图。

老款的Nokia(现阶段依然较为时兴)机器设备显示屏的规格从176×208到352×416不一。

Blackberry显示屏的屏幕分辨率也是以160×160到324×352各种各样规格都是有。

文中借以表明怎样对于丰富多彩的移动终端和显示屏尺寸,有效地设计方案运用主视图。最先明确提出2个小显示屏设计方案中的至关重要的问题——显示屏和像素大小的多元性。

解决多元性

如今你很有可能会问一下自己“我的设计方案确实必须考虑全部这种不一样的显示屏尺寸吗?”,或是是“我是不是应当为每个不一样的机器设备专业设计方案一个版本号?”这彻底在于你的新项目的商业服务规定,有的设计方案很有可能只必须考虑一种显示屏尺寸——也就是说是一种机器设备就充足了。但假如新项目规定你的设计方案务必适用大部分的流行机器设备,那麼你也就务必寻找一种解决多种多样显示屏尺寸的合理方式 了。

无需惊慌,事儿沒有那麼恐怖。在设计方案挪动web时,你彻底能够 假定网页页面是能够 左右翻转的——如同桌面上电脑浏览器中的运用一样。那样就无需考虑到显示屏的高宽比难题了,你能将关键的活力集中化在处理设备显示屏的总宽到了。幸运的是,DeviceAtlas Explorer早已出示了很多现有机器设备的显示屏总宽统计数据了。

如同数据图表所显示,大部分的显示屏总宽关键集中化在128,240和176清晰度这几类种类中——而剩下的集中化种类:120,130,160,208和220清晰度——和数最多的三种种类值也相距并不大。也有一小部分的显示屏尺寸总宽为96,101,320或者超过320清晰度。显示屏总宽小于128清晰度的机器设备只占了不大的占比,一共有469个机器设备。

也有一点,不上5%的机器设备总宽超过320个清晰度。但这一数据很有可能会在未来有一定的提高,现阶段早已能够 见到,小显示屏(128,176等)机器设备正慢慢被显示屏(240 )机器设备所替代。下边的数据图表得出了有关的剖析。

显示屏的屏幕分辨率确实很重要,但也有一点一样也务必考虑到——显示屏的物理学规格。

‘清晰度难题’

这些年,室内设计师主要是对于大中型的桌面上机械设备设计主视图。虽然显示屏的物理学规格很有可能各有不同,但显示屏的规格基础都为1024×768清晰度;普遍的屏幕像素密度为85 ppi(pixels-per-inch)。可是近期,显示信息的主视图刚开始发生了一些转变:

Asus Eee PC 900上网本的屏幕分辨率为1024×600清晰度,屏幕像素密度约为133ppi。

Apple iPhone的屏幕分辨率为320×480清晰度,在其中屏幕像素密度为160ppi。

Nokia的E60显示屏的屏幕分辨率为416×352,而屏幕像素密度是240ppi。

为了更好地适用多种多样机器设备,屏幕像素密度的不一样将产生新的难题;清晰度的尺寸也将危害全部设计方案的实际效果。

下面的图显示信息了在屏幕像素密度为72,144和240ppi的机器设备上,100×100清晰度的图象的显示信息实际效果。伴随着照片愈来愈小,图象的样子和一些关键点都有一定的形变。

幸运的是,追求完美高屏幕像素密度的热潮好像早已过去,现阶段超出200 ppi的机器设备还并不常见了。这代表着,你并并不是确实必须适用图中中列举的全部的屏幕像素密度。可是,在设计方案的情况下,你需要记牢,不可以主观臆断地觉得全部的机器设备的清晰度全是相同的。必须保证以下几个方面:

明确你需要适用的屏幕像素密度的范畴。

在真正机器设备上检验你的设计方案,防止一些极端化的状况被你忽视了。

应用相对性企业设计方案和界定合理布局原素,例如ems或者百分之百。这将出示一个更真正的合理布局原素规格和位置信息。

因为生产商要想提高电脑操作系统的协调能力,因而‘清晰度难题’将遭受愈来愈多的关心。实际上,Google的Android系统软件早已完成了一个“>potentially interesting solution”计划方案来处理清晰度的难题。Android电脑操作系统选用了一个抽象性的‘dp’(单独屏幕像素密度)企业,它是根据160 ppi屏幕规格的。这样一来,设计方案工作人员就能应用相对性尺寸界定字体样式及其别的页面原素了,进而依据机器设备的简直规格自动调节主视图了。

来源于申明:以上内容一部分(包括照片、文本)来自互联网,若有侵权行为,请立即与本网站联络(010-57218159)。
如没特殊注明,文章均为酷站科技原创,转载请注明来自http://www.bjkuzhan.com/jianzhanzhishi/4691.html
联系专业的商务顾问,制定方案,专业设计,一对一咨询及其报价详情
服务热线服务热线 4006-5666-83
联系我们 contact us
4006-5666-83
400-6566-683 — 海淀营业部
400-6566-683 — 昌平营业部
+

酷站科技为你提供上门/网站策略方案

留下联系方式,我们将会在一个工作日内与你联系

隐私条款信息保护中,请放心填写