我的网络应用程序应针对普通的非技术用户定位什么屏幕分辨率？

Question

我注意到StackOverflow似乎将屏幕分辨率宽度定位为1024px或更高。我还检查了亚​​马逊，NBC，MSN和＆amp; AOL针对更多非专业用户，并且它们似乎都针对相同的宽度。

对于使用默认显示器分辨率/浏览器尺寸的最大横截面用户，网络应用的当前推荐宽度是1024px吗？

Answer 1

使用液体布局。然后，您可以轻松容纳从800到1600左右的所有人，并且可以使用更多的工作和护理，甚至更低分辨率的设备。如果用户发现文本太小，这也为用户@ 1024提供了一些缩放页面的余地。

请记住，像上网本这样的东西没有我们今天所期望的大屏幕。您可以使用水平滚动条，但如果您只需滚动页面以获取文本主体，那么您就会丢失。

Answer 2

在听起来如此居高临下之前，您可能想要阅读现代用户群。上网本。掌上电脑。智能手机。智能本（你做知道那些是什么，非常复杂，对吧？）。拥有纵向导向屏幕的程序员。将窗户并排堆叠的人。信息亭。

更新根据与约翰的对话，我编辑了一些问题，以改变男高音以反映他的原始意图。然而，我写的原始段落仍然是真的 - 我还没有看到最新的统计数据，但“90％的用户在浏览器上有AxB结果/窗口大小”的日子可能永远消失了，宽屏笔记本电脑和移动设备。让UI设计师的生活更加精彩：）

话虽如此，要开发一个真正可用的网站，你需要将流动的布局与理想情况下使用portlet和门户框架（想想我的Yahoo）的能力结合起来，这样人们就可以选择页面布局对他们来说最舒服。

Answer 3

充分利用 960.gs ，您将设置启动一个好网站所需的一切：）

_{（来源：balexandre.com）}

  

960网格系统旨在通过提供基于 960像素宽度的常用尺寸来简化网页开发工作流程。有两种变体：12和16列，可以单独使用或串联使用。

960 GS这是一个可爱的开始，做网页或图像，他们有几乎任何好的设计程序（Photoshop，Ilustrator，Fireworks，InDesign等）的完整模板以及 CSS generator 和 Grid Overlay 来帮助您访问该网站。

我用它，太棒了！查看demo

---

  

Nettuts有 tutorial 和 video 。 WooThemes写了一篇名为“为什么我们喜欢960.gs”的 post ，并将其作为WordPress主题的起点。讲西班牙语的人也可以通过 Jepser Bernardino 和 Miguel Angel Alvarez 查看教程。

Answer 4

性格单纯？我认为描述未洗过的群众是一种粗鲁的方式。我想每个人和他们的狗都有一个1024px宽度的显示器，感谢dell和其他人的喜欢...

Answer 5

我认为定位为“我的基数”的最大值是1280x1024，但我更有可能达到1024x768。

也就是说，在我目前的项目中，我尝试使用最小宽度为800的液体布局来容纳上网本，通常最大宽度约为1000px（通常为970）。当然，我也有自己设计的奢侈品，所以我有幸告诉IE6用户他们应该升级，这使得液体布局更容易设计。

Answer 6

要点：

  

使用浏览器的内部尺寸设置为1250x668进行设计，以满足92.7％的用户。

我喜欢被统计数据驱动。为此，W3Schools有一个不错的Browser Display Statistics页面，他们定期更新每个屏幕分辨率的新统计数据。

截至2015年1月，92.7％访问W3Schools页面的浏览器附加到大于1024x768的显示器上，但39.3％的显示器高度限制为768像素（或更低），主要原因是其中33％的浏览器1366x768显示。

不幸的是，W3Schools测量的是 screen 分辨率，而不是用于渲染网页内容的内部尺寸。获取用户window.innerWidth和window.innerHeight的统计数据真的很不错。

因为我们没有这些，所以我们必须为可能比我们自己的窗户装饰更大的窗户装饰保留空间，以及可能进一步剥离专用于渲染网站的空间的浏览器小部件。此外，并非所有用户都在最大化的网络浏览器中浏览网页，但我认为如果我们假设分辨率较低的显示器具有最大化的浏览器，我们可以忽略它。

Windows 7似乎是占用屏幕空间的最大罪犯，我的任务栏测量为30-40px（我不得不搜索屏幕截图，因为我没有运行Windows）。带有标题栏，菜单栏，书签工具栏和状态栏的Firefox可以获得另外159px，而更纤薄的现代FF仅消耗64px。让我们使用超薄版本，假设大约100px的垂直空间将丢失。最大化的浏览器似乎没有消耗任何额外的水平空间，所以你真的只需要考虑滚动条，但为了以防万一，我会为窗口边缘保留一些像素，最多可以达到30px。

几年前（当我做了比今天更多的网页设计时），我将我自己的浏览器调整为内部大小为800x550并确保大多数页面没有滚动酒吧。如今，它看起来可以扩展到内部大小1250x668左右。

您可以将它放在您的位置栏中来检查您的内部尺寸：

javascript:alert(window.innerWidth + "x" + window.innerHeight)

这些值是只读的;你曾经能够运行这样的东西来调整内部尺寸，但是（感谢滥用广告客户）it no longer works：

javascript:window.resizeTo(window.outerWidth-window.innerWidth+1250,window.outerHeight-window.innerHeight+668)

一个分手注意事项：仅仅因为您假定某个尺寸并不意味着您不应该确保您的网站仍能以较小的分辨率运行。该页面可能很难看，但它必须正常运行！