假设流体布局不是一个选项(因为这是一个不同的讨论),网站布局的建议宽度是多少?不同尺寸的优点和缺点是什么?

有帮助吗?

解决方案

我总是使用 960px ,因为它可以在 1024x768 上查看,并且可以被2,3,4,5,6,8,10,12完全整除,15,16,20,24,30,32,40,48,60,64,80,96,120,160,192,240,320和480 ...所以我可以拆分我的网站的设计(干净地使用三分法则。

几年后编辑: 请考虑使用 CSS媒体查询,让您的内容响应无数的设备现在,如果你不能使用流体布局。我不确定在2012年可以声称一个像素宽度来统治它们。

其他提示

查看 http://browsersize.com ,了解当前用户使用的屏幕分辨率的快速统计数据。您可以使用 http://setmy.browsersize.com 快速调整浏览器大小以模拟在特定屏幕分辨率。确保您的布局至少满足最广泛使用的屏幕分辨率(1024 x 768)。

此外,不一定要占用最大水平空间。文本的宽度(每行的单词数)理想情况下不应超过可用性的某个阈值:

  

在非常常见的1024× 768屏幕上   分辨率,大多数固定布局网站   不要使用所有可用空间   左右内容。   灵活的布局可以更好地利用   横向空间,但努力   保持可用的线长。   可用性专家告诉我们   你说的话太多了   应该排队。 8到12之间   单词似乎是理想的路线   长度。特别是印刷媒体   报纸,不要犹豫甚至使用   线条较短。为什么?因为他们可以,   通过在几个文本之间布置文本   列。

http://www.alistapart.com/articles/css3multicolumn

如果您使用比最小屏幕可能更宽的固定宽度来访问您的网站,您将会惹恼并挫败必须向侧面滚动以获取其他内容的用户。

我还使用950到980px之间的布局,除非客户要求,否则始终居中:)

  1. 请注意,统计信息中经常引用的监视器分辨率浏览器窗口的内部宽度不一定相同。用户可能有其他侧边栏/工具栏,使用非最大化的浏览器窗口。屏幕越大,您只想在一页上使用它的可能性就越小。

  2. 很长的文字行很难阅读。最佳值为25-30em(取决于很多因素,但你不应该只追求最大值)。

  3. 移动浏览器具有“虚拟”功能。用于缩放的屏幕分辨率在Opera Mini / Mobile和Mobile Safari中为~960px。

我投票将议案分开。仅仅因为屏幕尺寸为X并不意味着X或任何接近它的东西都是您网站的最佳设计。

您的网站目的与您选择的宽度有很大关系。

许多营销专家认为更狭窄的专栏“转换”。更多的销售访问。也许这是因为如果页面很窄,引导人们的注意力会更容易。

另一方面,专用于图像的网站应以每个访问浏览器的最佳可用分辨率显示。

曾经 800px ;但是,越来越多的网站开始使用 1000px 。这是因为访问者的低端分辨率往往是 1024x768 。额外的24个像素为您可能想要操作的浏览器镶边,填充和边距留出空间等。

只是为了给出一些看法,即使是新一代上网本的小屏幕也具有 1024x768 的分辨率。

但是,最重要的是,要了解@warren建议的观众并利用它。

您可以尝试开发多个布局,并根据访问者的窗口使用Javascript在它们之间切换.innerWidth

那就是说,我通常使用介于950px和980px之间的东西。

与台式机和笔记本电脑相关的最佳网站宽度可实现960px的最佳性能和跨显示器兼容性。

有关如何以及为何看到以下文章的详细信息:

屏幕尺寸和分辨率

根据这些统计数据,至少1024像素宽将覆盖大多数用户

许可以下: CC-BY-SA归因
不隶属于 StackOverflow
scroll top