【问题标题】:default web page width - 1024px or 980px?默认网页宽度 - 1024 像素还是 980 像素?
【发布时间】:2012-05-19 07:07:43
【问题描述】:

在开发 Web 应用程序时,过去选择800px1024px 以适应用户的监视器。我一直在研究响应式网页设计和流体设计,似乎很多都定义了980px 宽度。随着智能手机和平板电脑的加入,并考虑到其他可能的视口

980px新的事实标准吗?

谢谢。

【问题讨论】:

  • 我使用宽度为 1024px 的垂直显示器,并且我开始看到许多流行的网站,如 facebook 和带有滚动条的堆栈溢出。为什么人们会放弃这样的较低宽度?

标签: css responsive-design


【解决方案1】:

我的设计主要使用 978 像素宽度。 进阶。 978 像素: 可以除以 2,3。

【讨论】:

  • 太聪明了,我没想到。
  • 我使用 980,因为在考虑列上的常见填充时,它也分为 2 和 3。
  • @Brad 980 不分为 3。
  • @sudip 我想问一些关于响应式网页设计的想法。我不能在这个网站上问这些问题。如果你给你一些时间,那对我来说将是非常有利的。我的邮件 ID 是 kishor.wire@gmail.com。只需 ping 这个。
  • As 360可以分为2、3、4、5、6、8、9、10、12、15、18、20、24、30、40、60、90、120和180,因此任何 360 的比率(如 1080)都是不错的选择。更大的 360 比率可以划分为更多的数字。如果1080比你选择的大,我觉得还是用960比较好,但是978不能除以4、5、8或者其他一些大小。
【解决方案2】:

980 不是“事实上的标准”,您通常会看到大多数人的目标尺寸略小于 1024px 宽,以考虑浏览器镶边,例如滚动条等。

通常人们的目标宽度在 960 到 990 像素之间。人们经常使用网格系统(如 960.gs),它对默认宽度应该是多少有意见。

另外请注意,最近最常见的屏幕尺寸现在平均比 1024 像素宽大很多,排名在 1366 像素宽。见http://techcrunch.com/2012/04/11/move-over-1024x768-the-most-popular-screen-resolution-on-the-web-is-now-1366x768/

【讨论】:

  • Twitter bootstrap 也是 980px。
【解决方案3】:

如果不是这样,我可以看到事情朝着那个方向发展。

我正在为我工​​作的公司重做网​​站,他们聘请的设计师使用了 960 像素宽度的布局。还有一个 960 像素的网格系统似乎越来越流行 (http://960.gs/)。

我已经有几年不接触网络了,但从我读到的内容来看,960/980 似乎是正确的。对于移动设备,我想到了 ~320px,960 可以整除。 960 也能被 2、3、4、5 和 6 整除。

【讨论】:

    【解决方案4】:

    这是一个开放式问题,因为屏幕尺寸一直在变化,而两年前可能正确的内容现在可能已经过时了。

    我目前使用 Twitter Bootstrap 3,它使用流体网格系统,设计用于从移动/非常小的尺寸一直到现在可用的巨大宽屏显示器。

    目前 BS3 中的上限默认值为 1200 像素,在考虑到网格元素的边距和填充后,这转换为 1144 像素的容器宽度。

    根据我的经验,现代设计师正在为桌面设计大约 1366 像素的宽度。我最近得到实施的所有设计都是 1366 像素。

    还请注意,您可以大量自定义 BS3 网格。例如,我们将在未来的网站/设计中使用 32 列网格和 4 像素间距。

    最终需要根据您的网站分析和访问者通常使用的屏幕尺寸来决定页面宽度。

    【讨论】:

      【解决方案5】:

      即使这个问题没有正确或错误的答案,但我个人更喜欢 960px 宽度。 因为所有现代显示器都支持至少 1024 × 768 像素分辨率。 960 可被 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。这使其成为一个高度灵活的基数。

      请参阅这篇文章,其中显示了美国和英国最流行的屏幕分辨率 2013-2014: http://www.hobo-web.co.uk/best-screen-size/

      【讨论】:

        猜你喜欢
        • 2013-11-25
        • 2014-11-02
        • 2014-08-23
        • 1970-01-01
        • 2013-03-30
        • 2016-08-04
        • 2010-09-24
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多