浏览环境变化让网站设计已经不再有绝对的标准宽度

在网站建设时，大多数网站设计师首先考虑的是要设计什么样的分辨率。这实际上就是决定你的设计应该有多宽。随着手机、平板等各种终端设备广泛应用，以及各种分辨率的显示器普及，网站已经不再有标准宽度这样的东西了。既然浏览环境变化让网站设计已经不再有绝对的标准宽度了，那么在网站设计制作时如何确定网页宽度呢？这是一个问题，而且每家网站建设公司都会面对，对需要认真对待并找到解决方案。

1995年，标准640x480分辨率监视器是现有的最大和最好的监视器。这意味着Web设计人员专注于在12英寸到14英寸的显示器上制作在Web浏览器中看起来很好的页面，其分辨率达到最大值。如今，640x480的分辨率还不到大多数网站流量的1%。人们使用的计算机分辨率更高，包括1366x768、1600x900和5120x2880。在许多情况下，1366x768分辨率屏幕的设计是可行的。

在网页设计的历史上，我们不需要太担心分辨率的问题。大多数人都有大屏幕的显示器，他们没有最大化他们的浏览器窗口。因此，如果您决定设计一个不超过1366像素宽的页面，您的页面可能会在大多数浏览器窗口中看起来很好，即使在分辨率较高的大型显示器上也是如此。

在你开始思考“好的，我会让我的页面1366像素宽”之前，这个故事还有更多的内容。在决定网页的宽度时，一个经常被忽略的问题是您的客户保留其浏览器的大小。具体地说，它们是将浏览器的大小最大化为全屏大小，还是将其保持在小于全屏大小的范围内？

在对所有使用公司标准1024x768分辨率笔记本电脑的同事进行的一次非正式调查中，有两个人让他们的所有应用程序都最大化了。其余的由于各种原因打开了不同大小的窗口。这说明，如果您要将该公司的Intranet设计为1024像素宽，85%的用户必须水平滚动才能看到整个页面。

为最大化或不最大化的客户进行说明后，请考虑浏览器边界。每个Web浏览器都有一个滚动条和边框，在800x600分辨率下，可用空间从800像素缩小到740像素或更少，而在分辨率为1024x768的最大化窗口上，则缩小到980像素左右。这就是所谓的浏览器“铬”，它可以从可用的空间，为您的网页设计。

实际的数字宽度并不是你在设计网站宽度时需要考虑的唯一因素。您还需要决定是固定宽度还是液体宽度。换句话说，您是要将宽度设置为特定的数字还是设置为一定的百分比？

• 固定宽度
  固定宽度的页面和它们听起来完全一样。宽度固定在一个特定的数字上，无论浏览器有多大或多小，它都不会改变。无论你的读者的浏览器有多宽或多窄，如果你需要你的设计看起来完全一样，这是很好的，但是这个方法没有考虑你的读者。使用比您的设计更窄的浏览器的用户将不得不水平滚动，而使用宽浏览器的用户将在屏幕上有大量的空白空间。要创建固定宽度的页面，只需对页面分区的宽度使用特定的像素编号。
• 响应式宽度
  “液体宽度”页面(有时称为“灵活宽度页面”)的宽度因浏览器窗口的宽度而异。这使您可以设计更多关注客户的页面。液体宽度页的问题是它们可能很难阅读。如果一行文本的扫描长度大于10到12个单词或小于4到5个单词，则可能很难阅读。这意味着拥有大小浏览器窗口的读者都有问题。要创建灵活的宽度页面，只需使用百分比或EMS作为页面分区的宽度。您还应该熟悉CSS最大宽度属性。此属性允许您以百分比形式设置宽度，但随后会对其进行限制，使其不会变得太大以致于人们无法读取它。

目前最好的解决方案是使用CSS媒体查询和响应性设计来创建一个页面，以适应查看它的浏览器的宽度。响应性网页设计使用相同的内容来创建一个网页，无论您是以5120像素宽还是320像素宽查看该网页。不同大小的页面看起来不同，但它们包含相同的内容。对于CSS3中的媒体查询，每个接收设备都使用其大小来响应该查询，并且样式表将根据该特定大小进行调整。