全国服务热线:
0791-88196636

嘉兴网页设计:Web与App开发多种屏幕尺寸设计数据资料分享

 二维码 16220
发表时间:2020-12-16 09:49作者:南昌莫非网络科技公司来源:南昌网页设计网址:http://www.ncmofei.com

嘉兴网页设计:Web与App开发多种屏幕尺寸设计数据资料分享。

一个移动web网站的设计师,除非你只是针对某种特定的设备设计,否则你应该会常常碰到这样的问题:如何清楚地了解网站运行设备的屏幕尺寸大小?这个问题一直困扰着移动设备上的设计师。

例如:

iPhone的高度是480个像素,宽320像素。

许多Nokia N系列设备的宽度为240像素,高度为320像素。

许多更新款的设备支持宽度和高度颠倒的视图。

旧款的Nokia(目前仍然比较流行)设备屏幕的尺寸从176×208到352×416不等。

Blackberry屏幕的分辨率也是从160×160到324×352各种尺寸都有。

本文意在说明如何针对丰富的移动设备和屏幕尺寸,合理地设计应用视图。首先提出两个小屏幕设计中的关键问题——屏幕和像素大小的多样性。


处理多样性


现在你可能会问自己“我的设计真的需要满足所有这些不同的屏幕尺寸吗?”,或者是“我是否应该为每种不同的设备专门设计一个版本?”这完全取决于你的项目的商业要求,有的设计可能只需要满足一种屏幕尺寸——或者说是一种设备就足够了。但如果项目要求你的设计必须支持大多数的主流设备,那么你就必须找到一种处理多种屏幕尺寸的有效方法了。


不用慌张,事情没有那么可怕。在设计移动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屏幕尺寸的。这样一来,设计人员就能使用相对大小定义字体以及其他界面元素了,从而根据设备的真是尺寸自动调节视图了。


企业新闻
关于南昌莫非网络科技公司2021年国庆节放假安排通知。根据《国务院办公厅关于2021年部分节假日安排的通知》(国办发明电〔2020〕27号),结合我单位工作实际情况,现就2021年国庆放假的有关事项安排如下。
南昌莫非网络科技公司2021年中秋节放假通知.一、假期从:2021年09月19日到2021年09月21日结束,假期共3天(9月18日正常上班,9月26日正常休息)。二、如有紧急情况,请各位同仁及时配合相关部门主管人员把事情处理妥善。做好防火、防盗工作并督促各部门关好办公区域的门、窗等。
根据《国务院办公厅关于2021年部分节假日安排的通知》(国办发明电〔2020〕27号),结合我单位工作实际情况,现就2021年端午节放假的有关事项安排如下:一、放假时间:2021年6月12日(星期六)至2021年6月14日(星期一),共放假3天。
南昌莫非网络科技公司2021年五一劳动节放假通知.现就2021年五一劳动节放假的有关事项安排如下:一、放假时间,2021年5月1日(星期六)至2020年5月5日(星期三),共放假5天。4月25日(星期日)上班,5月6日(星期四)正常上班。
南昌莫非网络科技公司2021年清明节放假通知.2021年4月3日(星期六)-2021年4月5日(星期一)放假,共3天。4月6日(星期二)正常上班。放假期间,各项业务照常运行,售后问题您可以直接相关负责人提交服务单,技术人员将在12小时之内处理。
关于南昌莫非网络科技公司2021年春节放假安排通知.一、春节放假时间:2021年2月5日(农历腊月二十四)至2021年2月18日(农历正月初七)放假,共13天,2月19日(星期五)开始上班,2月21日星期日(农历正月初十)恢复正常上班。由于疫情,假期时间可能会有所变化,具体以通知为准。
关于南昌莫非网络科技公司2021年01月01日元旦放假通知。一、放假时间:2021年1月1日(星期五)至2021年1月3日(星期日)放假,共3天;2021年1月4日(星期一)正常上班。公司放假期间如有相关业务及服务事宜敬请拨打我司24小时服务热线:0791-8819-6636或咨询客服QQ:2401077293,可随时与我司进行联系。
南昌莫非网络科技公司2020年中秋节+国庆节放假通知。根据《国务院办公厅关于2020年部分节假日安排的通知》,为了让大家度过一个充实、平安的假期,现把2020年中秋国庆放假时间及温馨提示通知如下!
南昌莫非网络科技公司2020年五一放假通知.在过去的岁月里,南昌莫非网络科技公司与新老客户一直保持着愉快的合作,这离不开大家的鼎立支持和帮助。在未来的日子里还需要更多朋友们的支持与帮助,希望你们能始终如一的支持南昌莫非网络科技,并提出您宝贵的意见及建议。
南昌莫非网络科技公司2020年春节寒假放假安排通知。南昌莫非网络科技公司提前祝全国合作伙伴新春快乐、阖家幸福!预祝全体员工春节快乐!
南昌莫非网络科技公司2020年元旦节放假安排通知.元旦将至,南昌莫非网络科技公司预祝全体员工元旦快乐!现将2020年元旦节放假安排通告如下:一、放假时间:2020年1月1日,共1天。
2019年南昌莫非传媒国庆节放假通知。南昌莫非传媒全体员工祝愿您国庆节快乐,诸事顺利!根据国务院办公厅通知及结合本企业的实际情况,经公司领导层决议,我司现将2019年国庆节放假安排如下。
网站建设行业方案
网站维护知识
网站制作常见问题
SEO网站优化教程
踏上云端,转型升级融入互联网时代,现在就联系我们吧!
——      我们时刻为你提供更多优质互联网技术服务      ——
姓名:
*
联系方式:
*
咨询项目:
内容:
*
在线留言
关于我们:南昌莫非文化传媒有限公司(简称:莫非传媒)专注于网站建设,网站SEO优化,小程序制作。提供全方位用户体验规划,品牌形象设计服务。为每一位企业客户的成长、腾飞助力!        网站建设、网站设计、网站制作、网站开发,就选网站建设公司-南昌莫非传媒!
扫一扫微信便捷交流
|
|
|
|
|
|
|
|
|
|
|
|
|
地址:江西省南昌市西湖区洪城路6号国贸广场A座巨豪峰
业务咨询  :  
272482065
售后服务 :
2401077293
服务热线:
0791-88196636
______________________________________________________________________________________________________________________________________________________________________________________________________