7

我纯粹是从可用性问这个问题standpoint

expand/stretch当您调整浏览器窗口大小时,网站是否应该填充查看区域?

我肯定知道有明显的缺点:

  • 宽列的文本很难阅读。
  • 使用百分比编写 html/css 可能会很痛苦。
  • 如果图像太宽或添加的文本块太长,它会使您的设计容易超出其限制。(请参阅编写 html/css 代码很痛苦)。

我能想到的唯一优点是,使用浏览器中内置的字体调整大小的用户不必处理只有几个单词长的列,white-space两边都有一个正文。

但是,我认为这可能是一个浏览器问题,而不是其他任何问题(Firefox 3 允许您缩放所有内容而不仅仅是文本,这一直都很方便)

编辑:我注意到堆栈溢出是固定宽度,但编码恐怖调整大小。杰夫似乎对这两种方式都没有强烈的偏好。

4

15 回答 15

11

原始 HTML 就是这样做的。您是否正在更改您的数据,以使其在随机大小的窗口中呈现不佳?

在过去,每个人都有 VGA 屏幕。现在,该决议是最不常见的。谁知道未来会有哪些常见的决议?为什么期望某个最小宽度或高度?

从可用性的角度来看,要求用户提供一定的分辨率只会给不使用该分辨率的人带来降级的体验。另一件事是什么固定宽度?我已经看到很多固定大小的窗口(弹出窗口)无法正确呈现,因为我的字体与设计师的不同。

于 2008-08-26T03:57:04.010 回答
4

在网站缩放方面,我喜欢使用浏览器“缩放”功能很好地缩放的固定大小的网站。我不想在我的 1920 res 显示器上出现一个非常宽且字体很小的页面。我不知道网页设计师是否必须做任何事情才能使其在缩放时很好地缩放,但是 FF3 中的缩放很棒,IE7 中的缩放没用......

于 2008-08-26T04:07:56.763 回答
3

设计应该在合理的范围内流动。

使用 CSS hasmin-widthmax-widthproperties(适用于所有浏览器,包括 IE7+)来防止设计过度拉伸。

于 2008-10-19T11:20:20.553 回答
2

重要的是永远不要让文本块伸展得太宽。如果窗口被扩展,任何文本块都不应无限期地拉伸以匹配,因为阅读变得困难。

于 2008-08-29T04:59:41.917 回答
2

正如人们所说,这实际上取决于网站显示的信息。两个很好的例子是 StackOverflow 和 Google 图片。

如果 stackoverflow 被拉伸以适应屏幕,较长的答案阅读起来会很烦人,因为眼睛发现很难扫描长线 - 这正是报纸使用列来表示所有内容的原因,以及为什么书籍都是相同的宽度。

使用 Google 图片,内容基本上是一堆 200 像素宽的图片,它可以拉伸以适应浏览器的宽度,并且仍然完全可读。

基本上,请记住眼睛讨厌阅读长行文本,并以此为基础进行设计。您可以设计您的网站,因此当您增加字体大小时,所有布局都可以很好地缩放(我能想到的唯一网站是 www.geektechnique.org - 按Ctrl+ -/=Ctrl+ scrollwheel,布局会改变宽度字体大小)

于 2008-09-05T12:03:43.477 回答
1

这是样式偏好的问题。根据实现,两者都可以同样使用。如果屏幕足够宽,也可以使用列。就我个人而言,当屏幕上只有一列狭窄的文本时,我觉得很烦人。


2012 年的编辑:是的,您的网站应该响应正在显示的窗口的大小。

有很多地方可以阅读更多相关信息,包括:

于 2008-08-26T03:56:24.170 回答
1

我想很多事情:这取决于。我通常两者都做。一些内容保持固定宽度以看起来不错,或者如果它不能从更多空间中受益。如果看起来有用,其他东西设置为 100%。

于 2008-08-26T03:59:23.880 回答
1

这应该取决于您的网站设计的复杂程度。更复杂的图形或组件(内容 div 的数量)将决定您的网站的扩展程度。通常,您会发现大多数图形设计师网站不会扩展,因为它们是图形密集型的。然而,信息网站将扩展以充分利用屏幕上的可读空间,并且为便于使用并不复杂。它真的是一个偏好问题。

于 2008-08-26T14:53:23.683 回答
1

我认为这取决于网站的内容。像 SOFlow、论坛和其他网站这样的网站都强调阅读大量细节,所以在我看来,拥有更多的空间来这样做是一个很大的好处。垂直滚动越少越好。

然而,对于对阅读水平要求不高的网站,即使是博客或零售网站,您只是展示单个产品,固定宽度可以让您保持更简洁。

于 2008-08-26T15:14:43.943 回答
1

注意:如果您在浏览器中使用缩放功能,固定布局会挤压文本,而流动布局则允许它占据整个屏幕。

也许这只是一个浏览器问题,但它绝对是支持流体的论据

于 2008-09-16T02:06:30.607 回答
1

我是全流体设计的忠实粉丝。至于关于文本行太长的可用性投诉......如果由于我的浏览器窗口的大小而导致它们太长,那么我可以轻松地将窗口变窄,因为我可以使其变宽。

于 2008-10-12T22:13:35.840 回答
0

段落宽度大于您的显示会使网站完全无法使用。你必须为你阅读的每一行来回摇动水平滚动条。我在大学做网页设计科目,教科书称这些设计适合您的屏幕宽度流体布局

我正在使用流体布局设计我的大型项目,这比固定宽度要麻烦一些。我怀疑其他学生都不会使用它,标记不会注意到,我们模仿的专业网站也没有一个是流动的。

于 2008-09-05T11:11:29.830 回答
0

固定设计和流体设计之间可能存在折衷设计。您可以设计一个类似流体的站点,但将 css 属性设置max-width为 1024(或其他)。window width这意味着当小于 1024 和fixed width大于 1024 时,您将获得流畅的布局。

然后窄屏用户(比如我的 800 像素 eee 701)不必旋转水平滚动条来阅读每一行,而宽屏用户(他们不知道如何调整浏览器窗口的大小)不会得到 500 个字符宽, 1 个字符高的段落。

于 2008-09-25T08:22:16.733 回答
0

我会说一路流畅。如果用户不喜欢放大窗口的结果,他总是可以返回到较小尺寸的窗口,但对于固定布局他无能为力。

如果您真的非常讨厌因为大屏幕用户所做的事情而使您的网站看起来很丑,那么为了所有这些真实和美丽,至少不要使用基于像素的固定布局!CSS 有这些整洁的文本相对大小单位,例如“em”,它允许页面的某些部分随字体大小缩放,而其他部分(如图像)保持“自然”大小。

Why not use them and make your page scale well without relying on the less flexible "scale everything" of FF3 that's really just a workaround for sites that use a dumb pixel-based fixed layout?

于 2009-03-07T09:30:40.373 回答
0

A lot of people are saying things like "this is a matter of taste" or "I don't like big fonts on my high-pixel display." Number of pixels has nothing to do with it, and it's not a matter of taste. It's a matter of DPI, which is directly related to display resolution and font size. If your layout scales along with the DPI of the fonts (by being specified in ems for instance, and using SVG), then you end up with very beautiful, very crisp websites that work optimally with any display.

http://www.boutell.com/newfaq/creating/anyresolution.html

于 2010-02-09T23:53:53.217 回答