网页布局可以用两种不同的方式完成：
- 固定宽度布局 - 这些布局是整个页面的宽度用特定数值设置的。
- 液体布局 - 这些是整个页面的宽度根据浏览器的浏览器宽度而变化的布局。
使用两种布局方法都有很好的理由，但是如果不理解每种方法的相对优点和缺陷，就无法对网页的使用方式做出正确的决定。
固定宽度布局
固定布局是由网页设计师确定的以特定大小开始的布局。 无论查看页面的浏览器窗口的大小如何，它们都保持这个宽度。 固定宽度布局允许设计者更直接地控制页面在大多数情况下的外观。 他们通常被具有印刷背景的设计师所青睐，因为他们允许设计师对布局进行微小调整，并使其在浏览器和计算机上保持一致。
液体布局
液体布局是基于当前浏览器窗口大小百分比的布局。 即使当前查看者在查看网站时更改了浏览器大小，它们也会随着窗口大小而变化。 液体宽度布局允许非常有效地使用由任何给定的Web浏览器窗口或屏幕分辨率提供的空间。 它们通常被设计师们所喜欢，因为他们在尽可能小的空间内拥有大量信息，因为无论谁在浏览页面，页面大小和相对页面重量都保持一致。
赌注是什么？
为您的网站设计选择的方法不仅会影响您的设计 。 根据您的选择，您将影响您的读者扫描文本，查找他们正在查找的内容或有时甚至使用您的网站的能力。 同样，布局风格也会影响您通过品牌推广，房地产可用性和网站美学来营销您的网站。
固定宽度布局的好处
- 固定宽度的布局允许设计人员构建无论谁在看他们都会看起来完全相同的页面。
- 由于整个页面的宽度将包含这些元素，因此固定宽度的元素（如图像）不会超过较小显示器上的文本。
- 无论Web浏览器有多宽，扫描长度都不会受到大量文本的影响。
液体布局的好处
- 液体宽度布局扩展并收缩以填充可用空间。
- 所有可用的房地产都被使用，允许设计师在更大的显示器上显示更多内容，但在小型显示器上仍然可行。
- 液体布局提供相对宽度的一致性，允许页面更动态地响应客户施加的限制，如较大的字体大小。
固定宽度布局的缺点
- 固定宽度布局可以导致在较小的浏览器窗口中水平滚动。 大多数人不喜欢水平滚动。
- 它们还可能在较大的显示器中产生大量的空白区域，导致大量未使用的空间和垂直滚动，而不是必需的。
- 固定宽度布局不能很好地处理客户对字体大小的更改。 对于字体大小的小增加，它们可以没问题，但是对于较大的增加，布局可能会受到影响。
液体布局的缺点
- 液体布局允许对页面各种元素的宽度进行精确控制。
- 它们可能会导致文本列太宽而无法轻松扫描，或者导致文本列太小而无法清晰显示。
- 当固定宽度的元素（如图像）放置在液柱内时，液体布局会产生问题。 如果列没有足够的空间显示图像，某些浏览器会增加列宽，忽略设计者的指示，而其他浏览器会导致文本和图像重叠以达到正确的百分比。
结论
许多需要在尽可能小的空间内传达大量信息的站点在液体布局方面效果良好。 这使他们能够利用大型监视器提供的所有房地产，同时不缩短更小的显示器。
需要精确控制页面在每种情况下的外观的网站都可以使用固定宽度的布局。 这提供了更多的保证，无论您查看的是什么尺寸的监视器，您的网站的品牌都是一致和清晰的。
布局首选项
许多人喜欢混合的方法。 他们不喜欢在大块文本中使用液体布局，因为这可能会使文本在小型监视器上无法读取，或在大型文件上无法读取。 所以他们倾向于将主要的页面列固定宽度，但是使页眉，页脚和侧栏更加灵活，以占用剩余的不动产并且不会损失较大浏览器的容量。
有些网站使用脚本来确定您的浏览器窗口大小，然后相应地更改显示元素。 例如，如果您在一个非常宽的窗口中打开这样的网站，您可能会在左侧获得一列额外的链接，具有较小显示器的客户可能看不到。 此外，围绕广告的文字取决于您的浏览器窗口的宽度。 如果宽度足够大，该网站将围绕它环绕文字，否则，它会在广告下方显示文章文字。 虽然大多数网站不需要这种复杂程度，但它演示了利用大屏幕而不影响小屏幕显示的方法。