我正在设计一个Web应用程序,我希望知道我可以设计的最大尺寸(x和y).
截至2008年1月,大约一半的用户使用1024x278屏幕,可能只有不到10%的用户使用较小的屏幕.(手机和掌上电脑用户都是例外.)因此我们设计的最小屏幕尺寸为1024x768.
然而,这是屏幕尺寸,当我们布置我们的内容时,我们需要知道视口大小.有证据表明,大多数用户都将浏览器最大化,但仍需要减去操作系统装饰和浏览器镶边的空间.人们定制他们的铬,所以没有单一的"正确"答案; 我想要一个能够容纳大多数用户的合理范围.
我看到很多设计师说他们使用的宽度为960像素,因为它有很多因素可以均匀划分 - 但在决定之前我想知道我可以逃脱的最大尺寸,然后我可能会选择少用一些.我已经看到引用的最大宽度为960,974甚至990 ......我自己的实验似乎显示宽度为1000的工作正常.
高度更难以得到:我发现我可以在我尝试过的浏览器上使用595像素的垂直视口高度,具有典型的默认操作系统和镶边设置.但我没有尝试过很多,我宁愿看到一个更权威的来源.肯定有人做过这项研究并且做得比我好.
所以我真正的问题是:我可以设计的最大视口大小是什么,并期望它适合所有用户的80-90%没有滚动条？
今天我刚遇到一个与我这个老问题高度相关的网站.显然,谷歌愿意分享他们对浏览器窗口大小的了解.他们的新服务位于http://browsersize.googlelabs.com/,它基本上只显示了他们在典型浏览器门户网站大小上的数据.
注意:Google实验室的浏览器版本现已过时(图片标题为2009-11-18-day_google_com_100_donate_example.png),很快就会关闭.Google建议Google Analytics(分析)可用于确定您自己网站的浏览器大小分布:http://analytics.blogspot.ca/2012/06/new-feature-conduct-browser-size.html
确保您的网站将以800x600呈现,但要将其展开以填充用户拥有的任何尺寸.
没有什么比1600x1200或更大的冲浪更令人烦恼,只是遇到一个不会超过700-800px宽度的哑巴网站.
看看蓝色的男人是如何处理页面大小变化的一个很好的例子... http://themaninblue.com/experiment/ResolutionLayout/
更新: 我找到一个不错的网站,使用一些统计数据来确定有多少用户可以看到大小的屏幕:http://www.methodologie.com/webcanvas/
绝大多数用户在1024x 768屏幕上的最大化窗口中查看IE7中的Web,并且没有修改他们的浏览器.所以我找到了一只豚鼠并拍了一个屏幕截图.我假设任务栏是一行并且可见 - 再次,默认行为 - 并且窗口大小为1003 x 589.我亲自使用960 x 560的实时区域.
对于它的价值,在全屏XGA上打开侧边栏默认宽度的XP IE7用户获得的视口宽度为862px.高度不是那么重要,因为我们期望垂直滚动,但也必须水平滚动是死亡.
当然,为什么这可能与实际可用的不同有很多原因,这就是为什么我们都是优秀的网页设计师并使用适当的液体布局,不是我们.
(那是什么,stackoverflow？真的吗？令人震惊,tsk.)
京公网安备 11010802040832号 | 京ICP备19059560号-6 