即使我设计的分辨率为 1024 像素，我的大部分模型都以 1200 像素宽开始。我在模型中设置了 1000px 的指南。高度可能会有所不同。我让我的模型文件更宽的原因是为了看看设计感觉如何，周围有呼吸空间。这些天大多数人使用高于 1024 像素。

设计网页模型是否有标准宽度？

是的，不，也许？

曾几何时（见下文）网页设计主要试图创建一个可以很好地适应大多数屏幕的单一视图。在过去五年中，随着响应式网页设计 (RWD) 的采用，这种情况发生了巨大变化。

RWD 是一种设计原则，其设计方式使设计能够合理地适合任何设备，而不管设备的大小。

在 Web 开发中，媒体查询通常用于根据多种因素将不同的样式集应用于网页。一些常见因素包括：

• 当前屏幕宽度
• 当前屏幕高度
• 设备宽度
• 设备高度
• 设备方向

由于样式可以针对特定的屏幕尺寸，因此创建针对特定范围的多组设计并不少见。

需要明确的是，没有固定的“标准”。没有管理机构或组织说“设计师应该按照这些尺寸指南进行设计”，因为最终这是一个判断电话。

话虽如此，Web 开发行业已经有机地提出了一组反复出现的常见断点。

典型的断点是针对当前屏幕宽度的，通常是：

_单位在px

• 320
• 480
• 768
• 1024
• 1200
• 1600

这些具体数字的原因很普通。初代 iPhone 的屏幕尺寸为 320×480；初代 iPad 的屏幕尺寸为 768×1024；1600×1200 对于较大的屏幕分辨率很常见。

虽然在部分或全部断点处看到模型是很常见的，但需要提供显示中间设计拐点的特定页面的多个渲染也是很常见的。

以 768 像素宽显示堆叠项目的流体宽度组合可能需要包含 900 像素的设计，其中项目已切换到两列。如果您发现需要为这些中间断点提供多组设计，我强烈建议您设计单个组件并显示组件在每个组件基础上更改的断点，而无需在模型中包含页面的其余部分。

这也有助于避免常见的设计缺陷，即特定 UI 组件丢失或断点之间不一致。

以下是我为后代保留的这个答案的旧版本，但它已经有一段时间不相关了

我很惊讶还没有人提到这一点：

谷歌有一个很好的开发工具叫做

浏览器大小

它应该几乎可以单独回答您的问题。

我对当前趋势有几点说明：

目前绝大多数用户的分辨率为 1024x600（平板电脑/上网本）或更大。您必须记住删除24px滚动条的 about，这会留下一个很好的 1000 像素宽度。至于高度：网络用户非常擅长垂直滚动，因为他们已经习惯了鼠标滚轮。初始高度对于第一印象很重要。

用户不太擅长水平滚动，因此不建议使布局宽度超过 1000 像素。

此外，许多屏幕较大的用户不会将整个屏幕用于他们的 Web 浏览器。尤其是现在 Windows 7 包含简单的拖放功能，可将窗口拖放到屏幕的一半上。

总之：

• 避免静态宽度超过 1000 像素
• 确保您的第一印象在 1024x600 时看起来不错
• 不要害怕将内容放在首屏以下。

简短回答：800x600 为 775x400，1024x768 使用 1000x500。

长答案：您永远无法确定您的演示文稿在您的客户端计算机上看起来是否正确（它可能有不同的操作系统、浏览器、不同的校准显示器，或者设置了大字体以更好地阅读的较低分辨率）。出于这个原因，如果可以的话，我倾向于总是在我的电脑上显示演示文稿。

如果我不能在我的电脑上显示尺寸问题，我会使用我的个人规则（不要把我的尺寸当作神圣的尺寸，每个人都有自己的）：

作为安全尺寸，它可以很好地优化 800x600（删除滚动条和顶部栏，我使用 775x400 作为“线上方”）。但是现在有了更便宜的屏幕和更宽的标准，我开始为 1024x768 (1000x500) 设计

重要的是优化不是针对高度而是针对宽度。高度可以通过简单的鼠标滚动来解决，如果您没有mac鼠标，则无法水平滚动以查看更多信息。然而，最好知道屏幕底线的位置或多或少，即使无法精确确定。

注意：即使在 1000 像素上，我也使用如此低的高度，因为人们往往在基本浏览器上拥有很多额外的滚动条（例如 GoogleRank 或书签等），所以我总是喜欢为最坏的情况进行设计。

PS对不起我的英语不好:)

我们有一个跟踪程序，可以告诉我们有关用户的信息。超过一半的分辨率为 1024x768。所以我用它作为“标准”显示器尺寸。

但是，这不是您网站的活动区域——人们有侧边栏，他们并不总是全宽打开浏览器窗口，等等。

我喜欢960格系统。数字很​​灵活，网站提供了大量模板供下载。我将它用于我的模型，到目前为止，每个人都非常高兴。