屏幕分辨率如何影响移动 Web 应用程序的设计?
我一直在做一些关于创建移动网络应用程序的研究,我已经进入了设计阶段,作为一些研究,我编制了当前一代智能手机的屏幕尺寸和分辨率的列表。
所以我们都知道,市面上有大量的手机,每种手机都有不同的屏幕尺寸,但是在设计我的移动 Web 应用程序(或两者)时,我是否应该考虑物理屏幕尺寸或分辨率?
干杯, 内华达
I have been doing some research into creating a mobile web application, I have got to the design phase and as a bit of research I have compiled a list of the current generation of smart phones their screen size and also their resolutions.
So we all know that there are a tonne of mobile phones out there each with different screen sizes, but should I be looking at physical screen size or resolution when designing my mobile web application (or both)?
Cheers,
IW
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
设计移动网站时,物理屏幕尺寸和分辨率都很重要。
屏幕尺寸很重要,因为它将定义网站上可以放置的内容量,并定义点击区域的大小(对于触摸输入设备至关重要)。
分辨率将决定页面上可以包含的细节量,这会影响图形等内容。
关于如何使您的网站在各种设备上正常运行的一些建议:
Both physical screen size and resolution are important when designing a mobile web site.
Screen size is important because it will define how much content can be placed on the website and also define how big your hit areas can be (essential for touch input devices).
Resolution will determine the amount of detail you can have on your page, this affects things like graphics.
A few suggestions as to how you can make your website work well across a range of devices:
当然,这对于布局 UI 组件非常重要。专为较大屏幕设计的应用程序可能最终会显示太小的字体/控制元素等,如果您只是盲目地将其缩小以适应较小的显示区域,则可能无法舒适地使用。
Of course it is very important for laying out your UI components. An app designed for a larger screen may end up showing far too tiny fonts/control elements etc which may not be comfortably usable if you just blindly scale it down for a smaller display area.
不知道下面是否有帮助,但这就是我所做的;
我不使用图像作为 ui 元素,而是使用 css 和 html 元素
我没有以像素为单位定义字体大小,而是定义为中、小、大等
为了调整横幅或图像的大小,我主要使用 http://deviceatlas.com 或 http://wurfl.sourceforge.net。如果我不介意的话,我只需创建宽度不超过 240px 的图像
您也可以查看 jQuery Mobile 等框架
Don't know if below would help but here is what i do;
I don't use images as ui elements but css and html elements
I don't define font sizes in pixels but as medium,small,large etc
For resizing banners or images I mainly use http://deviceatlas.com or http://wurfl.sourceforge.net. If I can't be bothered I simply create images that aren't wider than 240px
You could also look in to frameworks such as jQuery Mobile