使网站布局适合低分辨率显示器有多重要?
使网站布局适合640 x 480和800 x 600的显示器有多重要?一段时间以来,我一直以至少1024 x 768的假设进行设计,但是我并不是一直在专业地工作(只是在我的网站上,这只是一个只有10-15个朋友阅读的博客)。有没有人对真实网络用户的屏幕分辨率分布有任何非传闻的统计数据?
注意1:"非轶事"是指请勿给出"我知道很多人使用640x480"或者"我的妈妈使用800x600,所以它一定很常见"之类的答案。我希望有实际数据(或者指向实际数据的链接),尤其是当它是有关一般用户的数据(而不是极客)时。
注2:我不关心像PDA和移动电话上那样的超小型显示屏(至少目前不是这样)。我只是在谈论台式机/笔记本电脑显示器。
解决方案
我认为这些天的一般假设是1024x768是可以接受的,这当然是我所选择的路线。一个不错的基准是看一下BBC之类的大型网站,他们最近改用了1024x768设计。并不是说每个站点都必须如此,对于较小的站点,我经常坚持使用800x600,这样内容就不会显得可怜:o)
这是我经常用于网络统计的来源,其2008年8月的统计数据显示800x600为7%。
这是一篇有趣的博客文章,其中根据今年2月对该特定网络站点的600万次点击给出了具体的统计信息。
前两名:47%1024x768和30%1280x1024
W3Schools跟踪各种浏览器统计信息,包括显示分辨率。我们可以在这里找到显示分辨率:http://www.w3schools.com/browsers/browsers_display.asp
当然,我们应该使用尽可能接近目标受众的统计信息。这些统计数据来自浏览W3School站点的人员(主要是开发人员)的浏览器。其他目标受众可能具有不同的形象。
Valve通过蒸汽收集有关连接它们的机器功能的数据,我们可以在此处查看结果:
http://steampowered.com/status/survey.html
请记住,这些是游戏玩家的系统,因此往往比街上的普通PC更为强大,因为我们可以看到在1024 * 768以下的系统并不多
我刚刚检查了我监视的所有域的Google Analytics(分析)数据。小于800x600的屏幕分辨率为零,而对于800x600则为3-6%
也许我们可以提前在域上进行Google Analytics(分析)设置,并收集有关访问者的一些信息。
我们正在我的网络浏览器中运行。即使我使用的是1024x768,我们如何确定我的浏览器是全屏的?
如果可以让网站支持稍低的分辨率,那可能是值得的。这样,人们可以在非全屏窗口中运行网站,它仍然可以正常显示,并且不会显示难看的滚动条。
另外,诸如"华硕EEE"之类的"上网本"也越来越受欢迎,它们通常具有较小的屏幕(9-10英寸),分辨率非常适中(例如800x480或者1024x600)。
虽然我同意1024x768通常是一个很好的最低桌面分辨率,但我似乎花了更多的时间通过较小的面板(特别是Windows Mobile设备,iPhone,有时是800 x 480的eeepc)在网站上进行后期窥视。
尽管eeepc可能不常见(毫无疑问将被机器类替换为1024x768),但移动设备的访问只会增加,这是明智的,尤其是当我们运行人们希望连接的那种站点时远离桌面,以了解网站在手持设备上的工作方式。
看,显示器越来越大,人们越来越需要它。人们喜欢更大的显示器。仅有小型显示器的人将是共享的计算机中心或者一些老年人。
@All,我们需要以开发人员的身份加入在一起,并且只需要在1024x768上构建应用程序。如果我们都团结在一起,我们将使其成为标准。
不要问显示器可以为我们做些什么,不要问我们可以对显示器做些什么!
根据雅各布·尼尔森(Jakob Nielsen)的Alertbox,到2006年7月,60%的监视器设置为1024x768,因此,他的建议是针对该分辨率优化网站。
为较低的分辨率设置网站样式有多重要?我想答案取决于网站在800x600(及以下)分辨率下的外观...如果无法读取,则表示该受众对于网站的重要性。如果我们需要每个查看器,无论他们的分辨率如何,那么我们都应该使用可为偶尔的640x480人带来可忍受的体验的风格。如果不是这样,我们可以尝试像以往一样设计样式,并且仅在有业务案例的情况下才使用其他样式。
免费向网站添加Google Analytics(分析),数据将仅与受众有关
我认为真正的答案是设计网站,使其以较低的分辨率优雅地降级。在内容的主要列的左右各有一个不会改变大小并导致我们网站的主要内容变窄的条形并不是一个好主意。
就像已经指出的那样,仅仅因为一个人以1280x1024的速度运行并不意味着他们的Web浏览器将被最大化,有些人坚持在非最大化的窗口中运行所有内容(我认为Mac曾经强制执行此操作)。但这并不是说只有十个工具栏并且只能以800x600的速度运行的人,因为操作系统不再允许他们将其转到640x480(然后他们想知道为什么在LCD屏幕上一切看上去"模糊",为什么他们的眼睛会屎)
当然,以这种方式设计网站并不总是一件奢侈的事情,有时客户会希望其像素达到Photoshop所设计的巨大显示器所要求的像素。只要尽力而为,然后准备准备有一个"这就是我们想要的"论据(假设我们无法事先成功地向他们解释)
我是否可以建议我们使用适合浏览器窗口大小的自动调整大小的布局,而无论大小是多少?尽管我们可能会将其设计为在1024x768上看起来最好,但是分辨率较低的人(例如,由于视力不佳或者便宜的计算机)根本无法使用分辨率较高的内容,也不必左右滚动即可阅读每一行文字。
这是一个有趣的答案,但需要注意的一点是...
我们为内部使用的客户端设计了一个Web应用程序(实际上是瘦客户端Intranet应用程序)。有人告诉我们,最好使用1024x768的设计,因为几乎所有用户都具有该分辨率或者更高的分辨率。实际上,我们被告知要忽略用户以较低分辨率运行时报告的任何问题,因为他们的内部帮助台回答是"将分辨率设置为1024x768或者更高,并在浏览器最大化的情况下运行"。
部署该应用程序后,页面上出现了帮助台票证,这些票证需要太多的水平滚动,并且某些内容放置不正确,但报告的分辨率为1024x768. 我们没有考虑的是使用浏览器侧栏(历史记录,书签,RSS提要等)的用户。我们的开发人员都没有使用过它们,因此从来没有想过。未正确定位的零件对我们而言是真正的错误。水平滚动是因为我们将所有内容都设置为自动调整大小,但将水平调整大小停止为768(实际上,客户区域的宽度为1024x768)。
同样不要忘记,用户可能会将其文本大小设置更改为奇怪的设置。实际上,当视力受损的用户时这并不奇怪,但是记住要进行测试并适应它很重要。 Firefox 3在按比例调整文本和图像方面做得很好,但是运行其他版本和较旧版本的浏览器的用户的控制较少。
一个好的做法是将网站的核心设计在大约750像素以内,以便我们仍然拥有800像素显示器的5%-15%的观众无需滚动即可阅读它。然后,我们可以在不重要的信息(广告,非关键任务功能)的右侧添加一个250px的列,该列对于1024px或者以上的访问者将是可见的。
另外,正如jimharries99所建议的那样,屏幕(或者浏览器等)的互联网范围内的统计信息可能与受众群体资料不匹配,因此我们应该使用分析方法来掌握特定受众群体。例如,我们建立的某些网站的流量大部分来自某个政府机构,该机构使用IE6进行标准化(禁止使用其他浏览器),并且具有800x600的大量显示。另一方面,《连线杂志》的观众可能比一般人拥有更大的屏幕和更现代的浏览器。
我的屏幕尺寸为1920 X 1200,因此我可以一次打开多个窗口并全部查看。如果一个站点贪婪地尝试使用所有空间供自己使用,我将停止访问该站点。
就个人而言,我设计网站的目的是使它们像我预想的那样出现在1024 x 768显示器上。我知道有人会打开浏览器窗口,也有人会拥有更大的显示器并全屏运行。
我认为1024 x 768目前是妥协的水平。同时,我尝试确保我的网站以可接受的较低分辨率降级,以使以窗口模式运行浏览器的人们也感到满意。如果推到顶峰,但我别无选择,我宁愿排除较低的分辨率,并保持自己的视野不变,以免失去它的影响力。
但是,对于现代浏览器而言,用户可以进行缩小,因此,如果站点的布局对于资源而言太大,则根据站点的内容,可降解性的问题就不那么重要了,用户可以简单地缩小。
这是设计宽度为700-800像素的网站的两个原因。
- 当列不太宽时,文本更易于阅读。如果我们使用400-500像素宽的文本,则可以容纳250-400像素的侧边栏,这对于所有尺寸的屏幕都适用。
- 页面打印得更好。我运行的网站上有许多用户可以打印的信息,并且在打印CSS中禁用了侧边栏,这些页面非常适合放在一张纸上。